flex实现股票行情走势图

简介: 原文 http://blog.csdn.net/shenjiancomputer/article/details/8051873 第一步: jsp:1 [html] view plaincopyprint?           import flash.

原文 http://blog.csdn.net/shenjiancomputer/article/details/8051873

第一步:

jsp:1

  1. <%@page import="java.util.Random,java.util.GregorianCalendar"%>  
  2. <?xml version="1.0" encoding="utf-8"?>  
  3. <items>  
  4. <%  
  5.  GregorianCalendar calendar = new GregorianCalendar();  
  6.  int year = calendar.get(calendar.YEAR);  
  7.  int month = calendar.get(calendar.MONTH) + 1;  
  8.  int today = calendar.get(calendar.DAY_OF_MONTH);  
  9.  String strday=year+","+month+","+today+",";  
  10.  int sb = 400;  
  11.  String[] dates = new String[] {strday+"14,60"};  
  12.    
  13.  String crutime=request.getParameter("time");  
  14.  ///crutime=crutime.replace(":",",");  
  15.  if(crutime!=null){  
  16.  crutime=crutime.replace(":",",");  
  17.  dates = new String[] {strday+crutime};  
  18.    
  19.  }  
  20.  for (int i = 0; i < dates.length; i++) {  
  21.   Random random = new Random();  
  22.   int r = random.nextInt(1000);  
  23. %>  
  24. <item> <value>  
  25. <%  
  26.  if (i < 10) {  
  27. %><%=r%>  
  28. <%  
  29.  }  
  30. %>  
  31. </value> <date><%=dates[i]%></date> <sb><%=sb%></sb> </item>  
  32. <%  
  33.  }  
  34. %>  
  35. </items>  

 

jsp:2

  1. <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>  
  2. <%  
  3. String path = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath();  
  4. %>  
  5. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  6. <html>  
  7.   <head>  
  8.  <meta http-equiv="pragma" content="no-cache">  
  9.  <meta http-equiv="cache-control" content="no-cache">  
  10.  <meta http-equiv="expires" content="0">      
  11.  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  12.  <meta http-equiv="description" content="This is my page">  
  13.  <SCRIPT language="JScript.Encode" src="Js/SwfObject.js" type="text/javascript"></SCRIPT>  
  14.   </head>  
  15.   <body topmargin="0" leftmargin="0">  
  16.   <div align="center" style="margin-top: 40;">  
  17.     <div id="flashcontent" width="600"  height="400" align="center"  ></div>  
  18.   <script type="text/javascript">  
  19.      var so = new SWFObject("<%=path%>/testfrist.swf", "Main", "600", "400","9.0", "#ffffff", "high");  
  20.      so.addVariable("myAmfurl","<%=path%>/nxsy.jsp");  
  21.      so.addVariable("myAmtitle","牛熊双赢");  
  22.      so.write("flashcontent");  
  23.   </script>  
  24.  </div>  
  25.   </body>  
  26. </html>  

 



 

