网上,用mouseEnter的方法太麻烦了,有简单的,直接看代码
initChart() {
let legendData = []
let xList = []
let yList = []
let series = []
let j = 0
let longJson = {}
let longLength = 0
let longArr = []
let longName = ''
let newArr = []
let nameList = []
// 先循环大环,确定到底有几个ylist的data
this.cloudList.reverse()
this.cloudList.map(v => {
if (v.goodsNameOne.length > 6) {
yList.push(v.goodsNameOne.substr(0, 6) + '...')
}
else {
yList.push(v.goodsNameOne)
}
nameList.push(v.goodsNameOne)
xList.push(v.goodsCountOne)
})
this.chart = echarts.init(document.getElementById(this.id))
this.chart.setOption( {
tooltip : {
trigger: 'axis',
formatter: function (params) {
var html=nameList[params[0].dataIndex]+"<br>";
for(var i=0;i<params.length;i++){
html+='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[i].color+';"></span>'
html+=params[i].seriesName+":"+params[i].value+"<br>";
}
return html;
}
},
calculable : true,
xAxis : [
{
type : 'value',
boundaryGap : [0, 0.01]
}
],
yAxis : [
{
type : 'category',
data : yList
}
],
series : [
{
name:'次数',
type:'bar',
data: xList,
itemStyle: {
normal:{
color: '#2A9B38'
},
},
}
]
})
},
核心是在tooltip中,那个name不用params的,利用params[0].dataIndex,获取index,然后找到nameList中存的名称