用Flex实现股票历史图标

      由于公司的决策，要把上一版基于C/S架构的股票分析软件，改变为B/S架构，以前的股票数据图都是用Java Graphics2D绘制出来的，到了B/S上以前的绘制部分的程序都要重新来过，苦啊！！于是决定研究一下 Adobe的Flex，初步验证，是个值得一学的好东东。下面先来和大家分享一下我的小实验程序：

来个效果图：

还不错吧？ 源码：

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="800" height="600">
<mx:Script>
  <![CDATA[
     import mx.collections.ArrayCollection;
     import flash.events.MouseEvent;
    
     private var date=28;
     [Bindable]
     public var TICKER:ArrayCollection = new ArrayCollection([
        {Date:"5月1日",开盘价:42.57,high:43.08,low:42.08,close:42.75},
        {Date:"5月2日",开盘价:42.89,high:43.5,low:42.61,close:43.19},
        {Date:"5月3日",开盘价:43.19,high:43.31,low:42.77,close:43.22},
        {Date:"5月4日",开盘价:42.89,high:43,low:42.29,close:42.71},
        {Date:"5月5日",开盘价:42.49,high:43.36,low:42.02,close:42.99},
        {Date:"5月6日",开盘价:43,high:43.25,low:42.61,close:42.65},
        {Date:"5月7日",开盘价:42.93,high:43.89,low:42.91,close:43.82},
        {Date:"5月8日",开盘价:44,high:44.39,low:43.31,close:43.38},
        {Date:"5月9日",开盘价:43.39,high:44.12,low:43.25,close:44},
        {Date:"5月10日",开盘价:43.46,high:46.22,low:43.36,close:46.1}
     ]);
    
     private function clickHandler ( event:MouseEvent ):void
     {
     if(date<=30){
   date=date+1;
     }
     else{
      date=1;
     }
      TICKER.addItem({Date:"5月"+date+"日",开盘价:48,high:49,low:45.08,close:46.75});
     }
      ]]>
 </mx:Script>
      
  <mx:Panel title="股票蜡烛图" width="100%" height="528" layout="absolute" fontFamily="Arial" fontSize="10">
    <mx:CandlestickChart id="myCandles" height="90%" width="99%" paddingRight="5" paddingLeft="5" paddingBottom="10" dataProvider="{TICKER}" showDataTips="true" x="0" y="0">
           <mx:verticalAxis>
               <mx:LinearAxis baseAtZero="false" />
           </mx:verticalAxis>

           <mx:horizontalAxis>
               <mx:CategoryAxis categoryField="Date" title="日期"/>
           </mx:horizontalAxis>

           <mx:horizontalAxisRenderer>
               <mx:AxisRenderer canDropLabels="true"/>
           </mx:horizontalAxisRenderer>

    <mx:series>
      <mx:CandlestickSeries openField="开盘价" highField="high"
                    lowField="low" closeField="close"/>
    </mx:series>
    </mx:CandlestickChart>
    <mx:Button x="614" y="447" label="增加数据" width="100" height="31" id="myBtn" fontSize="12" click="clickHandler(event)"/>
  </mx:Panel>
</mx:Application>