如何創建一個方法來計算和設置圖表的間隔

Question

我正在學習flex。我需要你的幫助，我想創建一個方法來計算垂直軸的間隔值，這取決於「dataProvider」的值。

<mx:verticalAxis> 
     <mx:LinearAxis labelFunction="usageColumnSerieLabelFn" interval="0.0001"/> 
    </mx:verticalAxis> 

就像你看到的，在那段代碼中，我對代碼段進行了硬編碼。就像我說的，我想要你的幫助，以創建一個計算和設置這個值的新方法。我相信，如果我們在「dataProvider」中取較大的值，然後將該值（較大的值+ 0.1）設置爲間隔。會做的伎倆。但是我不知道如何設置mx以外的屬性：LinearAxis組件。

我做了這個例子，如果你有時間，請給我一個手。

問候

<?xml version="1.0"?> 
<!-- charts/BasicColumn.mxml --> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> 
    <mx:Script><![CDATA[ 
    import mx.collections.ArrayCollection; 
    import flash.external.ExternalInterface; 
    import mx.charts.HitData; 

    import mx.formatters.SwitchSymbolFormatter; 
    import mx.charts.series.items.LineSeriesItem; 
    import mx.charts.HitData; 
    import mx.formatters.NumberFormatter; 
    import mx.core.UIComponent; 
    import mx.effects.easing.Bounce; 
    import mx.managers.PopUpManager; 

    private var decimalFormatter:NumberFormatter = new NumberFormatter(); 

    [Bindable] 
    public var expenses:ArrayCollection = new ArrayCollection([ 
     {hour:"00", Expenses:0.0}, 
     {hour:"01", Expenses:0.0}, 
     {hour:"02", Expenses:0.0}, 
     {hour:"03", Expenses:0.0}, 
     {hour:"04", Expenses:0.0}, 
     {hour:"05", Expenses:0.0}, 
     {hour:"06", Expenses:0.0}, 
     {hour:"07", Expenses:0.0}, 
     {hour:"08", Expenses:0.0}, 
     {hour:"09", Expenses:0.0}, 
     {hour:"10", Expenses:0.00009}, 
     {hour:"11", Expenses:0.00009}, 
     {hour:"12", Expenses:0.0}, 
     {hour:"13", Expenses:0.0}, 
     {hour:"14", Expenses:0.0}, 
     {hour:"15", Expenses:0.0}, 
     {hour:"16", Expenses:0.0}, 
     {hour:"17", Expenses:0.0}, 
     {hour:"18", Expenses:0.0}, 
     {hour:"19", Expenses:0.0}, 
     {hour:"20", Expenses:0.0}, 
     {hour:"21", Expenses:0.0}, 
     {hour:"22", Expenses:0.0}, 
     {hour:"23", Expenses:0.00009} 
    ]); 

    private function customDataTipFunc(item:HitData):String{ 

     decimalFormatter.precision = 4; 
     var dataTip:String = ""; 

     dataTip += "<B>kWh</B>\n"; 
     dataTip += item.item.hour + "\n"; 

     if (item.item.Expenses == 0) { 
      dataTip += decimalFormatter.format(item.item.Expenses).toString() + " kWh"; 
     } else { 
      if(item.item.Expenses < 0.0001) { 
       dataTip += "&lt;0.0001 kWh";  
      } else { 
       dataTip += decimalFormatter.format(item.item.Expenses).toString() + " kWh"; 
      } 
     } 

     return dataTip; 
    } 

    public function axisLabelFn(cat:Object,pcat:Object,ax:LinearAxis):String{ 
       var nf1:NumberFormatter = new NumberFormatter(); 
       nf1.useThousandsSeparator = true; 
       nf1.precision = 4; 

       var tempNumber:Number = Number(cat.toString()); 
       var out:String = "" 

       if (tempNumber == 0) { 
        out = nf1.format(cat) + " kWh"; 
       }else { 
        if (tempNumber < 0.0001) { 
         out = "&lt;" + nf1.format(cat) + " kWh";  
        } else { 
         out = nf1.format(cat) + " kWh"; 
        } 
       } 

       //return nf1.format(cat) + " kWh"; 
       return out; 
    } 

    ]]></mx:Script> 
    <mx:Panel title="Column Chart Kwh" width="1200"> 
    <mx:ColumnChart id="myChart" showDataTips="true" height="100%" width="100%" dataProvider="{expenses}" minHeight="150" dataTipFunction="customDataTipFunc"> 
     <mx:horizontalAxis> 
      <mx:CategoryAxis 
       dataProvider="{expenses}" 
       categoryField="hour" 
      /> 
     </mx:horizontalAxis> 
     <mx:verticalAxis> 
      <mx:LinearAxis labelFunction="axisLabelFn" interval="0.0001"/> 
     </mx:verticalAxis> 
     <mx:series> 
      <mx:ColumnSeries 
       xField="hour" 
       yField="Expenses" 
       displayName="Kwh" 
      /> 
     </mx:series> 
    </mx:ColumnChart> 
    <mx:Legend dataProvider="{myChart}"/> 
    </mx:Panel> 
</mx:Application> 

