Custom field in flex bar chart - apache-flex

Question

I am using floating bar charts to represent schedule in flex. Data is defined like this:
public var schedule:ArrayCollection = new ArrayCollection([
{task:"task1",start:6,end:9},
{task:"task2",start:11,end:12},
{task:"task3",start:14,end:17}
]);
start and end here stands for the time that task begins and finishes.
My question is the xField (time) always start from 0, so that I will have quite a large empty space and the chart doesn't look nice. I want it start from 6, as the start time of task "task1". How can I do it? Please help.

Answer 1

Just use the properties "minimum" and "maximum" of LinearAxis. To get the actual min und max values you can search them in the data provider.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
minWidth="955" minHeight="600" creationComplete="init()">
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
[Bindable]public var schedule:ArrayCollection = new ArrayCollection([
{task:"task1", start:6, end:9},
{task:"task2", start:11, end:12},
{task:"task3", start:14, end:17}
]);
[Bindable]private var minTime:Number = 24;
[Bindable]private var maxTime:Number = 0;
protected function init():void
{
for each (var task:Object in schedule)
{
if (task.start < minTime)
minTime = task.start;
if (task.end > maxTime)
maxTime = task.end;
}
}
]]>
</fx:Script>
<mx:BarChart
dataProvider="{schedule}"
showDataTips="true">
<mx:verticalAxis>
<mx:CategoryAxis
dataProvider="{schedule}"
categoryField="task"/>
</mx:verticalAxis>
<mx:horizontalAxis>
<mx:LinearAxis minimum="{minTime}" maximum="{maxTime}"/>
</mx:horizontalAxis>
<mx:series>
<mx:BarSeries
xField="end"
minField="start"/>
</mx:series>
</mx:BarChart>
</s:Application>