1.在小程序根目錄下放入ec-canvas 文件夾转砖，下載鏈接https://github.com/ecomfe/echarts-for-weixin
2.引入ec-canvas組件宝穗。在需要使用該組件的頁(yè)面的json文件中添加
{
"usingComponents": {
"ec-canvas": "../../ec-canvas/ec-canvas" //該路徑為ec-canvas存放的相對(duì)路徑
}
}
3.在wxml文件當(dāng)中應(yīng)用,ec 是當(dāng)前頁(yè)面js 中定義的對(duì)象乔妈，它使得圖表能夠在頁(yè)面加載后被初始化并設(shè)置吮龄。
<view class="container">
<ec-canvas id="mychart-dom-bar" canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>
</view>
4.js頁(yè)面中開(kāi)始定義ec對(duì)象
import * as echarts from '../../ec-canvas/echarts' //引入ec-canvas下的echarts.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
}
}
});
option中添加的參數(shù)值則為當(dāng)前圖標(biāo)所需的配置項(xiàng)汰蓉。參考https://www.echartsjs.com/zh/option.html#title
也可直接在官方實(shí)例中復(fù)制實(shí)例中的option內(nèi)容，在上面 的基礎(chǔ)上逐一進(jìn)行修改為自己項(xiàng)目所需的樣式鹏溯。https://www.echartsjs.com/examples/zh/index.html
