场景事件数TOPecharts pictorialBar配置项内容和展示

配置项如下
      var tridata = {
  "chart": [{
      month: "系统1",
      value: 78,
    },
    {
      month: "系统2",
      value: 50,
    },
    {
      month: "系统3",
      value: 45,
    },
  ]
}

var xAxisMonth = [],
  barData = [],
  lineData = [];
for (let i = 0; i < tridata.chart.length; i++) {
  xAxisMonth.push(tridata.chart[i].month);
  barData.push({
    "name": xAxisMonth[i],
    "value": tridata.chart[i].value
  });
  lineData.push({
    "name": xAxisMonth[i],
    "value": tridata.chart[i].ratio
  });
}

 option = {

  title: {
    left: 20,
    top: "0%",
    text: '场景事件数TOP',
    textStyle: {
      color: '#6a9cd5',
      fontSize: 14,
    }
  },
  grid: {
    top: '20%',
    bottom: 40,
    left: 30,
    right: 40,
    containLabel: true
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'none'
    },
    formatter: function (params) {
      // return params[0]["data"].name + "<br/>" + '训练人次: ' + params[1]["data"].value + "<br/>" + '合格率: ' + params[0]["data"].value;
    }
  },
  xAxis: [{
      type: 'category',
      show: false,
      data: [],
      axisLabel: {
        textStyle: {
          color: '#6a9cd5'
        }
      }
    },
    {
      type: 'category',
      position: "bottom",
      data: xAxisMonth,
      boundaryGap: true,
      // offset: 40,
      axisTick: {
        show: false
      },
      axisLine: {
        lineStyle: {
          color: '#19345d'
        }
      },
      axisLabel: {
        color: '#6a9cd5'
      }
    }

  ],
  yAxis: [{
    show: true,
    offset: 0,
    splitLine: {
      show: true,
      lineStyle: {
        color: "#19345d"
      }
    },
    axisTick: {
      show: false
    },
    axisLine: {
      show: false
    },
    axisLabel: {
      show: true,
      color: '#6a9cd5'
    }
  }],
  color: ['#e54035'],
  series: [{
    name: '',
    type: 'pictorialBar',
    xAxisIndex: 1,
    barCategoryGap: '0',
    symbol: 'path://d="M150 50 L130 130 L170 130  Z"',
    itemStyle: {
      normal: {
        color: function (params) {
          let colorList = [
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)',
            'rgba(13,177,205,0.8)', 'rgba(29,103,182,0.6)'
          ];
          return colorList[params.dataIndex];
        }
      },
      emphasis: {
        opacity: 1
      }
    },
    data: barData,
  }, ]
}
    
截图如下