1 下载微信微信部的echart 小程序 (https://github.com/ecomfe/echarts-for-weixin)
2 如果只是需要部分图表 可采用定制方式下载 减少小程序包的大小 (https://echarts.apache.org/zh/builder.html)
3 最重要的地方是 官方给的小程序echart 的 数据是写在data 外面的 。我们挺难去动态修改数据
可以采用如下方法 将 数据写在方法中 再数据setData 到data 中
import*as echartsfrom'../../ec-canvas/echarts';var chart=nullfunctioninitChart(canvas, width, height, dpr){
chart= echarts.init(canvas,null,{
width: width,
height: height,
devicePixelRatio: dpr// new});
canvas.setChart(chart);return chart;}Page({
data:{
ec:{
onInit: initChart}},onLoad(){this.test()},test(){var option={
title:{
text:'阅读书籍分布',
left:'center',
textStyle:{
color:'#999',
fontWeight:'normal',
fontSize:14}},
backgroundColor:"#ffffff",
series:[{
label:{
position:'outside',
alignTo:'edge',
formatter:'{name|{b}}\n{time|{c} 小时}',
minMargin:5,
edgeDistance:10,
lineHeight:15,
rich:{
time:{
fontSize:10,
color:'#999'}},},
type:'pie',
center:['50%','50%'],
radius:['20%','40%'],
data:[{ name:'克莱因壶', value:3.5},{ name:'投资最重要的事', value:2.8},{ name:'简读中国史', value:1.7},{ name:'你当像鸟飞往你的山', value:1.4},{ name:'表象与本质', value:0.5},{ name:'其它', value:3.8}]}]};setTimeout(()=>{
chart.clear()
chart.setOption(option);},1500)}});