下载

下载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
 }
 }
});
Logo

开放原子开发者工作坊旨在鼓励更多人参与开源活动,与志同道合的开发者们相互交流开发经验、分享开发心得、获取前沿技术趋势。工作坊有多种形式的开发者活动,如meetup、训练营等,主打技术交流,干货满满,真诚地邀请各位开发者共同参与!

更多推荐