使用Chart.js的折线图网格上用于自定义水平线Y轴标记的插件

Question

我需要在Chart.js折线图的Y轴上创建“上”和“下”标记。 我似乎找不到一个开箱即用的方式来做到这一点。 任何人都可以帮助我如何编写一个插件来实现这样的目标？ （请参见沿70和50 Y轴的水平红线。

Answer 1

我在Chart.js GitHub根页面上找到了一个名为Chart.Annotations.js的插件。 这正是我所需要的！

您需要将以下属性添加到选项对象。 在要绘制的每行上添加一个注解：属性。 就我而言，我有2。

annotation: {
annotations: [{
    type:'line',
    mode:'horizontal',
    scaleID:'y-axis-1',
    value:'10',
    borderColor:'#000000',
    borderWidth:2
}]
}

看一下我最终实现的屏幕截图：