Flex : lineChart Effect 效果。。。。

<?xml version="1.0"?>
<!-- Simple example to demonstrate the GridLines class. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"  xmlns:comp="com.*"  creationComplete="loadData()" >
    
<mx:Script>
        
<![CDATA[
            import mx.charts.CategoryAxis; 
            import mx.charts.chartClasses.IAxis; 
        import mx.collections.ArrayCollection;
        import mx.charts.series.items.PieSeriesItem;
        import mx.charts.HitData;
         import custer.MyLabel;
         import mx.effects.easing.*;
                 import mx.controls.Alert;
        import mx.charts.series.LineSeries;
        import mx.charts.chartClasses.DataTransform; 
        import mx.charts.chartClasses.CartesianTransform;
        import mx.charts.series.items.LineSeriesItem;
              import mx.skins.halo.HaloFocusRect;
              import mx.charts.renderers.*;
import mx.effects.easing.Elastic;
            import mx.rpc.events.ResultEvent;
               private function linearAxis_labelFunc(item:Object, prevValue:Object, axis:IAxis):String { 
                return currFormatter.format(item); 
            }             
            
              var myURL:String="";             
              var parametersID:String="";   
              
           private function loadData():void  
          {   
               Button1.label = "ss外部传递的uid:"+mx.core.Application.application.parameters.Vid;

               myURL="XMLFile.xml";   
               Button1.label = "ss外部传递的uid:"+ this.parameters.Vid; 
               //myURL += "?Vid="+22;  
               
               var service:HTTPService = new HTTPService();
             service.url = "XMLFile.xml?Vid=" +  this.parameters.Vid; 
             service.useProxy = false;
             service.resultFormat="xml";
             service.addEventListener(ResultEvent.RESULT,resultUsers);
             service.send();

              // for(var k:int=0; k<31; k++)   
              // service.addItem(expensesAC[k]);   
            // this.myHTTPData.send();
        }   
        
         private function init(evt:Event):void {
             // Third series uses CrossItemRenderer.
       // series3.setStyle("itemRenderer", new ClassFactory(mx.charts.renderers.CircleItemRenderer));
              series3.setStyle("lineStroke", new Stroke(0x0000FF, 2, 0.4));
               series3.setStyle("fill", 0xFF0000);
              
              series3.setStyle("radius", 5);
               series3.setStyle("adjustedRadius", 2); 
              series3.setStyle("itemRenderer", new ClassFactory(ShadowBoxItemRenderer));
             
              
         parametersID=this.parameters.Vid;  
         myURL += "?Vid="+parametersID; 

        //Button1.label = "000外部传递的uid:"+ parametersID;
         
          Button1.label = "00000";
             //for(var k:int=0; k<31; k++)   
              // myHTTPData.(expensesAC[k]);   
        
               // var chart:CustomLineChart = evt.currentTarget as CustomLineChart;
                //seriesFilterArr = chart.seriesFilters;
                // var len:uint = linechart.seriesFilters.length;
                // if (len > 0) {
                //    linechart.seriesFilters = [];
               // } else {
                    linechart.seriesFilters = seriesFilterArr;
               // }
            } 
            function CustomLineChart_dataTipFunction(item:HitData):String { 
        var LCI:LineSeries = item.chartItem as LineSeries; 
        //return "<b>高度/时间</b><br />时间:" + LCI.item.time + "<br/>高度:"+LCI.item.height+"米";
      //  tit.label = "<b>高度/时间</b><br />时间我们的";
      
      //Button1.label = "外部传递的uid:" +this.parameters.Vid;
      //var lineSeries:LineSeries=LineSeries(hitData.chartItem.element);
    //var str:String="<b>" + lineSeries.displayName + "</b>\n";
     //var xml:XML=HitData..item as XML;
    //str+="日期:" + showTime(xml.time) + "\n";
     //str+="次数:" + xml.child(lineSeries.yField);

        
        var dt:String = "";
        var this_series:LineSeries = LineSeries(item.element);
        var dataTransform:DataTransform = this_series.dataTransform;
         var vertical_axis:LinearAxis = LinearAxis(dataTransform.getAxis(CartesianTransform.VERTICAL_AXIS));
         var horizontal_axis:CategoryAxis = CategoryAxis(dataTransform.getAxis(CartesianTransform.HORIZONTAL_AXIS));

         var actionItemID:String = this_series.xField;
          var xValue:Object = horizontal_axis.formatForScreen(LineSeriesItem(item.chartItem).xValue);
          var yValue:Object = vertical_axis.formatForScreen(LineSeriesItem(item.chartItem).yValue);
        var n:String = this_series.displayName;
        var xml:XML=item.chartItem as XML;
        
        var dds:String = item.chartItem.item["Dat"+actionItemID].toString();
        
        
        
       // var tDate:String = item.chartItem.item["content"+actionItemID].toString();
        if (n && n != "")
         dt += "<font size='14' COLOR='#FF0000'><b>" + n + "</b></FONT><BR/>------------------\n<font size='14' >价格:" + yValue  + "(元)<BR/>"  + "日期:" + xValue + " ** " + dds  ;
         
        
        return dt; 
    }  
    
    [Bindable]   
    private var showData:ArrayCollection = new ArrayCollection();//定义要显示的临时数据   
    
        [Bindable]
        private var expensesAC:ArrayCollection = new ArrayCollection( [
            { Month: "17", Profit: 2000, Expenses: 1500, Amount: 450 },
            { Month: "18", Profit: 800, Expenses: 200, Amount: 600 },
            { Month: "19", Profit: 1500, Expenses: 500, Amount: 300 },
            { Month: "20", Profit: 1800, Expenses: 1200, Amount: 900 },
            { Month: "21", Profit: 2400, Expenses: 575, Amount: 500 },
             { Month: "22", Profit: 720, Expenses: 575, Amount: 500 },
            { Month: "23", Profit: 1800, Expenses: 1200, Amount: 900 },
            { Month: "24", Profit: 2400, Expenses: 575, Amount: 500 },
             { Month: "25", Profit: 1400, Expenses: 575, Amount: 500 },
             { Month: "26", Profit: 2000, Expenses: 1500, Amount: 450 },
            { Month: "27", Profit: 1000, Expenses: 200, Amount: 600 },
            { Month: "28", Profit: 1500, Expenses: 500, Amount: 300 },
            { Month: "29", Profit: 1800, Expenses: 1200, Amount: 900 },
            { Month: "30", Profit: 2400, Expenses: 575, Amount: 500 },
             { Month: "31", Profit: 3400, Expenses: 575, Amount: 500 },
            { Month: "1", Profit: 1700, Expenses: 1200, Amount: 900 },
            { Month: "2", Profit: 2400, Expenses: 575, Amount: 500 },
             { Month: "3", Profit: 480, Expenses: 575, Amount: 500 },
             { Month: "4", Profit: 2400, Expenses: 575, Amount: 500 },
             { Month: "5", Profit: 1480, Expenses: 575, Amount: 500 },
             { Month: "6", Profit: 570, Expenses: 575, Amount: 500 },
             { Month: "7", Profit: 1970, Expenses: 575, Amount: 500 },
             { Month: "8", Profit: 1600, Expenses: 575, Amount: 500 },
             { Month: "9", Profit: 720, Expenses: 575, Amount: 500 },
             { Month: "10", Profit: 2100, Expenses: 575, Amount: 500 },
             { Month: "11", Profit: 780, Expenses: 575, Amount: 500 },
             { Month: "12", Profit: 1900, Expenses: 575, Amount: 500 },
             { Month: "13", Profit: 1480, Expenses: 575, Amount: 500 },
             { Month: "14", Profit: 1100, Expenses: 575, Amount: 500 },
             { Month: "15", Profit: 2480, Expenses: 575, Amount: 500 },
             { Month: "16", Profit: 700, Expenses: 575, Amount: 500 },            
              { Month: "17", Profit: 1400, Expenses: 575, Amount: 500 } ]);
       
        private function linechart_mouseMove(evt:MouseEvent):void {               
               // tit.label = evt.stageY.toString() + " - " + evt.localY+ " - " + this.mouseY;
               
            }  
                       
            [Bindable]
            private var guest:XML;

          private  function resultUsers(event:ResultEvent):void{//处理结果          
           
          guest = XML(event.result);
          linechart.dataProvider=guest.children();//XMLList
          
           
          }
           
        
]]>     
    
