微信小程序使用Echarts

下载

下载echarts微信版 地址：https://github.com/ecomfe/echarts-for-weixin

拷贝文件

ec-canvas目录 放在小程序项目目录中

在页面开启使用echarts

{
  "usingComponents": {
    "ec-canvas": "../../ec-canvas/ec-canvas"
  }
}

在js引入

import * as echarts from '../../ec-canvas/echarts';

wxml

<view class="box">
  <ec-canvas id="mychart-dom-line" canvas-id="mychart-line" ec="{{ ec }}"></ec-canvas>
</view>

wxss

.box {
	width:100%;
	height:350rpx;
	}

js

function initChart(canvas, width, height) {
 const chart = echarts.init(canvas, null, {
 width: width,
 height: height
 });
 canvas.setChart(chart);
 
 var option = {
 ...
 };
 chart.setOption(option);
 return chart;
}
 
Page({
 data: {
 ec: {
  onInit: initChart
 }
 }
});