弹性条形图中的自定义字段

Question

我使用浮动条形图来表示flex中的计划。数据的定义如下：

public var schedule:ArrayCollection = new ArrayCollection([
            {task:"task1",start:6,end:9},
            {task:"task2",start:11,end:12},
            {task:"task3",start:14,end:17}
        ]);

此处的开始和结束代表任务开始和结束的时间。 我的问题是xField（时间）总是从0开始，所以我将有一个很大的空白空间，图表看起来不太好。我希望它从6开始，作为任务“task1”的开始时间。我该怎么做？请帮忙。

Answer 1

只需使用LinearAxis的“最小”和“最大”属性即可。要获得实际的最小值和最大值，您可以在数据提供者中搜索它们。

<?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>