微信小程序中使用ECharts 异步加载数据实现图表功能

　　具体代码如下所示：

　　 <view class=container> <ec-canvas id=mychart-dom-bar canvas-id=mychart-bar ec={{ ec }}></ec-canvas> </view> import * as echarts from ../../ec-canvas/echarts; var barec = null Page({ onShareAppMessage: function (res) { return { title: ECharts 可以在微信小程序中使用啦！t(canvas, null, { width: width, height: height }); canvas.setChart(barec); return barec; } } }, onReady() { setTimeout(this.getData, 500); }, //getData方法里发送ajax getData(){ wx.showLoading({ title: 加载中..., }) wx.request({ url: 学生], left: center }, xAxis: [ { type: value, scale: true, axisLabel: { formatter: {value} m }, splitLine: { show: false } } ], yAxis: [ { type: value, scale: true, axisLabel: { formatter: {value} m }, splitLine: { show: false } } ], series: [{ name: 学生, // symbolSize: 20, data:data, type: scatter, markArea: { silent: true, itemStyle: { normal: { color: transparent, borderWidth: 1, borderType: dashed } }, data: [[{ name: 教室, xAxis: 0, yAxis: 0 }, { xAxis: 20, yAxis: 20 }]] }, markPoint: { // data: [ // { type: max, name: 最大值 }, // { type: min, name: 最小值 } // ] }, markLine: { lineStyle: { normal: { type: solid } }, // data: [ // { type: average, name: 平均值 }, // { xAxis: 160 } // ] } }] }) wx.hideLoading(); }, fail: function (res) { }, complete: function (res) { }, }) } });

　　总结

　　以上所述是小编给大家介绍的微信小程序中使用ECharts 异步加载数据实现图表功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！