How to set a maximum width to a specific bar in a column/bar series in ag-charts?

I am creating a dynamic chart using ag-charts wherein sometimes only a single label or value is there in the x-axis. In that case the bar in the chart becomes really thick and huge and doesn't appear very user friendly (as shown in the figure).

I would like to fix a maximum width to the bars in such a way that irrespective of the number of bars in the chart, the width should not go beyond a particular value. I have tried many approaches, like adding maxWidth, barPercentage etc, but nothing seems to be working.

const options = {
container: document.getElementById('myChart'),
title: {
text: "Apple's revenue by product category",
},
subtitle: {
text: 'in billion U.S. dollars',
},
data: getData(),
series: [
{
type: 'column',
xKey: 'quarter',
yKey: 'iphone',
},
],
};




I tried using maxWidth, barPercentage but nothing seems to be working. I want to decrease the width of the bar.

Continue reading...