ColumnChart with custom widths for each Column / Bar Item

[escully27]

Summary

I have a bar chart and I want to have custom width for each item on the chart. I can currently set the width using "bar: chartOptions: columnWidth" but this only changes the width for every item on the chart. I want specific / different widths for each item.

API Changes

Ideally, could have something like:

{ bar: 
    { chartOptions: 
         columnWidth: ['40px', '20px', '40px', '10px', '50px']
    }
}

To apply to their respective Column items, it could also refer to series width instead and use the "distributed" option.

Intended Use Case

I want to achieve this, where the second column from the right is 50% less width than the column to the left of it, because it represent 1 mile and the left represents a 2 mile.

[escully27]

I've forked the example and made some progress but still struggling and not quite right.

I added a "columnWidths" attribute to the "plotOptions.bar" in Settings. This framing the shape of the bar correctly, however the hover overlay, grid and labels spacing/width are all still not correct.

The project is so dense and big I'm having trouble following of the code.

Desperate for some help.. thanks!

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.