ChartJS:条形图分布不均匀

时间:2019-12-02 13:07:46

标签: jquery chart.js

我正在尝试在具有以下前提条件的ChartJS条形图中显示一组销售额:

  1. yAxis显示订单总数
  2. xAxis显示一年中的月份
  3. 订单在相应月份显示为条形

我的问题:我没有找到有关如何在标签中显示多个条形的任何示例。我试图通过为每个订单使用一个数据集来实现此目的,每个订单月(订单月份除外)的值为零,但这会导致条形变得非常小并且存在很多空白,因为条形宽度是根据到数据集数据中值的数量(在我的示例10中)。当有更多订单时,情况将更糟。

示例:

new Chart(ctx, {
        type: 'bar',
        data: {
            labels: ["January", "February", ...],
            datasets: 
            [
                {
                    label: "Order 1",
                    fillColor: "blue",
                    data: [3,0,0,0,0,0,0,0,0,0,0,0],
                    borderWidth: 1
                },
                {
                    label: "Order 2",
                    fillColor: "blue",
                    data: [0,1,0,0,0,0,0,0,0,0,0,0],
                    borderWidth: 1
                },{
                    label: "Order 3",
                    fillColor: "blue",
                    data: [0,0,0,0,5,0,0,0,0,0,0,0],
                    borderWidth: 1
                },
            ],
        },
        options: {...}
    });

输出:

example output

我如何实现此功能?如果ChartJs无法实现,我也感谢其他jQuery插件的建议。

0 个答案:

没有答案