echarts柱状图柱体使用图片

效果

直接上代码：

let option = {
        color: ["#bb0004", "#FFD48A"],
        tooltip: {
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
        },
        grid: {
          containLabel: true,
          left: "0",
          right: '0',
          top: "10",
          bottom: "0",
        },
        xAxis: {
          data: ["计划招聘人数", "实际招聘人数"],
          axisTick: {
            show: false,
          },
          axisLabel: {
            color: "#bbbbbb",
            interval: 0,
          },
          axisLine: {
            lineStyle: {
              color: "#bbbbbb",
            },
          },
        },
        yAxis: {
          splitLine: { 
            show: false
          },
          axisLine: {
            show: false,
            lineStyle: {
              color: "#1B5BBA",
            },
          },
          axisLabel: {
            show: false,
            color: "#5EA2ED",
            interval: 0,
          },
        },
        series: [
          {
            type: "pictorialBar",
            name: "案件归类",
            symbolSize: ["50%", "80%"],
            // symbolPosition: 'center',
            z: 10,
            label: {
              normal: {
                show: true,
                position: "top",
                formatter: "{c}",
                color: "#fff",
                fontSize: 13,
              },
            },
            data: [
              {
                value: 36,
                // symbol: "circle",
                symbol: 'image://'+txIcon,
                // symbolRepeat: true,
                symbolSize: [30, '100%'],
              },
              {
                value: 34,
                symbol: 'image://'+txIcon,
                symbolSize: [30, '100%'],
              },
            ],
          },
        ],
      };
      echart.setOption(option);

注意：txIxon是通过require引入的一张自定义的2D立方体效果的图片