Labelfunction in Barseries along with plotseries
I have a Flec Bar chart. It has a Bar series. I need to show the datalabel at the tip of the bars. For this am using labelFunction.This works fine. Now I want to add a plotseries in the same chart. Once it is added the labelfunction in the bar series is not working. The labels are not visible.Any idea?Thanks
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script><![CDATA[
import mx.charts.series.items.PlotSeriesItem;
import mx.charts.series.items.BarSeriesItem;
import mx.charts.ChartItem;
import mx.controls.Label;
import mx.collections.ArrayCollection;
//Dataprovider for chart
[Bindable]
private var medalsAC:ArrayCollection = new ArrayCollection([
{ Country: "USA", Gold: 35, Silver:39, Bronze: 29,prevRank:"1",isIncrease:true },
{ Country: "China", Gold: 32, Silver:17, Bronze: 14,prevRank:"2",isIncrease:false }
]);
private function setCustomLabel(element:ChartItem):String {
var data:BarSeriesItem = BarSeriesItem(element);
return (data.item.prevRank).toString();
}
public function init(element:Object):String {
var data:PlotSeriesItem = PlotSeriesItem(element);
if(data.item.isIncrease){
return "images/increase.png";
}
else{
return "images/decrease.png";
}
}
]]></mx:Script>
<mx:VBox>
<mx:BarChart id="bar" showDataTips="true"
dataTipMode="multiple" >
<mx:verticalAxis>
<mx:CategoryAxis id="v1" categoryField="Country" dataProvider="{medalsAC}"/>
</mx:verticalAxis>
<mx:verticalAxisRenderers>
<mx:AxisRenderer placement="left" axis="{v1}"
verticalAxisTitleAlignment="vertical">
</mx:AxisRenderer> 开发者_JAVA百科
</mx:verticalAxisRenderers>
<mx:series>
<mx:BarSeries id="bs2"
yField="Country"
xField="Silver"
dataProvider="{medalsAC}" labelFunction="setCustomLabel"
/>
<mx:PlotSeries id="plotSeries" yField="Country" xField="Silver" dataProvider="{medalsAC}"
displayName="Current Trend">
<mx:itemRenderer>
<mx:Component>
<mx:Image source="{outerDocument.init(data)}" horizontalAlign="center" height="16" width="16"/>
</mx:Component>
</mx:itemRenderer>
</mx:PlotSeries>
</mx:series>
</mx:BarChart>
</mx:VBox>
</mx:Application>
Try something like this:
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.charts.ChartItem;
import mx.charts.chartClasses.Series;
import mx.charts.series.items.BarSeriesItem;
import mx.charts.series.items.PlotSeriesItem;
import mx.collections.ArrayCollection;
import mx.controls.Label;
//Dataprovider for chart
[Bindable]
private var medalsAC:ArrayCollection = new ArrayCollection([
{ Country: "USA", Gold: 35, Silver:39, Bronze: 29,prevRank:"1",isIncrease:true },
{ Country: "China", Gold: 32, Silver:17, Bronze: 14,prevRank:"2",isIncrease:false }
]);
private function setCustomLabel(element:ChartItem, series:Series):String
{
var data:BarSeriesItem = BarSeriesItem(element);
return (data.item.prevRank).toString();
}
public function init(element:Object):String
{
var data:PlotSeriesItem = PlotSeriesItem(element);
if(data && data.item)
{
if(data.item.isIncrease){
return "images/increase.png";
}
else{
return "images/decrease.png";
}
}
return "";
}
]]>
</mx:Script>
<mx:VBox>
<mx:BarChart id="bar" showDataTips="true" dataProvider="{medalsAC}"
dataTipMode="multiple" >
<mx:verticalAxis>
<mx:CategoryAxis id="v1" categoryField="Country" dataProvider="{medalsAC}"/>
</mx:verticalAxis>
<mx:verticalAxisRenderers>
<mx:AxisRenderer placement="left" axis="{v1}"
verticalAxisTitleAlignment="vertical">
</mx:AxisRenderer>
</mx:verticalAxisRenderers>
<mx:series>
<mx:BarSeries id="bs2"
yField="Country"
xField="Silver"
labelPosition="inside"
labelFunction="setCustomLabel"
/>
<mx:PlotSeries id="plotSeries" yField="Country" xField="Silver" dataProvider="{medalsAC}"
displayName="Current Trend">
<mx:itemRenderer>
<mx:Component>
<mx:Image source="{outerDocument.init(data)}" horizontalAlign="center" height="16" width="16"/>
</mx:Component>
</mx:itemRenderer>
</mx:PlotSeries>
</mx:series>
</mx:BarChart>
</mx:VBox>
</mx:Application>
However, it must be said that the code is messy and you're using Flex 3 while Flex 4 is already out. You should create the item renderer in a separate class and always check for null objects because they can (and will) create errors.
精彩评论