const option = { backgroundColor: 'rgba(0,0,0,0.5)', tooltip: { trigger: 'axis', padding: [5, 10, 5, 10], backgroundColor: 'rgba(0,0,0,0.6)', borderColor: 'transparent', formatter: (param) => ` ` }, grid: { left: '3%', right: '6%', bottom: '15%', top: '16%', containLabel: true }, legend: { icon: 'roundRect', bottom: 5, itemHeight: 10, textStyle: { color: '#fff' }, }, xAxis: { type: 'category', data: ['一区', '二区', '三区', '四区', '五区'], axisLabel: { textStyle: { color: '#9eaaba' } }, axisLine: { lineStyle: { color: "#e5e5e5" } }, axisTick: { show: false }, splitLine: { show: false, } }, yAxis: { type: 'value', offset: 0, name: '单位 km²', axisLabel: { textStyle: { color: '#9eaaba' } }, nameTextStyle: { color: '#9eaaba', }, axisLine: { show: false, }, axisTick: { show: false }, splitLine: { show: true, lineStyle: { width: 1, color: "rgba(49,105,129,0.4)", type: 'dashed' } } }, series: [ { name: '高风险区 ', type: 'bar', stack: '策略变更', barWidth: '40%', itemStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {offset: 0, color: '#BA1818'}, {offset: 1, color: '#BE5F5F'} ], false), } }, data: [60, 82, 51, 94, 100] }, { name: '中风险区', type: 'bar', stack: '策略变更', barWidth: '40%', //柱子宽度 itemStyle: { //柱子颜色 normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {offset: 0, color: '#EAA811'}, {offset: 1, color: '#DEA768'} ], false), } }, data: [320, 332, 301, 334, 390] }, { name: '低风险区', type: 'bar', stack: '策略变更', barWidth: '40%', itemStyle: { normal: { color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ {offset: 0, color: '#25B14A'}, {offset: 1, color: '#64CF69'} ], false), } }, data: [232, 193, 240, 214, 239] } ] };

swgj-分段柱形图