echarts 折线图 默认显示tooltip提示框内容

大致思路：tooltip提示框默认是鼠标悬浮事件，echarts默认有触发这个事件的函数dispatchAction，调用即可。

下边展示的一个双Y轴折线图的提示：

1.首先在option里面配置tooltip，只贴了tooltip的配置，其他的省略了

 option: {
       tooltip: {
          //鼠标悬停提示内容
          trigger: 'axis', // 触发类型，默认数据触发，可选为：'axis' item
          axisPointer: {
              // 坐标轴指示器，坐标轴触发有效
              type: "line", // 默认为直线，可选为：'line' | 'shadow'
              label:'cross',
              show:true
            }, 
          }
}

2.初始化echarts,并且调用dispatchActon方法触发tooltip的事件

            this.chart = this.$echarts.init(document.getElementById(this.id));//初始化echarts
            console.info(this.option);
            this.chart.setOption(this.option);
            window.addEventListener("resize", this.chart.resize);//缩放
            //显示提示框
            this.chart.dispatchAction({
                  type: 'showTip',
                  seriesIndex:1,  // 显示第几个series
                  dataIndex: new Date().getHours() // 显示第几个数据
            });

效果图：

最后

以上就是隐形小伙为你收集整理的echarts 折线图 默认显示tooltip提示框内容的全部内容，希望文章能够帮你解决echarts 折线图 默认显示tooltip提示框内容所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。