vue-echarts 拖動地圖后重置數據散點顯示錯位


vue-echarts: v5.0.0

問題描述

原始地圖:

拖動地圖后重置散點數據,散點被重置到原始位置,地圖位置沒變,顯示錯位:

原因

代碼里使用 computed 生成的 options ,每次生成的都是新的 options

vue-echarts 源碼中監聽 options 變化,然后調用 this.chart.setOption(val, val !== oldVal),相當於 setOption 的第二個參數固定傳 true

setOption 的第二個參數: “是否不跟之前設置的 option 進行合並,默認為 false,即合並。”

options 里地圖 geo 未初始化(保持拖動后的位置),series 散點被初始化,導致散點和地圖錯位。

解決方案

始終維護同一個 options。

不使用 computed ,地圖首次加載時生成 options ,修改數據時使用 options.server.xx.xx ,保持 options 是同一個引用,vue-echarts 會使用合並的方式重新渲染地圖。

注意 如果可縮放,縮放后修改數據依然會發生錯位,可以使用 clear 先清空地圖。

總結

  • vue-echarts 監聽 options ,通過對比新舊 options 設置 setOption 的第二個參數,即是否和之前 option 合並。
  • options.geo 地圖不受 setOption 第二個參數影響。

whosmeya.com


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM