移動端使用echarts繪製圖表使用tooltip無效果

前言：經常使用echarts的碼友們應該知道在PC端使用tooltip時是鼠標移入會有彈窗顯示信息的功能，但是在移動端無論怎麼樣都無法觸發彈窗顯示，經過多方面信息收集發現只有用echarts版本4以下的纔可以在移動端顯示tooltip的功能

1. 項目期望

用手點擊屏幕上對應區域時顯示對應的數據

2. 項目實現

原本我用的是echarts最新的版本5.3.1發現在PC端功能一切正常到了移動端就會丟失該功能
安裝echarts版本爲3到4的版本即可實現該功能，爲了有更好的兼容性我選擇安裝的是3系列的最高的版本3.8.4

npm install [email protected]

3系列一共有的版本如下

然後還並沒有結束一些4系列5系統的屬性寫法在3系列是無法使用的例如我遇到這個問題

如果你沒不想讓這些字和線條顯示

在echarts版本爲4系列和5系列的寫法是

label: {
  show: false,
},
labelLine: {
  show: false,
},

在echarts版本爲3系列的寫法是

itemStyle: {
  normal: {
      label: {
        show: false,
      },
      labelLine: {
        show: false,
      },
   },
},

如果我們想顯示legend

在echarts版本爲4系列和5系列的寫法是

legend: {
  type: "scroll",
  orient: "vertical",
  right: 10,
  top: 20,
  bottom: 20,
},

在echarts版本爲3系列的寫法是

legend: {
  type: "scroll",
  orient: "vertical",
  right: 10,
  top: 20,
  bottom: 20,
  data: [] // 裏面存放需要顯示的內容 注意：要和series下的list裏面的name一致方可有效
},

生活就是不斷的積累 奧力給