在Chart.js中的图表内显示Label的总计(或仅显示一个字符串)

时间:2018-09-27 15:20:26

标签: charts chart.js

在Chart.js上,我需要在条形图上(而不是在每个条形图上)显示一些文本(例如,该标签数据的总计)。 例如,假设这是几个月的时间,其中包含一些x个月内吃披萨和汉堡包的人的数据。 现在,我想显示每个月吃比萨饼和汉堡包的人的总和(在下面的示例中为1100和1300)。我如何在一个月的中旬写些东西?

    1100    |    1300    |
       _    |   _   _    |
   _  | |   |  | | | |   |
  | | | |   |  | | | |   |
  | | | |   |  | | | |   |
   January  |  February  |

1 个答案:

答案 0 :(得分:0)

我设法解决了。可以使用名为
的外部插件来实现 chartjs annotation

annotation: {

    // Should be one of: afterDraw, afterDatasetsDraw, beforeDatasetsDraw
    drawTime: 'afterDatasetsDraw', // (default)


    annotations: [

                {

        type: 'line',
        mode: 'vertical',
        scaleID: 'x-axis-0',
        value: 'January',
        borderColor: 'transparent',
        borderWidth: 0,

                    label: {
                        backgroundColor: 'rgba(0,0,0,0.8)',
                        fontSize: 10,
                        fontStyle: "bold",
                        fontColor: "#fff",
                        xPadding: 6,
                        yPadding: 6,
                        cornerRadius: 6,
                        position: "center",
                        xAdjust: 0,
                        yAdjust: -80,
                        enabled: true,
                        content: "Totals etc"
                    }

                }


            ]
        }