如何使用最小，最大和平均值创建Chart.JS条形图

Question

我有一个应用程序正在通过服务生成一些巴特图。我的客户添加了一个额外的图表来显示范围（最小，最大和平均值）。我想知道他们是否是使用chart.js完成此操作的方法。我浏览了他们的文档，却找不到有关如何完成此操作的任何示例或文档。还有其他人遇到这个问题或他们喜欢其他图书馆吗？

Answer 1

我完全无法使它适用于条形图（用于折线图，散点图和雷达）。然后我在Min Max bar values

处发现了ChartChar 2.9的新功能

在bar和horizo​​ntalBar上成功使用它。

Answer 2

Chart.js使用以下选项支持可堆叠的bar图表：

scales: {
    xAxes: [{
        stacked: true,
    }],
    yAxes: [{
        stacked: true
    }]
}

对具有最小值的数据集使用fill: false选项，对于具有平均值和最大值的数据集使用fill: "-1"选项。然后选择两个不同的backgroundColor作为平均值和最大值。

我在Codepen上做了一个示例：https://codepen.io/fantasyzer/pen/MdpMMv

您还可以将配置type更改为line，它将仍然有效。