echarts柱状图柱体使用图片

本文主要是介绍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立方体效果的图片

这篇关于echarts柱状图柱体使用图片的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---