option = {
backgroundColor: '#000',
grid: {
left: "3%",
right: "3%",
bottom: "3%",
containLabel: true,
},
color: ["#159AFF", "#DD5B5B"],
legend: {
top: "1%",
right: "1%",
icon: "rect",
itemWidth: 10,
itemHeight: 10,
itemGap: 10,
textStyle: {
fontSize: 14,
color: '#fff'
}
},
xAxis: [
{
type: "category",
boundaryGap: false,
axisLabel: {
textStyle: {
color: "#fff",
fontSize: 12
}
},
axisLine: {
show: true,
lineStyle: {
color: "#fff",
}
},
splitLine: {
show: false,
},
axisTick: {
show: false,
},
data: [1,2,3,4,5]
}
],
yAxis: [
{
name: '',
nameTextStyle: {
color: "#fff",
fontSize: 12
},
type: "value",
splitLine: {
show: true,
lineStyle: {
color: "rgba(255, 255, 255, 0.3)", //网格颜色
type: "dashed",
}
},
axisLine: {
show: false,
},
axisLabel: {
show: true,
textStyle: {
color: "#fff",
fontSize: 12
}
},
axisTick: {
show: false,
},
}
],
series: [
{
name: '合格率',
type: "line",
symbol: "none",
smooth: true,
lineStyle: {
normal: {
width: 1,
color: "#159AFF", // 线条颜色
},
},
areaStyle: {
color: {
type: "linear",
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
// 渐变颜色
{
offset: 0,
color: "rgba(31, 89, 89, 0.3)",
},
{
offset: 1,
color: "rgba(51, 204, 204, 0.3)",
},
],
global: false,
}
},
data: [50, 60, 70, 60, 50]
},
{
name: '不合格率',
type: "line",
showSymbol: false,
symbol: "none", // 默认是空心圆（中间是白色的），改成实心圆
smooth: true,
lineStyle: {
normal: {
width: 1,
color: "#DD5B5B" // 线条颜色
},
},
areaStyle: {
color: {
type: "linear",
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
// 渐变颜色
{
offset: 0,
color: "rgba(149, 84, 84, 0.3)",
},
{
offset: 1,
color: "rgba(221, 91, 91, 0.3)",
},
],
global: false
},
},
data: [80, 90, 100, 90, 80]
}
]
};