我想有黑色的边界在每一个边界的X轴的Y尺度。我怎么能做到这一点,并有一个边界,从0开始的x轴。所以我希望每个x轴都有黑色边框,边框的值应该为0。(我只是分享了y1和y2,但实际上在我的代码中也有y3和y4)以下是我的刻度代码:
scales: {
x: {
type: "linear",
position: "left",
max: this.res.maxs[0],
min: 0,
gridLines: {
display: true,
},
},
y1: {
type: "linear",
position: "left",
stack: "demo",
stackWeight: 1,
max: this.res.maxs[4],
min: 0,
title: {
display: true,
text: this.axisLabels[3],
font: {
size: 11,
},
},
},
y2: {
type: "linear",
position: "left",
stack: "demo",
stackWeight: 1,
grid: {
borderColor: "blue",
},
max: this.res.maxs[2],
min: -10,
title: {
display: true,
text: this.axisLabels[1],
font: {
size: 11,
},
},
ticks: {
callback: (value, index, values) =>
index == 0 ? undefined : value.toFixed(1),
},
},
}
1条答案
按热度按时间pxy2qtax1#
一个安全的解决方案是使用具有line annotation的插件
chartjs-plugin-annotation
。y2
轴底部的直线可以通过以下选项获得:如果先验已知,则
value
可以设置为固定数值。然而,value
以及大多数其他属性是可脚本化的,这在这种情况下是一个很大的优势,当轴具有offset: true
时,因此实际的最小值(以及最大值)不仅由数据决定,而且还由使所有轴适合可用空间的目标决定。在上面的例子中,
id
是任意的,我选择它对人类有意义,唯一的要求是每个注解都有不同的id
。在每个图表底部绘制一条线的最小代码段示例: