echarts饼图,图例有三个内容,分别是浅黄色、黄色和橙色,当用鼠标点击内容是黄色的图例是整个饼图消失不见了,点击其他两个图例则只消失与其对应的饼图区域
不知道你这个问题是否已经解决, 如果还没有解决的话: // 饼图自动轮播
handleChartLoop(option, myChart) {
if (!myChart) {
return
}
let currentIndex = -1 // 当前高亮图形在饼图数据中的下标
let changePieInterval = setInterval(selectPie, 1000) // 设置自动切换高亮图形的定时器
// 取消所有高亮并高亮当前图形
function highlightPie() {
// 遍历饼图数据,取消所有图形的高亮效果
for (var idx in option.series[0].data) {
myChart.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: idx
})
}
// 高亮当前图形
myChart.dispatchAction({
type: 'highlight',
seriesIndex: 0,
dataIndex: currentIndex
})
}
// 用户鼠标悬浮到某一图形时,停止自动切换并高亮鼠标悬浮的图形
myChart.on('mouseover', (params) => {
clearInterval(changePieInterval)
currentIndex = params.dataIndex
highlightPie()
})
// 用户鼠标移出时,重新开始自动切换
myChart.on('mouseout', (params) => {
if (changePieInterval) {
clearInterval(changePieInterval)
}
changePieInterval = setInterval(selectPie, 1000)
})
// 高亮效果切换到下一个图形
function selectPie() {
var dataLen = option.series[0].data.length
currentIndex = (currentIndex + 1) % dataLen
highlightPie()
}
},