[英]How to modify bar width in Chartjs 2 bar charts
Can someone told me how to modify bar width in Chartjs 2 bar charts. 有人能告诉我如何修改Chartjs 2条形图中的条宽。 There is nothing about it in the documentation. 文档中没有任何内容。
https://github.com/nnnick/Chart.js/tree/v2.0-dev/docsI don't know what to do. https://github.com/nnnick/Chart.js/tree/v2.0-dev/docs我不知道该怎么做。
For version 2.4.0 barThickness - Manually set width of each bar in pixels. 对于版本2.4.0 barThickness - 手动设置每个条的宽度(以像素为单位)。 If not set, the bars are sized automatically. 如果未设置,则条形图会自动调整大小。
options = {
scales: {
xAxes: [{
barThickness : 73
}]
}
}
For me, trying 2.0 beta, what worked was to set the barPercentage on the xAxes scale option. 对我来说,尝试2.0 beta,有用的是在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);
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 categorySpacing
for the xAxes. 为xAxes设置categorySpacing
。 You can do this globally 你可以在全球范围内这样做
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 barValueSpacing
and barDatasetSpacing
to make the bars closer. 调整选项barValueSpacing
和barDatasetSpacing
以使条形更近。 This will automatically increase their width. 这将自动增加其宽度。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.