使用ChartJS注释插件在水平线上显示值和内容

时间:2018-06-24 19:24:25

标签: javascript annotations chart.js chartjs-2.6.0

我正在使用chartjs注释插件在chartjs中显示水平线。但是我面临的问题是我无法显示该值但能够绘制该线。

这就是我要在图表上显示值和内容的方式。可以在chartjs中使用吗?

enter image description here

我正在使用的脚本

annotations: [{
      id: 'hline1',
      type: 'line',
      mode: 'horizontal',
      scaleID: 'y-axis-0',
      value:42.3, 
      borderColor: 'red',
      borderDash: [8,5],
      borderWidth: 1,
      label: {
         backgroundColor: "white",
         fontColor:"red",
         content:"Benchmark",
         enabled:true,
          position : "left",
         fontStyle: "bold",
         xPadding: 0,
         xAdjust: 10,
          fontSize: 14,
          yPadding: 0,
        yAdjust: 10
      }
   }, {
      id: 'hline2',
      type: 'line',
      mode: 'horizontal',
      scaleID: 'y-axis-0',
      value: 22.3,
      borderColor: 'green',
      borderDash: [8,5],
      borderWidth: 1,
      label: {
        backgroundColor: "white",
         fontColor:"green",
         fontStyle: "bold",
         content: "Target",
         enabled: true,
        position : "left",
        xPadding: 0,
        fontSize: 14,
          yPadding: 0,
        yAdjust: 10

      }
   }]

0 个答案:

没有答案