天天看點

vue中在echarts tooltip中添加點選事件

需求:

需要在echarts tooltip點選學校的名稱,跳轉到詳情頁面;項目是從上海市---> 某個區----> 具體的學校(在最後一級的tooltip中綁定一個點選事件)

   ‘

 項目是用vue和echarts實作的,echarts是新版本(^5.0.2),并不能把點選事件綁定在window上

解決方法:

1、設定tooltip

enterable: true, //允許滑鼠進入提示懸浮層中,triggeron:'click',//提示框觸發的條件  mousemove滑鼠移動時觸發 click滑鼠點選時觸發  'mousemove|click'同時滑鼠移動和點選時觸發

2、定義hookToolTip變量,在formatter中給hookToolTip指派,添加一個id,然後通過watch去檢測dom元素,可以通過onclick去綁定事件,也可以通過addEventListerner去注冊事件

vue中在echarts tooltip中添加點選事件
vue中在echarts tooltip中添加點選事件

3、在methods中添加方法

vue中在echarts tooltip中添加點選事件

4、完整代碼