使用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
}]
}

看一下我最終實現的屏幕截圖：