option = {
backgroundColor:"#fff",
grid: {
containLabel: true,
top: 50,
right: 15,
bottom: 10,
left: 15
},
legend: {
icon: 'rect',
right: "center",
itemWidth: 15,
itemHeight: 10,
textStyle: {
color: '#555'
},
},
tooltip: {
trigger: "axis",
axisPointer: {
type: 'shadow'
},
},
xAxis: {
// 类目轴
type: "category",
data: ['缓行', '拥堵', '严重拥堵'],
axisTick: {
show: false //隐藏X轴刻度
},
axisLine: {
lineStyle: {
color: "#CCCCCC"
}
},
axisLabel: {
show: true,
textStyle: {
color: '#000',
fontSize: 14,
fontFamily: 'Source Han Sans CN-Regular',
}
},
},
yAxis: {
type: 'value',
name: "km",
nameTextStyle: {
color: 'rgba(0,0,0,0.65)',
fontSize: 14,
fontFamily: 'Source Han Sans CN-Regular',
align: "left",
verticalAlign: "center",
},
axisLabel: {
color: 'rgba(0,0,0,0.65)',
textStyle: {
fontSize: 14
},
},
axisLine: {
show: false,
lineStyle: {
color: 'rgba(223, 223, 223, 1)',
}
},
axisTick: {
show: false
},
splitLine: {
lineStyle: {
color: 'rgba(223, 223, 223, 1)',
type: "dashed",
}
}
},
series: [
{
type: "bar",
name: "2024-03-14",
barWidth: 30,
showBackground: true,
backgroundStyle: {
color: "transparent"
},
itemStyle: {
color: '#febc5d'
},
data: [
{
value: 5,
itemStyle: {
color: '#febc5d'
}
},
{
value: 20,
itemStyle: {
color: '#ff7659'
}
},
{
value: 36,
itemStyle: {
color: '#d11b1b'
}
}
]
}
]
}