Javascript 如何在Chartjs 2条形图中修改条形宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31188888/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to modify bar width in Chartjs 2 bar charts
提问by VictorArcas
Can someone told me how to modify bar width in Chartjs 2 bar charts. There is nothing about it in the documentation.
有人可以告诉我如何修改 Chartjs 2 条形图中的条形宽度。文档中没有任何关于它的内容。
https://github.com/nnnick/Chart.js/tree/v2.0-dev/docsIdon't know what to do.
https://github.com/nnnick/Chart.js/tree/v2.0-dev/docs我不知道该怎么办。
采纳答案by potatopeelings
Note that there seems to be some changes going on. The actual configuration would depend on which v2.0 you are using.
请注意，似乎正在进行一些更改。实际配置将取决于您使用的是哪个 v2.0。
For Version 2.0.0-alpha
对于版本 2.0.0-alpha
Set categorySpacingfor the xAxes. You can do this globally
categorySpacing为 xAxes设置。您可以在全球范围内执行此操作
Chart.defaults.bar.scales.xAxes[0].categorySpacing = 0
or you can do it by chart
或者你可以通过图表来做
...
scales: {
xAxes: [{
categorySpacing: 0
}],
...
Fiddle - http://jsfiddle.net/beehe4eg/
小提琴 - http://jsfiddle.net/beehe4eg/
For Version 1.0.2
对于 1.0.2 版
Adjust the options barValueSpacingand barDatasetSpacingto make the bars closer. This will automatically increase their width.
调整选项barValueSpacing，并barDatasetSpacing让酒吧更近。这将自动增加它们的宽度。
回答by Mihail Lebedev
For version 2.4.0 barThickness - Manually set width of each bar in pixels. If not set, the bars are sized automatically.
对于版本 2.4.0 barThickness - 以像素为单位手动设置每个条的宽度。如果未设置，条形将自动调整大小。
options = {
scales: {
xAxes: [{
barThickness : 73
}]
}
}
回答by py7133
For me, trying 2.0 beta, what worked was to set the barPercentage on the xAxes scale option.
对我来说，尝试 2.0 测试版，有效的是在 xAxes 比例选项上设置 barPercentage。
This is what I used:
这是我使用的：
var options = {
data: chartData,
type: "bar",
options: {
scales: {
xAxes: [{ barPercentage: 0.5 }]
}
}
};
var chart = new Chart(chartCtx, options);
