配置项如下
option = {
backgroundColor: '#00265f',
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['1型车', '2型车', '3型车','4型车','5型车'],
align: 'right',
right: 10,
textStyle: {
color: "#fff"
},
itemWidth: 10,
itemHeight: 10,
itemGap: 35
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [{
type: 'category',
data:['0-700', '700-800', '800-850', '850-900', '900-950', '950-1000', '1000-1300', '1300-2000', '2000-3000', '3000-6000', '6000-10000', '[10000-20000', '20000-90000', '-'],
axisLine: {
show: true,
lineStyle: {
color: "#063374",
width: 5,
type: "solid"
}
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
textStyle: {
color: "#00c7ff",
}
},
}],
yAxis: [{
type: 'value',
axisLabel: {
formatter: '{value}'
},
axisTick: {
show: false,
},
axisLine: {
show: false,
lineStyle: {
color: "#00c7ff",
width: 1,
type: "solid"
},
},
splitLine: {
lineStyle: {
color: "#063374",
}
}
}],
color:['#62d1de','#54d6b6','#a6db69','#ffd454','#ffa361'],
series: [{
name: '1型车',
type: 'bar',
data:[3160, 4276, 2082, 2672, 2517, 1661, 4823, 768, 541, 1442, 332, 291, 202, 3160],
barWidth: 5, //柱子宽度
barGap: 1, //柱子之间间距
}, {
name: '2型车',
type: 'bar',
data: [321, 513, 413, 422, 531, 427, 748, 623, 345, 759, 445, 319, 315, 323],
barWidth: 5, //柱子宽度
barGap: 1, //柱子之间间距
}, {
name: '3型车',
type: 'bar',
data: [413, 328, 415, 426, 425, 422, 592, 551, 314, 445, 314, 332, 398, 376],
barWidth: 5, //柱子宽度
barGap: 1, //柱子之间间距
},{
name: '4型车',
type: 'bar',
data:[213, 244, 222, 221, 253, 248, 294, 273, 213, 230, 223, 211, 212, 213],
barWidth: 5, //柱子宽度
barGap: 1, //柱子之间间距
},{
name: '5型车',
type: 'bar',
data: [173, 378, 284, 446, 721, 837, 3643, 3570, 2863, 2569, 2662, 2826, 3590, 173],
barWidth: 5, //柱子宽度
barGap: 1, //柱子之间间距
},
]
};