# 一、使用echarts-for-weixin
-
下载
https://github.com/ecomfe/echarts-for-weixin下的ec-canvas文件到项目components中 -
排除Taro编译选项
config/index.js配置文件中找到如下
...
compile: {
exclude: ['src/components/ec-canvas/echarts.js']
}
@前端进阶之旅: 代码已经复制到剪贴板
- 定制
echart文件大小可减少小程序构建包的大小。然后替换src/components/ec-canvas/echarts.js文件即可
# 二、封装一个刷新图表的组件
// src/compoments/Chart.js
import Taro, { Component } from '@tarojs/taro'
import { View } from '@tarojs/components'
import PropTypes from 'prop-types'
import _isEqual from 'lodash/isEqual.js'
import Nerv from 'nervjs'
import * as echarts from '../ec-canvas/echarts'
let Taro_ = Taro
if (process.env.TARO_ENV === 'h5') {
Taro_ = require('@tarojs/taro-h5').default
}
const commonFunc = (_this, chart) => {
const { option, loading, loadingConf } = _this.props
_this.beforeSetOption()
_this.chartInstance = chart
if (loading) {
_this.chartInstance.showLoading('default', loadingConf)
} else {
_this.chartInstance.setOption(option)
}
}
const initChart = ((type) => {
switch (type) {
case 'h5':
return (_this) => {
const { chartId } = _this.
