需求要求echarts的轴动态渲染和变化，因此我选择了利用点击事件改编原始数据，然后让其重新渲染，出现了bug，我选择了添加清理事件，但是添加清理点击事件后，原本点击事件内部的一些内容，比如改变当前显示数据的显示隐藏等，也发生了bug，希望大佬们能帮忙解答。
``` // 定义ercharts点击事件，限制最多同时选中两个
// 拼装一个数组，内容为text_data中的第二项和第三项
const arr = [text_data[1], text_data[2]]
// // 清除上一次的点击事件
// myChart.off('legendselectchanged')
myChart.on('legendselectchanged', function (params) {
var legend_option = this.getOption()
var selectArr = Object.values(params.selected)
var num = 0
for (var i = 0; i < selectArr.length; i++) {
selectArr[i] === true ? num++ : ""
}
if (num > 0) {
arr.push(params.name)
// 根据params.name判断点击的是第几个图例，然后将对应的Yaxis设置为true
// if (params.name === text_data[0]) {
// legend_option.yAxis[2].show = true
// } else if (params.name === text_data[1]) {
// legend_option.yAxis[0].show = true
// } else if (params.name === text_data[2]) {
// legend_option.yAxis[1].show = true
// } else if (params.name === text_data[3]) {
// legend_option.yAxis[3].show = true
// }
}
if (num > 2) {
var hah = arr.slice(arr.length - 3, arr.length - 2)[0] + ''
legend_option.legend[0].selected[hah] = false
}
// 当订单金额为true时，访问量不能为true
// if(legend_option.legend[0].selected['订单金额'] = true){
// legend_option.legend[0].selected['访问量'] = false
// }
// if(legend_option.legend[0].selected['访问量'] = true){
// legend_option.legend[0].selected['订单金额'] = false
// }
// 拼接一个数组，内容为当前的legend_option.legend[0].selected中为true的项
var arr2 = []
// ["访问量 (次)", "订单金额 (元)", "订单笔数 (笔)", "新增学员 (人)"]
for (var key in legend_option.legend[0].selected) {
if (legend_option.legend[0].selected[key] === true) {
arr2.push(key)
}
}
// 根据arr2中有的每一项，一一对应的将text_data3中的每一项的true改为false,当arr2中没有某一项时，将text_data3中的对应项的true改为false，这样就可以实现点击一个图例，另一个图例的Yaxis为false，当arr2中有新增学员时。将text_data3中的新增学员的false改为true，当arr2中有访问量时，将text_data3中的访问量的false改为true，当arr2中有订单金额时，将text_data3中的订单金额的false改为true，当arr2中有订单笔数时，将text_data3中的订单笔数的false改为true,当arr2中没有新增学员时，将text_data3中的新增学员的true改为false,当arr2中没有访问量时，将text_data3中的访问量的true改为false,当arr2中没有订单金额时，将text_data3中的订单金额的true改为false,当arr2中没有订单笔数时，将text_data3中的订单笔数的true改为false
if (arr2.indexOf(text_data[0]) !== -1) {
text_data3.访问量 = true
} else {
text_data3.访问量 = false
}
if (arr2.indexOf(text_data[1]) !== -1) {
text_data3.订单金额 = true
} else {
text_data3.订单金额 = false
}
if (arr2.indexOf(text_data[2]) !== -1) {
text_data3.订单笔数 = true
} else {
text_data3.订单笔数 = false
}
if (arr2.indexOf(text_data[3]) !== -1) {
text_data3.新增学员 = true
} else {
text_data3.新增学员 = false
}
// 拼接一个数组,将数组arr2中的内容进行转换,当arr2中有访问量时,将arr2中的访问量改为访问量 (次)并将其放入arr3中,当当arr2中有订单金额时,将arr2中的订单金额改为订单金额 (元)并将其放入arr3中,当当arr2中有订单笔数时,将arr2中的订单笔数改为订单笔数 (笔)并将其放入arr3中,当当arr2中有新增学员时,将arr2中的新增学员改为新增学员 (人)并将其放入arr3中
const arr3 = []
for (var i = 0; i < arr2.length; i++) {
if (arr2[i] === '访问量') {
arr3.push('访问量 (次)')
} else if (arr2[i] === '订单金额') {
arr3.push('订单金额 (元)')
} else if (arr2[i] === '订单笔数') {
arr3.push('订单笔数 (笔)')
} else if (arr2[i] === '新增学员') {
arr3.push('新增学员 (人)')
}
}
// 根据arr3中的项，一一对应的将对应的watcharr中的项添加到watcharr2，当arr3中有新增学员时，将watchArr中的newStudents添加到watchArr2,当arr3中有订单金额时，将watchArr中的amount添加到watchArr2,当arr3中有订单笔数时，将watchArr中的count添加到watchArr2,当arr3中有访问量时，将watchArr中的Visits添加到watchArr2
for (var i = 0; i < arr3.length; i++) {
if (arr3[i] !== watchArr2.data.series.name) {
// 根据arr3的值，将对应的watchArr中的项赋值给watchArr2.data
// ["访问量 (次)", "订单金额 (元)", "订单笔数 (笔)", "新增学员 (人)"]
if (arr3[i] === text_data2[0]) {
watchArr2.data = watchArr.Visits
} else if (arr3[i] === text_data2[1]) {
watchArr2.data = watchArr.amount
} else if (arr3[i] === text_data2[2]) {
watchArr2.data = watchArr.count
} else if (arr3[i] === text_data2[3]) {
watchArr2.data = watchArr.newStudents
}
} else if (arr3[i] !== watchArr2.data2.series.name) {
// 根据arr3的值，将对应的watchArr中的项赋值给watchArr2.data2
if (arr3[i] === text_data2[0]) {
watchArr2.data2 = watchArr.Visits
} else if (arr3[i] === text_data2[1]) {
watchArr2.data2 = watchArr.amount
} else if (arr3[i] === text_data2[2]) {
watchArr2.data2 = watchArr.count
} else if (arr3[i] === text_data2[3]) {
watchArr2.data2 = watchArr.newStudents
}
}
}
// 当watchArr2.data.series.name="新增学员 (人)"时，将newStudentsyAxisIndex的值改为0，当watchArr2.data2.series.name="新增学员 (人)"时，将newStudentsyAxisIndex的值改为1，当watchArr2.data.series.name="订单金额 (元)"时，将amountyAxisIndex的值改为0，当watchArr2.data2.series.name="订单金额 (元)"时，将amountyAxisIndex的值改为1，当watchArr2.data.series.name="订单笔数 (笔)"时，将countyAxisIndex的值改为0，当watchArr2.data2.series.name="订单笔数 (笔)"时，将countyAxisIndex的值改为1，当watchArr2.data.series.name="访问量 (次)"时，将VisitsyAxisIndex的值改为0，当watchArr2.data2.series.name="访问量 (次)"时，将VisitsyAxisIndex的值改为1
if (watchArr2.data.series.name === text_data2[3]) {
newStudentsyAxisIndex = 1
} if (watchArr2.data2.series.name === text_data2[3]) {
newStudentsyAxisIndex = 0
}
if (watchArr2.data.series.name === text_data2[1]) {
amountyAxisIndex = 1
} if (watchArr2.data2.series.name === text_data2[1]) {
amountyAxisIndex = 0
}
if (watchArr2.data.series.name === text_data2[2]) {
countyAxisIndex = 1
} if (watchArr2.data2.series.name === text_data2[2]) {
countyAxisIndex = 0
}
if (watchArr2.data.series.name === text_data2[0]) {
VisitsyAxisIndex = 1
} if (watchArr2.data2.series.name === text_data2[0]) {
VisitsyAxisIndex = 0
}
// first取反,用于确认图标的变化
first.first = !first.first
// myChart.clear();
myChart.setOption(legend_option)
nextTick(() => {
myChart.resize()
})
})
myChart.setOption(option)
window.addEventListener('resize', function () {
myChart.resize()
})
