以多折线图为例:
1. 初始化echarts
this.chart = echarts.init(this.$el, 'default')
2. echarts配置项-提示框组件-提示框浮层内容格式器
this.chart.setOption({ tooltip: { trigger: 'axis', formatter: (params) => { // params为悬浮框上的全部数据 const newParams = [] params.forEach((p) => { // p.marker为对应数据线的颜色的圆点 // p.seriesName为对应数据的数据名称 // p.value为对应数据的值 const cont = '<div style="margin-bottom: 10px;">' + p.axisValueLabel + '<br/>' + p.marker + ' ' + p.seriesName + ': ' + p.value + '</div>' if (p.seriesName == '折线图1') { newParams[0] = cont } else if (p.seriesName == '折线图2') { newParams[1] = cont } else if (p.seriesName == '折线图3') { newParams[2] = cont } }) // 这里需要将数组转化成字符串显示,如果不转化,每个数据前面都会出现一个逗号 return newParams.join('') } } })