首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 媒体动画 > flex >

flex4 改变DataTip的式样

2012-08-15 
flex4 改变DataTip的样式由于暂时只用到二种,所以先附上代码,其它类型的可参考修改mx:ColumnChart width

flex4 改变DataTip的样式
由于暂时只用到二种,所以先附上代码,其它类型的可参考修改

<mx:ColumnChart width="100%" fontSize="12" fontWeight="normal" fontFamily="宋体" paddingLeft="5" paddingRight="5"
        showDataTips="true" dataTipRenderer="com.common.custom.skin.DataTipSkin" dataProvider="{_medalsAC}">
     <mx:horizontalAxis>
      <mx:CategoryAxis categoryField="shi"/>
     </mx:horizontalAxis>
     <mx:series>
      <mx:ColumnSeries xField="shi" yField="dzsl" displayName="电站总数"/>
     </mx:series>
    </mx:ColumnChart>



<mx:PieChart id="chart" width="100%" paddingRight="5" paddingLeft="5" fontSize="12" fontWeight="normal" fontFamily="宋体"
         showDataTips="true" dataTipRenderer="com.common.custom.skin.DataTipSkin" dataProvider="{_medalsAC}">
      <mx:series>
       <mx:PieSeries nameField="shi" labelFunction="displayZzjrl" displayName="{}" labelPosition="callout"
            field="zzjrl"/>
      </mx:series>
     </mx:PieChart>



com.common.custom.skin.DataTipSkin文件内容如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"
   backgroundColor="#FFFEE9" borderColor="#010101" borderStyle="solid" paddingTop="5" paddingBottom="5" paddingRight="10"
   paddingLeft="10" verticalGap="-2" color="#000000" backgroundAlpha="0.81">
<mx:Label text="{_valueText}" width="100%" textAlign="left" fontSize="12" fontWeight="normal"/>
<mx:Label text="{_labelText}" width="100%" textAlign="left" fontWeight="normal" fontSize="12"/>
<fx:Script>
  <![CDATA[
   import mx.charts.ColumnChart;
   import mx.charts.HitData;
   import mx.charts.PieChart;
   import mx.charts.series.LineSeries;
   import mx.charts.series.PieSeries;
   import mx.charts.series.items.ColumnSeriesItem;
   import mx.charts.series.items.LineSeriesItem;
   import mx.charts.series.items.PieSeriesItem;

   [Bindable]
   private var _labelText:String;

   [Bindable]
   private var _valueText:String;

   override public function set data(value:Object):void {
    var hd:HitData = value as HitData;

    var item:* = hd.chartItem;
    var ser:* = hd.element;

    if (item is ColumnSeriesItem) {
     //ColumnSeries1287
     _labelText = String(item.xValue + ':' + item.yValue);
     _valueText = String(ser.displayName);
    } else if (item is PieSeriesItem) {
     //PieSeries1361
     _valueText = value.item[PieSeries(ser).nameField] + ":" + PieSeriesItem(item).value.toString();
     _labelText = (" " + PieSeriesItem(item).percentValue).substr(0, 6) + "%";
    }
   }
  ]]>
</fx:Script>

</mx:VBox>


热点排行