Answer 1

感謝宙斯爲你的話。我嘗試了一些東西，這是最終的「解決方案」。

<?xml version="1.0"?> 
<!-- charts/BasicColumn.mxml --> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    creationComplete="calculateInterval()"> 
    <mx:Script><![CDATA[ 
    import mx.collections.ArrayCollection; 
    import flash.external.ExternalInterface; 
    import mx.charts.HitData; 

    import mx.formatters.SwitchSymbolFormatter; 
    import mx.charts.series.items.LineSeriesItem; 
    import mx.charts.HitData; 
    import mx.formatters.NumberFormatter; 
    import mx.core.UIComponent; 
    import mx.effects.easing.Bounce; 
    import mx.managers.PopUpManager; 

    private var decimalFormatter:NumberFormatter = new NumberFormatter(); 


    [Bindable] 
    public var expenses:ArrayCollection = new ArrayCollection([ 
     {hour:"00", Expenses:0.0}, 
     {hour:"01", Expenses:0.0}, 
     {hour:"02", Expenses:0.0}, 
     {hour:"03", Expenses:0.0}, 
     {hour:"04", Expenses:0.0}, 
     {hour:"05", Expenses:0.0}, 
     {hour:"06", Expenses:0.0}, 
     {hour:"07", Expenses:0.0}, 
     {hour:"08", Expenses:0.0}, 
     {hour:"09", Expenses:0.0}, 
     {hour:"10", Expenses:0.00009}, 
     {hour:"11", Expenses:0.00009}, 
     {hour:"12", Expenses:0.0}, 
     {hour:"13", Expenses:0.0}, 
     {hour:"14", Expenses:0.0}, 
     {hour:"15", Expenses:0.0}, 
     {hour:"16", Expenses:0.0}, 
     {hour:"17", Expenses:0.0}, 
     {hour:"18", Expenses:0.0}, 
     {hour:"19", Expenses:0.0}, 
     {hour:"20", Expenses:0.0}, 
     {hour:"21", Expenses:0.0}, 
     {hour:"22", Expenses:0.0}, 
     {hour:"23", Expenses:0.00009} 
    ]); 


    public function calculateInterval():void{ 
     var maxValue:Number = 0; 
     for (var x:int = 0; x < expenses.length; ++x) {    
      if (maxValue < expenses.getItemAt(x).Expenses){ 
       maxValue = expenses.getItemAt(x).Expenses; 
      } 
     } 
     MyLinearAxis.interval = maxValue + 0.0001; 

    } 

    private function customDataTipFunc(item:HitData):String{ 

     decimalFormatter.precision = 4; 
     var dataTip:String = ""; 

     dataTip += "<B>kWh</B>\n"; 
     dataTip += item.item.hour + "\n"; 

     if (item.item.Expenses == 0) { 
      dataTip += decimalFormatter.format(item.item.Expenses).toString() + " kWh"; 
     } else { 
      if(item.item.Expenses < 0.0001) { 
       dataTip += "&lt;0.0001 kWh";  
      } else { 
       dataTip += decimalFormatter.format(item.item.Expenses).toString() + " kWh"; 
      } 
     } 

     return dataTip; 
    } 

    public function axisLabelFn(cat:Object,pcat:Object,ax:LinearAxis):String{ 

       var nf1:NumberFormatter = new NumberFormatter(); 
       nf1.useThousandsSeparator = true; 
       nf1.precision = 4; 

       var tempNumber:Number = Number(cat.toString()); 
       var out:String = "" 

       if (tempNumber == 0) { 
        out = nf1.format(cat) + " kWh"; 
       }else { 
        if (tempNumber < 0.0001) { 
         out = "&lt;" + nf1.format(cat) + " kWh";  
        } else { 
         out = nf1.format(cat) + " kWh"; 
        } 
       } 

       return out; 
    } 

    ]]></mx:Script> 
    <mx:Panel title="Column Chart Kwh" width="1200"> 
    <mx:ColumnChart id="myChart" showDataTips="true" height="100%" width="100%" dataProvider="{expenses}" minHeight="150" dataTipFunction="customDataTipFunc"> 
     <mx:horizontalAxis> 
      <mx:CategoryAxis 
       dataProvider="{expenses}" 
       categoryField="hour" 
      /> 
     </mx:horizontalAxis> 
     <mx:verticalAxis> 
      <mx:LinearAxis id="MyLinearAxis" labelFunction="axisLabelFn" /> 
     </mx:verticalAxis> 
     <mx:series> 
      <mx:ColumnSeries 
       xField="hour" 
       yField="Expenses" 
       displayName="Kwh" 
      /> 
     </mx:series> 
    </mx:ColumnChart> 
    <mx:Legend dataProvider="{myChart}"/> 
    </mx:Panel> 
</mx:Application> 

就像你看到的，我調用函數「calculateInterval（）」用的MX調用方法「creationComplete」的應用。在這種方法中，我正在計算間隔並將偏移量設置爲數據提供者中的最大值。

我也設置了一個id給linearAxis，用這個ID我設置了間隔。

如果您認爲一個更好的方法，請讓我知道。

問候。