Column Chart with Columns That Vary in Width

Question

The subject is Column Chart with Columns That Vary in Width.
I have been concentrating on the column renderer. Unfortunately,
the renderer class receives control with access to limited
information. Mainly, what it gets is pixel counts that measure the
dimensions of the rectangle that ends up being a column. There is
no straightforward way to send width information to the renderer. I
can, however, change the color of the column. I thought of encoding
the width in the height, but that distorts the actual height,
potentially causing the chart scale to be computed incorrectly.
Also, the encoding is hard to reverse once the height in
transformed by an unknown and varying scale factor so that the
column fits on the chart. I love the way the column chart looks. I
only want to alter the width of each individual column. Since I am
drawing each column, if I knew the widths, I'd be done by now. Do
you have a better approach? Thanks in advance.

Answer 1

You need three ColumnSeries. Set the dataProvider of each directly (instead of setting it for the ColumnChart) to something like this:
  var cars:ListCollectionView = new ListCollectionView();
  cars.list = inventory;
  cars.filterFunction = function(item:Object):Boolean {
    return item['category' /* or whatever your category field is */] == 'cars';
Do something similar for bikes and trucks. You can do something like this if you don't know the number of categories as well, but it's rather trickier (and left as an exercise for the reader).