option = { backgroundColor: 'rgba(30, 34, 48, 1)', color: ['rgba(80, 177, 113, 1)', 'rgba(217, 185, 107, 1)', 'rgba(200, 65, 65, 1)', 'rgba(113, 113, 113, 1)'], legend: { bottom: '3%', itemWidth: 10, itemHeight: 8, itemGap: 15, textStyle: { fontFamily: 'MicrosoftYaHei', fontSize: 14, color: 'rgba(178, 175, 173, 1)' }, data: ['行驶', '停车', '熄火', '离线'] }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' }, backgroundColor: 'rgba(42, 51, 74, 0.89)', borderColor: 'transparent', formatter: function (params) { let returnData = '

' returnData += '' + params[0].axisValue + '
' for (let i = 0; i < params.length - 1; i++) { returnData += '' returnData += '' + params[i].seriesName + '：' + params[i].value + '车
' } returnData += '

' return returnData } }, grid: { left: '3%', top: '10%', right: '5%', bottom: '10%', containLabel: true }, xAxis: { type: 'value', name: '辆', nameTextStyle: { fontFamily: 'MicrosoftYaHei', fontSize: 12, color: 'rgba(113, 113, 113, 1)' }, axisLine: { show: true, lineStyle: { color: 'rgba(52, 51, 51, 1)' } }, splitLine: { show: false }, axisLabel: { margin: 10, fontFamily: 'MicrosoftYaHei', fontSize: 12, color: 'rgba(113, 113, 113, 1)', }, axisTick: { show: false, }, }, yAxis: { type: 'category', data: ['承运商1', '承运商2', '承运商3', '承运商4', '承运商5'], interval: true, axisLine: { lineStyle: { color: 'rgba(52, 51, 51, 1)', }, }, splitLine: { show: false, }, axisLabel: { margin: 10, fontFamily: 'MicrosoftYaHei', fontSize: 12, color: 'rgba(113, 113, 113, 1)', }, axisTick: { show: false, }, }, series: [ { name: '行驶', type: 'bar', stack: 'truck', barWidth: 20, itemStyle: { borderColor: 'transparent', borderWidth: 3, }, label: { show: false, }, data: [29, 19, 26, 44, 20] }, { name: '停车', type: 'bar', stack: 'truck', barWidth: 20, itemStyle: { borderColor: 'transparent', borderWidth: 3, }, label: { show: false, }, data: [38, 36, 44, 33, 20] }, { name: '熄火', type: 'bar', stack: 'truck', barWidth: 20, itemStyle: { borderColor: 'transparent', borderWidth: 3, }, label: { show: false, }, data: [33, 45, 30, 23, 60] }, { name: '离线', type: 'bar', stack: 'truck', barWidth: 20, itemStyle: { borderColor: 'transparent', borderWidth: 3, }, label: { show: false, }, data: [33, 45, 30, 23, 60] }, { name: '背景框', type: 'bar', data: [0, 0, 0, 0, 0], barWidth: 30, barGap: '-126%', showBackground: true, backgroundStyle: { color: 'transparent', borderColor: 'rgba(255, 255, 255, 0.19)', borderWidth: 1 }, itemStyle: { normal: { color: 'transparent' }, }, z: 1 }, ], };

Echarts在线免费图表