微信小程式使用echarts的踩坑記
阿新 • • 發佈:2018-11-27
1)微信小程式顯示詞雲
在微信小程式中目前不能直接使用echarts-wordcloud.js
echarts-wordcloud.js中使用了window物件,所以會報找不到物件的錯
解決方案:
1)研究echarts-wordcloud.js原始碼,使用canvas自己繪
2)後端生成圖片,小程式顯示圖片
2)微信小程式echarts圖表無法使用toolbox
toolbox: { feature: { dataView: {show: true, readOnly: false}, magicType: {show: true, type: ['line', 'bar']}, restore: {show: true}, saveAsImage: {show: true} } },
echarts中的這些設定在小程式無法使用
解決方案:自己寫功能按鈕和圖表關聯
3)圖表在頁面上的層級最高,所以如果使用蒙版,必須隱藏圖表
<testChart :showChart.sync="openModal" wx:if="{{openModal !=true}}" />
使用wx:if隱藏圖表後,關閉蒙版,圖表不會再顯示,需要使用動態傳參的方式讓圖表重新顯示
watch = { showChart (newValue, oldValue) { if (!newValue) { this.option.series = [...] chart.setOption(this.option) } } }