Linechart使用中的细节(1)

在项目中用了Flex,较多的使用了LineChart,遇到问题能查到文章真的很少,尤其是中文的,幸亏官方的文档写的“生动”,项目才算交差。

闲下来,想把一些细节写写,供大家查阅。讲的Linechart,其实所有的Chart控件都很相似,总是由两个轴(horizontalAxis and verticalAxis)和数值组成的。

1、关于创建日期型横轴的细节

较常见的一种形式是横轴是一段时间,纵轴是被描述的值。如果是在数据量和时间密度不大的情况下,没有必要把数据库中取出的时间串转化为日期型。但面对大跨度的时间,而其数值又分布密集,横轴标的日期显示起来就会小到看不清。这时最合理的解决方式可能是用DateTimeAxis中的dataUnits(时间显示单元,就是横轴上显示的最小时间间隔)。这要求首先LineChart的xField必须转化成日期型。Date对象是支持从日期样式的串构造的,但是有限的几种:

  • Day Month Date Hours:Minutes:Seconds GMT Year (for instance, "Tue Feb 1 00:00:00 GMT-0800 2005", which matches toString())
  • Day Month Date Year Hours:Minutes:Seconds AM/PM (for instance, "Tue Feb 1 2005 12:00:00 AM", which matches toLocaleString())
  • Day Month Date Year (for instance, "Tue Feb 1 2005", which matches toDateString())
  • Month/Day/Year (for instance, "02/01/2005")
  • Month/Year (for instance, "02/2005")

    郁闷的是SqlServer 2000支持的日期输出形式没有一个符合的,还好DateTimeAxis支持串到日期的转化:

    xml 代码
    1. <mx:horizontalAxis>  
    2.     <mx:DateTimeAxis id="dateAxis"  displayName="观测时间" parseFunction="{parseToDate}" title="观测时间"/>  
    3. mx:horizontalAxis>  
    as 代码
    1. private function parseToDate(s:String):Date{   
    2.                    //s = "2007-10-15 20:15"   
    3.     var temp:Array = s.split(" ");   
    4.      var datepart:String = temp[0];   
    5.      var datearray:Array = datepart.split("-");   
    6.      var timepart:String = temp[1];   
    7.       var timearray:Array = timepart.split(":");   
    8.       var newDate:Date = new Date(datearray[0],datearray[1],datearray[2],timearray[0],timearray[1]);   
    9.       return newDate;   
    10. }  

    这样根据时间跨度的大小,可以调整横轴时间最小时间间隔的大小。如果反映一年的数据,就可以将dataUnits设置为Months,如果反映一个月或几十天的数据就可以将dataUnits设置为days,以此类推。

    该发到哪里呢??找了所有分类都没有Flex,既然是RIA的技术就发到这里AJAX里好了。

  • 你可能感兴趣的:(xml,Ajax,Flex)