第二步flex代码:

  1. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100%" backgroundColor="white" creationComplete="init();">  
  2. <mx:Style>  
  3.     .font12{font-family:宋体;fontSize:15}   
  4.       
  5.  .lenchar{  
  6.    bar-color:red;  
  7.  }  
  8.       
  9. .mypanelTitle {  
  10.    color: #66ccff;  
  11.    fontFamily: Comic Sans MS;  
  12.    fontWeight: normal;  
  13.    textDecoration: underline;  
  14. }  
  15. </mx:Style>  
  16. <mx:Script><![CDATA[  
  17.  import flash.sampler.getMemberNames;  
  18.  import mx.charts.chartClasses.IAxis;  
  19.  import mx.charts.LinearAxis;  
  20.  import mx.charts.HitData;  
  21. import mx.collections.ArrayCollection;  
  22. import mx.rpc.events.ResultEvent;  
  23. import mx.controls.Alert;  
  24. import mx.charts.renderers.CircleItemRenderer;  
  25. import mx.graphics.Stroke;  
  26. import mx.controls.DateField;  
  27. [Bindable]  
  28. private var myAmfurl:String = ""; //用于连接到外部页面  
  29. [Bindable]  
  30. private var myAmtitle:String = ""; //用于连接到外部页面  
  31. [Bindable]  
  32. public var testDatas:ArrayCollection=new ArrayCollection();   
  33. [Bindable]  
  34. private var expenses:ArrayCollection = new ArrayCollection();   
  35. [Bindable]  
  36. private var arr:Array = new Array();  
  37. [Bindable]  
  38. private var mintime:Date;  
  39. [Bindable]  
  40. private var maxtime:Date;  
  41. [Bindable]  
  42. private var smintime:Date;  
  43. [Bindable]  
  44. private var emaxtime:Date;  
  45. private var timer:Timer;  
  46. private var stocksb:Number;  
  47. private var dateVar:Date;  
  48. private var d: Date = new Date();  
  49. private function init():void{   
  50.       
  51.    // setInterval(torequest,2000);  
  52. myAmfurl = Application.application.parameters.myAmfurl;       //风险追溯链接  
  53. myAmtitle=Application.application.parameters.myAmtitle;   
  54. timer = new Timer(1000);   
  55. timer.addEventListener(TimerEvent.TIMER, torequest)   
  56. timer.start();   
  57.      
  58. }  
  59. public function torequest(et:Event):void{    
  60.   setstyle();  
  61.         realtimeservice.send();   
  62. }  
  63. //用于设置样式  
  64. public function setstyle():void{  
  65.      
  66. }  
  67. private function formatDataTip(hitData:HitData):String  
  68.     {  
  69.     var s:String = hitData.item.date.toString();  
  70.     var a:Array = s.split(",");  
  71.     var str:String=a[3]+":"+a[4];  
  72.     str += "\n";  
  73.     str += hitData.item.value;  
  74.     return str;  
  75.     }  
  76. private function parseDate(value:String):Date{  
  77.       
  78.      var a:Array = value.split(",");  
  79.      var newDate:Date = new Date(a[0],a[1],a[2],a[3],a[4]);  
  80.        
  81.      return newDate;  
  82. }  
  83.    
  84. private function getResult(e:ResultEvent):void{   
  85.    var min:String="";  
  86.                   
  87.               var pattern:RegExp=/,/gi;  
  88.              for each (var resultXML:XML in e.result.item){  
  89.                 
  90.               var tmpobj:Object=new Object();  
  91.               tmpobj.value=resultXML.value;  
  92.               tmpobj.date=resultXML.date;  
  93.               tmpobj.sb=resultXML.sb;  
  94.               stocksb=Number(tmpobj.sb);  
  95.               var str=tmpobj.date;  
  96.               var a:Array = str.split(",");  
  97.      mintime= new Date(a[0],a[1],a[2],9,30);  
  98.      smintime= new Date(a[0],a[1],a[2],11,30);  
  99.      min=tmpobj.date;  
  100.      maxtime=new Date(a[0],a[1],a[2],15,00);  
  101.      emaxtime=new Date(a[0],a[1],a[2],13,00);   
  102.      if(expenses.length==0){  
  103.               expenses.addItem(tmpobj);  
  104.                }else{  
  105.               var check:int=0;  
  106.                if(expenses.length>0){  
  107.                  for each(var subtempobj:Object in expenses){  
  108.                   if(String(subtempobj.date).replace(pattern,"")==String(tmpobj.date).replace(pattern,"")){  
  109.                   check=1;  
  110.                   }  
  111.                  }  
  112.                }  
  113.                if(check==0){  
  114.                 expenses.addItem(tmpobj);  
  115.                 check=0;  
  116.                }  
  117.                }  
  118.                 
  119.                 
  120.              }  
  121.         var tmpobj1:Object=new Object();  
  122.          var tmpobj2:Object=new Object();  
  123.         var a:Array = min.split(",");  
  124.         tmpobj1.value=stocksb;  
  125.         tmpobj1.date=a[0]+","+a[1]+","+a[2]+","+"9,30";  
  126.         tmpobj2.value=stocksb;  
  127.         tmpobj2.date=a[0]+","+a[1]+","+a[2]+","+"15,00";  
  128.         testDatas.addItem(tmpobj1);  
  129.         testDatas.addItem(tmpobj2);  
  130. }   
  131. private function mylabel(labelValue:Object, previousValue:Object, d:IAxis):String  {    
  132.  var temp:String="";   
  133.  var currvalue:Number = Number(labelValue.toString());  
  134.  if(currvalue>stocksb){  
  135.    temp = '<font color="#ff0000" size="11">'+labelValue.toString()+'</font>';  
  136.   }else{  
  137.   temp = '<font color="#48ff00" size="11">'+labelValue.toString()+'</font>';  
  138.   }  
  139.  return temp;  
  140.   }   
  141.    
  142. ]]></mx:Script>  
  143.     <!-- Define custom Strokes. -->  
  144.     <mx:Stroke id = "s1" color="#FFFFFF" weight="0.1"/>  
  145.     <mx:Stroke id = "s2" color="#F1F1B8" weight="1"/>  
  146.     <mx:Stroke id = "s3" color="green" weight="1"/>  
  147.     <mx:Stroke id="vstroke" color="red" weight="1" alpha="0.6"/>  
  148.       
  149. <mx:HTTPService result="getResult(event);"  id="realtimeservice" url="{myAmfurl}" useProxy="false" resultFormat="e4x" method="POST">  
  150.         
  151. </mx:HTTPService>  
  152.    
  153. <mx:Panel title="{myAmtitle}"  fontSize="15" height="100%"  width="100%"  color="red" backgroundColor="#000000"  borderStyle="inset">  
  154.    
  155.         
  156. <mx:LineChart styleName="lenchar"  dataTipFunction="formatDataTip" showDataTips="true" height="100%"  width="100%" id="chart" fontFamily=" 宋体" fontSize="12">  
  157. <mx:backgroundElements>  
  158.    <mx:GridLines direction="both">  
  159.     <mx:horizontalStroke>  
  160.                 <mx:Stroke color="red" weight="1" alpha="0.6"/>  
  161.             </mx:horizontalStroke>  
  162.             <mx:verticalStroke>  
  163.                 <mx:Stroke color="red" weight="1" alpha="0.2"/>  
  164.             </mx:verticalStroke>  
  165.    </mx:GridLines>  
  166. </mx:backgroundElements >  
  167.  <!-- vertical axis -->  
  168.   <mx:verticalAxis>  
  169.    <mx:LinearAxis id="va" baseAtZero="false"  title="" labelFunction="mylabel"/>  
  170.   </mx:verticalAxis>     
  171. <mx:horizontalAxis>   
  172. <!--mx:CategoryAxis  id="ca"  categoryField="date" displayName="date" title="date" /-->  
  173. <!--mx:LinearAxis displayName="date" minimum="1" id="ca"  interval="10"/ -->  
  174.  <!--<mx:DateTimeAxis  dataUnits="seconds" interval="30" minimum="{minDate}" maximum="{maxDate}"/>-->  
  175.    
  176. <!--<mx:DateTimeAxis id="hAxis" parseFunction="parseDate" interval="1" minimum="{mintime}" maximum="{maxtime}" displayLocalTime="true" dataInterval="1" dataUnits="hours"  labelUnits="hours" />-->  
  177. <mx:DateTimeAxis id="hAxis"   
  178.  disabledDays="{[0,6]}"  
  179.  disabledRanges="{[{rangeStart:smintime, rangeEnd:emaxtime}]}"  
  180.  parseFunction="parseDate" interval="1" minimum="{mintime}" maximum="{maxtime}" displayLocalTime="true" dataInterval="30" dataUnits="minutes"  labelUnits="minutes"  
  181.    
  182.   />  
  183. </mx:horizontalAxis>   
  184. <!-- horizontal axis renderer -->  
  185.   <mx:horizontalAxisRenderers>  
  186.    <mx:AxisRenderer axis="{hAxis}" canDropLabels="true" axisStroke="{vstroke}" />  
  187.   </mx:horizontalAxisRenderers>  
  188.     
  189. <mx:verticalAxisRenderers>  
  190.  <mx:AxisRenderer axis="{va}" canDropLabels="true" axisStroke="{vstroke}" />  
  191. </mx:verticalAxisRenderers>  
  192.    
  193.  <!-- series -->  
  194. <mx:series>   
  195. <mx:LineSeries id="series" yField="value"  xField="date" displayName="value" dataProvider="{this.expenses}" lineStroke="{s1}" />  
  196. <mx:LineSeries yField="value" xField="date" displayName="TestData" dataProvider="{this.testDatas}" lineStroke="{s2}" />  
  197. </mx:series>   
  198. </mx:LineChart>  
  199.   
  200. </mx:Panel>  
  201.    
  202. </mx:Application>   

 

