数据可视化大屏项目 开发中,客户反馈echarts图表里的tooltip会出现抖动问题
不使用tooltip
没有tooltip就没有抖动的问题了。
tooltip: {show: false},
将transitionDuration设置为0,让tooltip紧跟鼠标
tooltip: {show: true,transitionDuration: 0 // 让toolltip紧跟鼠标
},
transitionDuration参数介绍
在 ECharts 中,transitionDuration
是一个选项,用于设置 tooltip 组件在鼠标悬停时切换时的过渡动画持续时间。其值以毫秒为单位,定义了 tooltip 在更改内容和位置时的过渡动画时间。
例如,如果你设置了 transitionDuration: 500
,当你的鼠标从一个数据点移动到另一个数据点时,tooltip 的内容和位置的更改将在 500 毫秒内平滑过渡。
下面是一个简单的使用示例:
option = {
tooltip: {
trigger: 'axis',
transitionDuration: 500 // 设置过渡动画的持续时间为 500 毫秒
},
// 其他图表选项...
};
通过调整 transitionDuration
的值,你可以控制 tooltip 过渡的速度,从而使视觉效果更加平滑或者反应更快。