初始化charts
this.init()
注册emits
emits: ['upSelectedData']
init 函数
const chart = echarts.init(this.$el, this.theme, this.initOptions)
if (this.tagsSwitch.length) {
let tagsSwitch = [...this.tagsSwitch] //默认显示的指标三个指标
const than = this
//这个on监听只有切换指标显隐才会触发
chart.on('legendselectchanged', function (params) {
console.log('监听加载类型', 22222, than.tagsSwitch)
console.log('params', params)
const optionLegend = chart.getOption()
const select_value = Object.values(params.selected)
console.log(
'optionLegend',
optionLegend,
'select_value:',
select_value
)
const index = tagsSwitch.indexOf(params.name)
console.log(
'匹配下标',
index,
optionLegend.legend[0].selected[params.name]
)
if (index >= 0 && !optionLegend.legend[0].selected[params.name]) {
//已选择的取消选中
tagsSwitch.splice(index, 1)
} else if (
index < 0 &&
optionLegend.legend[0].selected[params.name] &&
tagsSwitch.length < 3
) {
//不满足3三个的点击进行添加
tagsSwitch.push(params.name)
} else if (
// 满足三个移除第一个
tagsSwitch.length == 3 &&
index < 0 &&
optionLegend.legend[0].selected[params.name]
) {
console.log(
333,
tagsSwitch[0],
optionLegend.legend[0].selected[tagsSwitch[0]]
)
optionLegend.legend[0].selected[tagsSwitch[0]] = false
tagsSwitch.shift()
tagsSwitch.push(params.name)
}
console.log(
'最终切换的指标',
tagsSwitch,
optionLegend.legend[0].selected
)
chart.setOption(optionLegend) //保存echarts的设置
console.log(than.$emit)
than.$emit('upSelectedData', optionLegend.legend[0].selected) //更新
})
}