小程序echarts

一、引入ec-canvas文件
https://github.com/ecomfe/echarts-for-weixin
“ec-canvas”
二、配置json

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

三、书写结构

<!--logs.wxml-->
<view class="container log-list">
  <ec-canvas id="mychart-dom-line" canvas-id="mychart-line" ec="{{ec}}"></ec-canvas>
</view>

四、js文件

//logs.js
const util = require('../../utils/util.js')
import * as echarts from '../../ec-canvas/echarts'
const app = getApp()
function initChart(canvas,width,height){
  const chart = echarts.init(canvas,null,{
    width:width,
    height:height
  })
  canvas.setChart(chart)
  var option = {
    color:["#37A2DA","#67E0E3","#9FE6B8"],
    legend:{
      data:["A","B","C"],
      top:20,
      left:"center",
      z:100
    },
    grid:{
      left:"3%",
      right:"4%",
      bottom:"3%",
      containLabel:true
    },
    xAxis:{
      type:"category",
      boundaryGap:false,
      data:["周一","周二","周三","周四","周五","周六","周日"]

    },
    yAxis:{
      x:"center",
      type:"value",
      splitLine:{
        lineStyle:{
          type:"solid"
        }
      }
    },
    series:[{
      name:'A',
      type:"line",
      smooth:true,
      data:[18,36,65,30,78,40,33]
    }, {
        name: 'B',
        type: "line",
        smooth: true,
        data: [12, 50, 51, 35, 70, 40, 33]
      }
      , {
        name: 'C',
        type: "line",
        smooth: true,
        data: [10, 30, 31, 50, 40, 20, 33]
      }]
  }
  chart.setOption(option)
  return chart
}
Page({
  onShareAppMessage:function(res){
    return{
      title:"Echarts",
      path:"/pages/index/index",
      success:function(){},
      fail:function(){}
    }
  },
  data: {
    ec:{
      onInit:initChart
    },
    logs: []
  },
  onReady(){},
  onLoad: function () {
    this.setData({
      logs: (wx.getStorageSync('logs') || []).map(log => {
        return util.formatTime(new Date(log))
      })
    })
  }
})