标签：java ati echart duration span art apache vue als
原文首发于我的个人网站： https://lonhon.top/
卡顿问题出现背景：
卡顿主要表现在tooltip显示和拖动dataZoom时。
上周在使用的时候发现号称支持千万数据流畅显示的EC居然在1300*3的数据下变得很卡，一点不科学。
初步分析是xAxis.type为time导致，因为切换回category后就卡顿问题消失。
提了issue暂时无果，后来分析了一波找到以下 ** 解决办法 ** ：
得出结论是xAxis.type:‘time‘ 结合 series.showSymbol:true 导致图表卡顿。
测试地址： http://echarts.baidu.com/examples/editor.html?c=dynamic-data2
测试代码(自行更改数据量和最后两行注释)：
function randomData() {
now = new Date(+now + oneDay);
value = value + Math.random() * 21 - 10;
return {
name: now.toString(),
value: [
[now.getFullYear(), now.getMonth() + 1, now.getDate()].join(‘/‘),
Math.round(value)
]
}
}
var data = [], data1 = [], timeline = [];
var now = +new Date(1997, 9, 3);
var oneDay = 24 * 3600 * 1000;
var value = Math.random() * 1000;
for (var i = 0; i < 4000; i++) {
data.push(randomData());
}
option = {
title: {
text: ‘动态数据 + 时间坐标轴‘
},
tooltip: {
trigger: ‘axis‘
},
xAxis: {
type: ‘time‘
},
yAxis: [{
type: ‘value‘,
boundaryGap: [0, ‘100%‘]
},{
type: ‘value‘,
boundaryGap: [0, ‘100%‘]
}],
series: [{
name: ‘模拟数据‘,
type: ‘line‘,
data: data,
// showSymbol: false,
// hoverAnimation: false
}],
};ECharts xAxis.type='time'时间轴时卡顿问题
标签：java ati echart duration span art apache vue als
原文地址：https://www.cnblogs.com/lonhon/p/9013051.html
