使用NaN填充不同长度的线系列来对齐标签,如下所示:
var chart = new CanvasJS.Chart("chartContainer", {
// 设置图表属性
data: [
{
type: "line",
name: "系列 A",
showInLegend: true,
dataPoints: [
{ x: 10, y: 71 },
{ x: 20, y: 55 },
{ x: 30, y: 50 },
{ x: 40, y: 65 },
{ x: 50, y: 95 },
]
},
{
type: "line",
name: "系列 B",
showInLegend: true,
dataPoints: [
{ x: 10, y: 75 },
{ x: 20, y: 65 },
// 在此插入NaN以对齐标签
{ x: 30, y: NaN },
{ x: 40, y: NaN },
{ x: 50, y: NaN },
{ x: 60, y: 92 },
{ x: 70, y: 85 },
]
},
]
});
chart.render();
上述代码中,系列B的标签将与系列A对齐,因为使用了NaN来填充对齐起始位置。
下一篇:不同长度的xy列表的2D图