Flex LINE Chartのdata TipFunction
3370 ワード
<?xml version="1.0"?>
<!-- charts/HitDataCastingWithPercent.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" initialize=
"init()">
<mx:Script><![CDATA[
import mx.collections.ArrayCollection;
import mx.charts.HitData;
import mx.charts.series.ColumnSeries;
import mx.charts.series.items.ColumnSeriesItem;
[Bindable]
public var dataSet:ArrayCollection = new ArrayCollection([
{Month:"Jan", Income:1500, Profit:90},
{Month:"Feb", Income:1200, Profit:100},
{Month:"Mar", Income:750, Profit:150}
]);
public var b:Boolean = true;
public function myDataTipFunction(e:HitData):String {
var s:String;
s = "<B>" + [b]ColumnSeries(e.element).displayName[/b] + "</B>
";
s += "<I>Income:</I> <FONT COLOR='#339966'>$" +
e.item.Income + "</FONT>
";
s += "<I>Expenses:</I> <FONT COLOR='#FF0000'>$" +
(e.item.Income - e.item.Profit) + "</FONT>
";
s += "------------------------
";
s += "<I>Profit:</I> $" + e.item.Profit + "
";
// The value of the Income will always be 100%,
// so exclude adding that to the DataTip. Only
// add percent when the user gets the Profit DataTip.
var percentValue:Number =
Number(ColumnSeriesItem(e.chartItem).yValue);
if (percentValue < 100) {
s += "Profit was equal to about <B>" +
Math.round(percentValue) + "</B>% of the income.
";
}
return s;
//return e.item.Month + ":<B>$" + e.item.Profit + "</B>";
}
]]></mx:Script>
<mx:Panel title="Accessing ChartItems from HitData Objects">
<mx:ColumnChart id="myChart"
dataProvider="{dataSet}"
type="100%"
dataTipFunction="myDataTipFunction"
showDataTips="true"
>
<mx:horizontalAxis>
<mx:CategoryAxis categoryField="Month"/>
</mx:horizontalAxis>
<mx:series>
<mx:ColumnSeries
yField="Profit"
displayName="Profit '06"
/>
<mx:ColumnSeries
yField="Income"
displayName="Income '06"
/>
</mx:series>
</mx:ColumnChart>
<mx:Legend dataProvider="{myChart}"/>
</mx:Panel>
</mx:Application>
http://item.taobao.com/item.htm?id=16283195800&