</mx:Script>
     
<mx:SeriesInterpolate id="interp"
        elementOffset
="1000"
        duration
="60000"
        minimumElementDuration
="1000"
        offset
="500"
     
/>
         
<mx:Sequence id="itemsChangeEffect1">
        
<mx:Blur blurYTo="12" blurXTo="12" duration="300" perElementOffset="150" filter="removeItem"/>

              
<!-- Define the effects -->
          
<mx:Parallel id="showEffects">
             
<mx:WipeRight duration="5000"/>
             
<mx:Pause duration="1000" />
                    
<mx:Blur startDelay="410" blurXFrom="18" blurYFrom="18" blurXTo="0" blurYTo="0" duration="300" filter="addItem"/>   
<mx:Dissolve id="dissolveIn" duration="1000" alphaFrom="2.0" alphaTo="3.0"/> 

 
<mx:Fade alphaFrom="10" alphaTo="10" duration="5000"/>
          
</mx:Parallel>
</mx:Sequence>

          
<mx:Parallel id="hideEffects">
             
<mx:Fade alphaFrom="1" alphaTo="0" duration="2500"/>
             
<mx:WipeLeft duration="3000"/>
                              
<mx:Blur startDelay="410" blurXFrom="18" blurYFrom="18" blurXTo="0" blurYTo="0" duration="300" filter="addItem"/>
          
