記錄 echars 綁定點選事件

echars 官方文檔

https://www.echartsjs.com/zh/tutorial.html#ECharts%20%E4%B8%AD%E7%9A%84%E4%BA%8B%E4%BB%B6%E5%92%8C%E8%A1%8C%E4%B8%BA

參考文檔

不止有點選click 還支援好多事件

ECharts 支援正常的滑鼠事件類型，包括 ‘click’、‘dblclick’、‘mousedown’、‘mousemove’、‘mouseup’、‘mouseover’、‘mouseout’、‘globalout’、‘contextmenu’ 事件。下面先來看一個簡單的點選柱狀圖後打開相應的百度搜尋頁面的示例。

// 基于準備好的dom，初始化ECharts執行個體

var myChart = echarts.init(document.getElementById(‘main’));

// 指定圖表的配置項和資料

var option = {

xAxis: {

data: [“襯衫”,“羊毛衫”,“雪紡衫”,“褲子”,“高跟鞋”,“襪子”]

},

yAxis: {},

series: [{

name: ‘銷量’,

type: ‘bar’,

data: [5, 20, 36, 10, 10, 20]

}]

};

// 使用剛指定的配置項和資料顯示圖表。

myChart.setOption(option);

// 處理點選事件并且跳轉到相應的百度搜尋頁面

myChart.on(‘click’, function (params) {

window.open(‘https://www.baidu.com/s?wd=’ + encodeURIComponent(params.name));

});

一般綁定到setOption 的對象上即可，但是有些圖裡會有些bug ,以點選click 為例， 當動态綁定上click 時 第一次沒有反應，但是事件已經綁定上了 當 綁定對象的 _handel下的click 事件為二個的時候才會觸發，不知道是我寫的有問題還是圖的問題。