Search code examples
typescriptamcharts4

How can I limit the maximum width/height of a column in AmCharts 4 XYChart


Is it possible to limit the maximum width of a column in an XY Chart? I am using AmCharts4 in an Angular Project with Typescript.

In the picture below:

  • Left Chart: What happens when I send many rows of data to an XY Chart
  • Middle Chart: When I send one row of data to an XY Chart.
  • Right Chart: What I would like to have happen when I send one row of data to an XY Chart

Is there a way to prevent the 2nd chart from having its single column expand so much? It's fine if it expands, but I would like to be able to limit it in some way.

Maybe something like? categoryAxis.maxColumnWidth = 50

I checked the documentation here: https://www.amcharts.com/docs/v4/tutorials/managing-width-and-spacing-of-column-series/ but did not see anything.

enter image description here


Solution

  • You can set the maxWidth of Column Series like this:

    let columnSeries = chart.series.push(new am4charts.ColumnSeries()); 
    columnSeries.columns.template.maxWidth = 50