echarts座標軸指示器（axisPointer）移動延遲問題

近期遇到了一個echarts座標軸指示器（axisPointer）移動延遲問題，把我最後的解決方案分享給你們

問題現象
一、echarts官網上demo上調好後，鼠標移動，指示器跟着移動速度很快很是流暢
二、到項目（ANG2項目）裏面後，指示器在鼠標移動時大概有一秒的延遲後纔跟隨移動，代碼如出一轍，差異在於在項目中。

解決思路

此前，由於echarts動畫requestAnimationFrame在echarts對象銷燬後並未清除動畫，遺留動畫一直存在，致使angular2的zone.js一直檢測變化，引發性能問題。所以使用了ngZone.runOutsideAngular的方法不檢測echarts的變動。

有了這個歷史緣由，那麼也排除了變動檢測的問題。

懷疑1，項目頁面上有大量消耗性能的代碼在長期執行，鼠標移動時該部分代碼佔據了時間致使延遲。
懷疑2，echarts的配置項不合理

分析事件執行
一、本地寫了個echarts圖的html文件，用谷歌自帶的性能分析工具記錄10s的狀況，期間一直移動鼠標指示器跟着移動很是快
分析圖形中的mousemove事件，響應很是快，大多數是1ms、2ms
(公司限制圖片上傳)
二、一樣操做記錄10s項目中的echarts圖，mousemove事件耗時10~20ms，相差10倍。對比Event Log中的事件，發現TooltipContent.js代碼執行16ms，佔了很大一部分時間。
(公司限制圖片上傳)

TooltipContent.js是什麼呢？是echarts的中的代碼。
更改源碼是不靠譜滴，所以咱們分析執行這坨代碼的老被調戲的緣由。
發現option的tooltip中配置了 trigger: 'axis'，trigger是觸發器，設置了該值鼠標移動一定會觸發Tooltip模塊的某些方法，暫時去掉trigger，卡頓消失。

結論：使用tooltip設置trigger:'axis'觸發器顯示座標軸指示器，會增長頁面性能消耗，用axisPointer設置解決該問題
從該角度入手，對代碼作以下處理，問題解決：

option = {
    axisPointer: { // 會出現橫豎2個方向的指示器
        show: true,
        type: 'line',
        label:{
            show: false, //不顯示指示器的文本標籤
        },
    },
    yAxis: [ //不顯示豎向的指示器
        {
            axisPointer: {
                show: false,
            },
        }
    ],
};