Echarts版本
- echarts-5.3.3
问题描述
在写访问量统计图的时候横坐标轴为时间轴,纵坐标为访问次数,想实现以分钟为间隔的统计,并且鼠标移动时自动吸附到数据点,并显示浮窗数据,但是写完后发现浮窗没有出现,并且自动吸附失效,如下图
问题原因&解决方法
出现这个原因是因为我将echart的实例放到了data(){return{}}里面,使用this的方式调用引起的
有问题的代码
//上方代码省略
data() {
return {
todayChart: null
};
},
//下方部分代码省略
methods:{
showTodayChart(){
this.todayChart = echarts.init(this.$refs.today);
//...省略设置代码
this.todayChart.setOption(option);
}
}
正确做法
正确的方式为将todayChart也就是echarts定义为局部的变量即可
data() {
return {
//去掉todayChart,使用方法内局部变量定义
};
},
//下方部分代码省略
methods:{
showTodayChart(){
let todayChart = echarts.init(this.$refs.today);
//...省略设置代码
todayChart.setOption(option);
}
}