象形柱状图echarts #8AA7D8' }, symbolSize: ['14配置项内容和展示

配置项如下
      var data = [
    { name: '功能1', value: 91 },
    { name: '功能2', value: 70 },
    { name: '功能3', value: 60 },
    { name: '功能4', value: 20 }
]

option = {
    backgroundColor: "#041730",
    // tooltip: {},
    xAxis: {
        splitLine: {
          show: false
        },
        // offset: 10,
        axisLine: {
          show: false
        },
        axisLabel: {
          show: false
        },
        axisTick: {
            show: false
        }
    },
    yAxis: {
        data: data,
        inverse: true,
        axisTick: {
          show: false
        },
        axisLine: {
          show: false
        },
        axisLabel: {
          color: '#B3D6FF',
          formatter: function(value, index) {
              var failureLevel = 'c'
              // TODO 此处可根据需要调整显示样式  
              if (index === 0) {
                  failureLevel = 'a'
              }
              if (index === 1) {
                  failureLevel = 'b'
              }
              return `{${failureLevel}|${value}}    ${data[index].name}`
          },
          rich: {
              a: { color: '#FB4848' }, // 严重 红色
              b: { color: '#FFB977' }, // 一般 黄色
              c: { color: '#7094CF' }  // 正常 蓝色
          }
        },
        position: 'right'
    },
    series: [
        {
        tooltip: {
            show: false
        },
        type: "pictorialBar",
        symbol: "rect",
        symbolRepeat: true,
        symbolMargin: "5%",
        symbolClip: true,
        itemStyle: {
            color: '#8AA7D8'
        },
        symbolSize: ['14', '3'],
        data: [91, 20, 60, 70],
        z: 10,
        legendHoverLink: false
    },
    {
        tooltip: {
            show: false
        },
        type: "pictorialBar",
        symbol: "image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOAAAAAFCAYAAABcpODQAAAAZUlEQVRYR2OsX3WFje87s8I/Vgbh0ijN46P80fAYTQ/0yw+MvQuvq41mvtHCZ7TwHZjKh7F72XXL0cAfmMAfrWnoV9MM1pYdIwMDA8NgddxozTxaMw/3yoFxNPON9vlGa+KBq4kB1aCQz0XyyW4AAAAASUVORK5CYII=",
        symbolRepeat: false,
        symbolClip: true,
        symbolSize: ['100%', '5'],
        data: [100, 100, 100, 100], //TODO 此处需要根据实际数据修改最大值
        z: 9,
        legendHoverLink: false
    }]
};

    
截图如下