How to modify bar width in Chartjs 2 bar charts

问题:

Can someone told me how to modify bar width in Chartjs 2 bar charts. 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.

回答1:

Note that there seems to be some changes going on. The actual configuration would depend on which v2.0 you are using.

For Version 2.0.0-alpha

Set categorySpacing for the xAxes. 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/

---

For Version 1.0.2

Adjust the options barValueSpacing and barDatasetSpacing to make the bars closer. This will automatically increase their width.

回答2:

For version 2.4.0 barThickness - Manually set width of each bar in pixels. If not set, the bars are sized automatically.

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

回答3:

For me, trying 2.0 beta, what worked was to set the barPercentage on the xAxes scale option.

This is what I used:

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

文章来源: How to modify bar width in Chartjs 2 bar charts