具有不同条形宽度的Chart.js

时间:2018-10-19 16:43:04

标签: javascript node.js charts chart.js

我需要创建具有不同条形宽度的条形图,我发现的解决方案是使用不同的xAxisID,然后更改其barThickness,这部分工作正常,但条形不正确

chartJsOptions = 
{
      type: 'bar',
        data: {
            labels: [],
            datasets: [
                {
                    label: "Ofertado",
                    data: [],
                    borderColor: 'rgb(83,141,213)',
                    borderWidth: 3,
                    xAxisID: 'x-axis-2'

                },
                {
                    label:''[enter image description here][1],
                    data: [],
                    borderColor: '#e26b0a',
                    borderWidth: 3,
                    xAxisID: 'x-axis-1'

                },
                {
                    label: '',
                    data: [],
                    borderColor: '#961709',
                    xAxisID: 'x-axis-3',
                    borderWidth: 3,
                },
            ],
        }
        ,
        options: {
            scales: {
                xAxes: [
                    {
                        stacked: true,
                    },
                    {
                        id: 'x-axis-2',
                        display: false,
                        type: 'category',
                        barThickness: 50,
                        stacked: true,
                    },
                    {
                        id: 'x-axis-3',
                        type: 'category',
                        display: false,
                        barThickness: 40,
                        stacked: true,
                    },
                    {
                        id: 'x-axis-1',
                        type: 'category',
                        display: false,
                        barThickness: 30,
                        stacked: true,
                    }
                ],
                yAxes: [{
                    stacked: false,
                }
                ]
            },
            title: {
                display: true,
                text: ''
            }
        }
    };

条宽度有效,但列不正确。我正在使用chartjs-node来生成服务器端图表。有谁知道如何将条形图放置在正确的位置?

0 个答案:

没有答案