小程序在一个页面运用多个echarts图表

wxml中如下：

wxss中如下：

ec-canvas {
    width: 100%;
    height: 100%;
}

js中如下：

//首先要引入ec-canvas

import * as echarts from '../../ec-canvas/echarts';
data:{
	ec1: {
      lazyLoad:true
    },
    ec2: {
      // 将 lazyLoad 设为 true 后，需要手动初始化图表
      lazyLoad:true
    },
}
//这个一定要提前获取数据，不然会出现图表空白的情况，我是在onLoad()里面调用的
getDataToday: function(){
    //本日图表数据
    var that = this;
    wx.showLoading({
        title: '加载中..',
        mask: true
    });
    wx.request({//请求今日图表数据
        url: 'xxxxxxxxxx',
        data: {
          id:that.data.uid,
        },
        success: (res)=>{
          console.log(res);
          var option1 = {};
          var option2 = {};
          if(res.statusCode==200){
            console.log(res);
            var option1 = {
              title: {
                text: '',
                left: 'center'
              },
              color: ["#37A2DA", "#67E0E3", "#9FE6B8"],
              legend: {
                data: ['A', 'B', 'C'],
                top: 50,
                left: 'center',
                backgroundColor: 'red',
                z: 100
              },
              grid: {
                containLabel: true
              },
              tooltip: {
                show: true,
                trigger: 'axis'
              },
              xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月','十月','十一月','十二月'],
                // show: false
              },
              yAxis: {
                x: 'center',
                type: 'value',
                splitLine: {
                  lineStyle: {
                    type: 'dashed'
                  }
                }
                // show: false
              },
              series: [{
                name: '',
                type: 'line',
                smooth: true,
                data: res.data.mdata
              }]
            };
            option2 = {//示例数据
              color: ['#c23531'],
              tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                  type: 'line'        // 默认为直线，可选为：'line' | 'shadow'
                },
                confine: true
              },
              legend: {
                data: []
              },
              grid: {
                left: 20,
                right: 20,
                bottom: 15,
                top: 40,
                containLabel: true
              },
              xAxis: [
                {
                  type: 'value',
                  axisLine: {
                    lineStyle: {
                      color: '#999'
                    }
                  },
                  axisLabel: {
                    color: '#666'
                  }
                }
              ],
              yAxis: [
                {
                  type: 'category',
                  axisTick: { show: false },
                  data: res.data.data.name,
                  axisLine: {
                    lineStyle: {
                      color: '#999'
                    }
                  },
                  axisLabel: {
                    color: '#666'
                  }
                }
              ],
              series: [
                {
                  name: '热度',
                  type: 'bar',
                  label: {
                    normal: {
                      show: true,
                      position: 'inside'
                    }
                  },
                  data: res.data.data.value,
                  itemStyle: {
                    // emphasis: {
                    //   color: '#37a2da'
                    // }
                  }
                }
              ]
            };
          that.setData({
            todayData1:option1,
            todayData2:option2
          })
          wx.hideLoading()
        }
      }
    })
  },

//由于项目需求是：tab切换展示不同图表，所以我把下面的代码放到了点击tab之后调用，不然就不会展示图表。
that.ecComponent1  = that.selectComponent('#mychart-dom-line');
that.ecComponent2 = that.selectComponent('#mychart-dom-bar');
that.init_bar1();
that.init_bar2();

init_bar1: function (){
    this.ecComponent1 .init((canvas, width, height) => {
        // 初始化图表
        const chart  = echarts.init(canvas, null, {
          width: width,
          height: height
        });
        chart.setOption(this.data.todayData1);
        wx.hideLoading();
        // 注意这里一定要返回 chart 实例，否则会影响事件处理等
        return chart;
    });
  },
init_bar2: function (){
    this.ecComponent2 .init((canvas, width, height) => {
        // 初始化图表
        const chart  = echarts.init(canvas, null, {
          width: width,
          height: height
        });
        chart.setOption(this.data.todayData2);
        wx.hideLoading();
        // 注意这里一定要返回 chart 实例，否则会影响事件处理等
        return chart;
    });
  },

json如下：

{
    "navigationBarTitleText": "首页",
    "usingComponents": {
        "ec-canvas": "../../ec-canvas/ec-canvas"
    }
}