如何降低ng2图表中的barthickness

Question

barchart

html文件

<canvas width="3" height="1"
*ngIf="loaded"
baseChart
[data]="barChartData"
[labels]="barChartLabels"
[options]="barChartOptions"
[legend]="barChartLegend"
[chartType]="barChartType"
[colors]="chartColors"
>
</canvas>

ts文件

chartColors: Array<any> = [
{
// all colors in order
backgroundColor: ['#2EA082', '#2B2272', '#A687FF'],
},
];
barChartOptions: ChartOptions = {
responsive: true,
legend: {
display: false,
},
scales: {
yAxes: [
{
ticks: {
callback: function (value: number, index, values) {
return '$ ' + Intl.NumberFormat().format(value / 100000) + 'K';
},
},
},
],
xAxes: [
{
gridLines: {
lineWidth: 0,
},
},
],
},
};
barChartLabels: string[] = [];
barChartType: ChartType = 'bar';
barChartLegend: boolean = true;
barChartData: any[] = [];
loaded = false;

我使用的是chartjs 2.9.4和ng2 2.4.2版本。如何减少棒材厚度，我也尝试在xAxes下使用棒材厚度，但它不起作用。我已附上图像以供参考

Answer 1

您可以使用此处所述的数据集选项barPercentage。

在你的代码中，这可能看起来如下：

barChartData: ChartDataSets[] = [
{
label: 'My Dataset',
data: [65, 56, 40],    
barPercentage: 0.5
}
];

Answer 2

只需插入静态数据进行测试，并设置barThickness属性而不是barPercentage。它对我有效。