###1、需求描述
需要绘制多条折线,但是多条折线在某个或者某几个X点不存在Y值。
###2、代码
initChart() {
let chart = echarts.init(document.getElementById("echarts"))
let option = {
title: {
text: "Step Line"
},
tooltip: {
trigger: "axis"
},
legend: {
data: ["Step Start", "Step Middle", "Step End"]
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
},
yAxis: {
type: "value"
},
series: [
{
name: "Step Start",
type: "line",
step: "start",
// data: [120, 132, 101, 134, 90, 230, 210]
data: [["Mon", 120], ["Tue", 132], ["Wed", 101], ["Thu", 134], ["Fri", 90], ["Sat", 230], ["Sun", 210]]
},
{
name: "Step Middle",
type: "line",
step: "middle",
data: [ ["Wed", 134], ["Fri", 90], ["Sat", 230], ["Sun", 210]]
},
{
name: "Step End",
type: "line",
step: "end",
data: [["Mon", 120], ["Tue", 132], ["Wed", 101], ["Thu", 134], ["Fri", 90], ["Sun", 20]]
}
]
};
chart.setOption(option)
}