平移拖动展示数据后,数据异常,没有数据的地方展示了连线,其实就是动画的原因,把动画关掉就没有了,但是有没有不关闭动画就可以解决的办法呢?
tooltip: {
trigger: "axis",
},
legend: {
type: "scroll",
pageIconColor: "#BEBFC2",
pageIconInactiveColor: "#80A8FF",
pageIconSize: [5, 9],
data: companyData,
bottom: 0,
padding: [20, 0, 0, 0],
itemGap: 24,
itemStyle: {
borderWidth: 2,
borderColor: "#fff",
},
},
grid: {
top: "10%",
left: "0",
right: "0",
bottom: "15%",
containLabel: true,
},
xAxis: {
type: "category",
data: bool?this.props.data.map((item) => {
return item.statTime;
}):[],
axisTick: {
show: false,
},
axisLine: {
lineStyle: {
color: ["rgba(0, 0, 0, 0.25)"],
},
},
axisLabel: {
textStyle: {
color: "#5A5A5C",
},
},
},
yAxis: {
type: "value",
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
show: true,
lineStyle: {
type: "dashed",
},
},
},
// animation:false,
dataZoom: [
{
type: "inside", //1平移 缩放
// throttle: 50, //设置触发视图刷新的频率。单位为毫秒(ms)。
minValueSpan: 6, //用于限制窗口大小的最小值,在类目轴上可以设置为 5 表示 5 个类目
start: 1, //数据窗口范围的起始百分比 范围是:0 ~ 100。表示 0% ~ 100%。
end: 20, //数据窗口范围的结束百分比。范围是:0 ~ 100。
},
{
type: 'slider',
realtime: false,
start: 0,
end: 40, // 初始展示40%
height: 4,
fillerColor: "#2E5CE5", // 滚动条颜色
borderColor: "rgba(17, 100, 210, 0.12)",
handleSize:0, // 两边手柄尺寸
showDetail: false, // 拖拽时是否展示滚动条两侧的文字
bottom:25,
show:this.props.data?.length>7
},
],