1:tooltip的自定义
贴代码:
tooltip: {
trigger: "axis",
formatter: function (data) {
var arr = []; // 接收所有数据
var arrStr = ""; // 每一个数据
for (var i = 0; i < data.length; i++) {
arr.push(
'<span style="display: inline-block;padding: 5px 0;" >' +
'<i style="display: inline-block;width: 10px;height: 10px;background: ' +
data[i].color +
';border-radius: 50%;}"></i><span style="display:inline-block;">' +
data[i].seriesName +
":  " +
data[i].value +
"</span>"
);
}
arrStr = arr.join("<br/>");
return '<div style="padding:6px;">' + arrStr + "</div>";
},
},
2:tooltip循环滚动
需要用的插件:
下载网址: https://github.com/liuyishiforever/echarts-auto-tooltip
或者
https://gitee.com/sun_yu_xin_shuai/echarts-auto-tooltip
点击code,下载到本地压缩包。只需用到红框里的文件就可以
使用:(实例为 vue框架)
在需要用到的vue页面中,引入文件
之后在setOption下面,调用一下即可。
效果:
问题:
如果出现轮播完成后,中间过了一段时间再开始重复轮播的话,问题就是数据多于数据项
例如上图:柱状1/2/3/4 只有四条数据项,但你每个数据项有5条数据,就会出现如上问题