fxc-wecat/pages/index/indexRight/rightLine1/index.js

const app = getApp();
import * as echarts from '../../../../ec-canvas/echarts' // 这个是自己实际的目录
Component({
  data:{
    Ec: { lazyLoad: true, },
  },
  lifetimes: {
    attached: function () {
      this.init()
    },
    moved: function () { },
    detached: function () { },
  },
  methods:{
    init(){
      var that = this;
      that.selectComponent('#chartConDom').init((canvas, width, height, dpr) => {
        const chart = echarts.init(canvas, null, {
          width: width,
          height: height,
          devicePixelRatio: dpr
        });
        var option = that.getOrderWarnOption();
        chart.setOption(option);
        return chart;
      });
    },
    getOrderWarnOption(){
      var list = [
        {name:"生产",data:[{name:"2022",value:30,},{name:"2021",value:30,},{name:"2020",value:20,},{name:"2019",value:30,}]},
        {name:"销售",data:[{name:"2022",value:50,},{name:"2021",value:30,},{name:"2020",value:30,},{name:"2019",value:30,}]},
        {name:"在途",data:[{name:"2022",value:50,},{name:"2021",value:30,},{name:"2020",value:30,},{name:"2019",value:30,}]},
        {name:"交付",data:[{name:"2022",value:50,},{name:"2021",value:30,},{name:"2020",value:30,},{name:"2019",value:30,}]},
      ]
      var fontSize = 10
      var fontColor = "#999999"
      return {
        color:["#583DC8","#D1B645","#31CE7B","#5B7DEB"],
        title:{
          text:"产品年报数据",
          show:false,
          textStyle:{
            color:fontColor,
            fontSize:fontSize,
          },
          left:'10%',
          top:0,
        },
        grid: {
          top: '10%',
          left: '6%',
          right: '10%',
          bottom: '3%',
          containLabel: true
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross',
          }
        },
        legend:{
          show:0,
          icon:"circle",
          right:'10%',
          top:0,
          itemWidth:fontSize*0.8,
          itemHeight:fontSize*0.8,
          textStyle:{
            fontSize:fontSize,
            color:fontColor,
          },
          data:list.map(item=>item.name)
        },
        yAxis: {
          type: 'value',
          axisTick:{show:false,},
          axisLabel:{
            fontSize:fontSize,
            color:fontColor,
          },
        },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          axisTick:{show:false,},
          axisLabel:{
            fontSize:fontSize,
            color:fontColor,
          },
          data: list[0].data.map(item=>item.name)
        },
			  series:this.setOptItem(list),
      }
    },
    setOptItem(list){
      var data = []
      for(var i in list){
        data.push({
          type: 'line',
          stack: 'Total',
          areaStyle: {},
          lineStyle: { width:1,},
          silent:1,
          symbolSize:1,
          name:list[i].name,
          data:list[i].data
        })
      }
      return data
    },
  },
})