如何修改Chartjs 2条形图中的条宽

Question

有人可以告诉我如何修改Chartjs 2条形图中的条宽.文档中没有任何内容.

https://github.com/nnnick/Chart.js/tree/v2.0-dev/docs我不知道该怎么做.

Answer 1

对于版本2.4.0 barThickness - 手动设置每个条的宽度(以像素为单位).如果未设置,则条形图会自动调整大小.

options = {
    scales: {
        xAxes: [{
            barThickness : 73
        }]
    }
}

Answer 2

对我来说,尝试2.0 beta,有用的是在xAxes比例选项上设置barPercentage.

这是我用过的:

var options = {
    data: chartData,
    type: "bar",
    options: {
        scales: {
            xAxes: [{ barPercentage: 0.5 }]
        }
    }
};
var chart = new Chart(chartCtx, options);

Answer 3

请注意,似乎正在进行一些更改.实际配置取决于您使用的是哪个v2.0.

对于版本2.0.0-alpha

设置categorySpacing为xAxes.你可以在全球范围内这样做

Chart.defaults.bar.scales.xAxes[0].categorySpacing = 0

或者你可以通过图表来做到这一点

...
scales: {
    xAxes: [{
        categorySpacing: 0
    }],
...

小提琴 - http://jsfiddle.net/beehe4eg/

对于1.0.2版

调整选项barValueSpacing,并barDatasetSpacing让酒吧更近.这将自动增加其宽度.