目录
相关文章
|
6月前
|
搜索推荐
什么是 Pledge to Flex
什么是 Pledge to Flex
34 0
|
8月前
|
JavaScript 容器
什么是Flex
1:屏幕和浏览器窗口大小发生改变也可以灵活调整布局; 2:可以指定伸缩项目沿着主轴或侧轴按比例分配额外空间(伸缩容器额外空间),从而调整伸缩项目的大小; 3:可以指定伸缩项目沿着主轴或侧轴将伸缩容器额外空间,分配到伸缩项目之前、之后或之间; 4:可以指定如何将垂直于元素布局轴的额外空间分布到该元素的周围; 5:可以控制元素在页面上的布局方向; 6:可以按照不同于文档对象模型(DOM)所指定排序方式对屏幕上的元素重新排序。也就是说可以在浏览器渲染中不按照文档流先后顺序重排伸缩项目顺序。
91 0
|
前端开发 容器
flex从总结到了解
flex 是一种布局方式,在 CSS3 之后开始有。它主要由父容器和子项组成
159 1
flex从总结到了解
flex水平垂直居中
我是通过flex的水平垂直居中噢! html,body{ width: 100%; height: 200px; } .parent { display:flex; align-items: center;/*垂直居中*/ justify-...
1074 0
|
XML Java 数据格式
Flex 4 advancedDataGrid的使用
参考 http://www.cnblogs.com/xuehai/archive/2009/09/26/1574531.html                                                                                     ...
1397 0
Flex学习笔记(Day 1)
StringValidator 字符串验证 PhoneNumberValidator 电话号码验证 DateValidator 日期验证 EmailValidator 邮箱验证 NumberValidator 数字验证 Alert 引入命名空间 import mx.
839 0