通常在使用Echarts畫圖之後會碰到一個需求，通過點選生成後圖形具體某一項來傳遞相應的引數然後進行一個頁面的跳轉，當我遇到這個需求第一就想到了用on繫結點選事件的方法，然後就在程式碼上進行嘗試，果然可以實現這個功能，我在這塊展示的是一個柱狀圖，通過點選事件輸出一下獲取的引數可以得到什麼結果呢？
程式碼如下：

myChart.on('click',function(params){
    console.log(params);
});

我們通過點選柱狀圖的每一項可以看到輸出瞭如下對應項的詳細資訊：

在這塊我點選了8月份降水量，可以看到這塊輸出了，這一欄所對應的資訊，包括名稱seriesName：降水量，以及data值182.2，還以一些其他的資訊，同樣點選其他的也可以輸出對應資訊，這樣我們就可以進行點選跳轉並且傳遞對應的引數就ok了，這也是我首先想到的方法。

但是這個方法有一個不友好的地方就是隻有使用者點選到柱狀圖上它才會觸發到這個點選事件，比如圖中的一月份對應的數值就特別小，點選那一列的其他位置是沒有作用的，只有點選陰影部分才觸發，只一點對於使用者來說就非常不友好，因此我找到了另外一種方法實現這個需求，通過點選所在值的這一列就會觸發，實現程式碼如下：

myChart.getZr().on('click',function(params){
    let point=[params.offsetX,params.offsetY];
    if(myChart.containPixel('gird',point)){
        let
 
 xIndex=myChart.convertFromPixel({seriesIndex:0},
              point)[1];
        let op=myChart.getOption();
        let name=op.xAxis[0].data[xIndex];
    }
})

這部分的程式碼可以實現點選某一列就能觸發這個事件，主要的資訊集中在op這個變數中，name變數是點選某一列對應的名稱，使用時可以將這個變數打印出來然後選擇所需要傳遞的引數，其實這個程式碼是通過滑鼠點選圖形的座標來進行判斷點選的位置屬於哪一列，從而實現這個需求，在這塊我在寫的時候碰到一個問題，有一個圖形點選一次總是觸發兩次這個函式，如果你也出現了這個問題可以通過在繫結事件之前加上一句程式碼。

myChart.getZr().off('click');