環形圖默認高亮顯示數據

?代碼：

data(){return {chart:null,} }, methods: {initChart() {this.chart = this.$echarts.init(document.getElementById(this.id))this.chart.setOption({color: color,})this.getDefaultSelected()}getDefaultSelected() {this.chart.dispatchAction({type: "highlight",seriesIndex: 0,dataIndex: 0});this.chart.on("mouseover", e => {if (e.dataIndex !== this.index) {this.chart.dispatchAction({type: "downplay",seriesIndex: 0,dataIndex: this.index});}});this.chart.on("mouseout", e => {this.index = e.dataIndex;this.chart.dispatchAction({type: "highlight",seriesIndex: 0,dataIndex: e.dataIndex});});}}

解析

?type ?觸發action類型

seriesIndex ?series索引

dataIndex ? 高亮數據索

1,進入頁面可以觸發第1條數據的選中action?

2,鼠標指向別的圖塊時,展示選中數據的圖塊信息,隱藏默認色塊高亮信息?

3,鼠標離開環形圖時,展示默認第一條數據

總結

以上是生活随笔為你收集整理的echarts 环形图 默认高亮展示某个数据的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。