</mx:Parallel>
     
<mx:CurrencyFormatter id="currFormatter" precision="0" />  
     
<mx:Stroke id = "s1" color="#2E95BF" weight="1"/> 
    
<mx:Stroke id = "s2" color="#62C426" weight="1"/> 
    
<mx:Stroke id = "s3" color="#FF8C31" weight="1.5"/> 
    
<mx:Stroke id="vSolid" weight=".002" color="#333333" alpha=".04" /> 
    
<mx:Stroke id="hSolid" weight=".03" color="#ff0000" alpha=".1" /> 
<mx:Stroke id="axisStroke2" color="#6B90DA" weight="2" alpha=".25" caps="square"/>
<mx:SolidColor id="vFill" color="#D6DECE" alpha=".3" /> 
<mx:SolidColor id="hFill" color="#F9E0E0" alpha=".03" />  
<mx:SolidColor id="tFill" color="#ffffff" alpha=".3" /> 
    
<mx:Array id="seriesFilterArr" />
      
       
<mx:HTTPService url="{myURL}" id="myHTTPData" method="GET" resultFormat="xml" result="resultUsers(event)">
  
<mx:request>
  
<Vid>{parametersID}</Vid>
</mx:request> 
</mx:HTTPService>
    
<mx:Panel id="pan" title="海口-重庆 航线订单趋势图" height="100%" width="100%" fontSize="14" fontWeight="normal">
         
<mx:Button id="Button1" width="558" color="#FA7A09" labelPlacement="left"/>
         
<comp:CustomLineChart id="linechart" height="100%" width="100%"
            paddingLeft
="5" paddingRight="5"  
            showDataTips
="true"    dataTipFunction="CustomLineChart_dataTipFunction"   mouseMove="" creationComplete="init(event);"  addedEffect="{itemsChangeEffect1}">

             
<comp:verticalAxis>  
            
<mx:LinearAxis baseAtZero="false" title="Price" labelFunction="linearAxis_labelFunc"   minimum="0"            
                
/>  
        
</comp:verticalAxis>    
            
<comp:horizontalAxis>           
                
<mx:CategoryAxis categoryField="Name" />
            
</comp:horizontalAxis>
            
<comp:horizontalAxisRenderer>
               
<mx:AxisRenderer canStagger="false" fontSize="10" >                       
                        
<mx:axisStroke>{axisStroke2}</mx:axisStroke>
        
</mx:AxisRenderer>
           
</comp:horizontalAxisRenderer>
           
<comp:verticalAxisRenderer>
                  
<mx:AxisRenderer >
            
<mx:axisStroke>{axisStroke2}</mx:axisStroke>
        
</mx:AxisRenderer>
                
</comp:verticalAxisRenderer>                
            
<comp:backgroundElements>  
            
<mx:GridLines id="GridLines1" focusBlendMode="HaloFocusRect"   focusThickness="12" direction="both" horizontalTickAligned="true" verticalTickAligned="true" 
            verticalStroke
="{hSolid}" horizontalStroke="{vSolid}" 
            verticalFill
="{vFill}" horizontalFill="{hFill}" 
            verticalAlternateFill
="{tFill}" horizontalAlternateFill="{tFill}" 
            mouseOver
="linechart_mouseMove(event);"    rollOver="true"  /> 
        
</comp:backgroundElements> 
            
<comp:series>
                
<mx:LineSeries id="series3" yField="ID" form="segment" displayName="票点明细:" itemRenderer="custer.MyLabel" lineStroke="{s3}" showDataEffect="showEffects"  >  
                 
<mx:showEffect> 
                 
<mx:Parallel id="sdddhowEffects">
             
<mx:WipeRight duration="5000"/>
             
<mx:Pause duration="1000" />
           
<mx:Dissolve id="dissfolveIn" duration="1000" alphaFrom="2.0" alphaTo="3.0"/> 
            
<mx:Blur startDelay="410" blurXFrom="18" blurYFrom="18" blurXTo="0" blurYTo="0" duration="300" filter="addItem"/>
 
<mx:Fade alphaFrom="10" alphaTo="10" duration="5000"/>
          
</mx:Parallel>
                
</mx:showEffect> 
                
<mx:stroke>
              
<mx:Stroke color="0xFF9900" weight="5"/> 
  
     
</mx:stroke>   
                
</mx:LineSeries>                  
            
</comp:series>
        
</comp:CustomLineChart>
                
    
</mx:Panel>

</mx:Application>
原文地址:https://www.cnblogs.com/Fooo/p/1587164.html