用PHP和mxml 实现FLASH 曲线图

MXML是一个可以让你在Adobe Flex中布局用户界面组件的一种XML语言。你也可以使用MXML声明来定义程序中的非可视化组件。安装好FLEX Development 后,你就可以轻松的结合PHP完成一个FLASH曲线图。
先从PHP入手:
FLEX 和PHP的交互最常用的就是
和XML的交互,就是用PHP生成XML,然后用FLEX去读取并且显示。
我们以XML的形式先写一个帐目详单的数据。
 
代码:
header("Content-Type: text/xml");
$arr = array(
                            array('day'=>'01','sum'=>'153.1'),
                            array('day'=>'02','sum'=>'882.86'),
                            array('day'=>'03','sum'=>'456.9'),
                            array('day'=>'04','sum'=>'717.7'),
                            array('day'=>'05','sum'=>'255.1'),
                            array('day'=>'06','sum'=>'533.1')
);
$xml_return  .= "<bills>";
foreach ( $arr as $use){
       $xml_return .="<bill><sum>{$use['sum']}</sum><name>{$use['day']}</name></bill> ";
}
$xml_return.= "</bills>";
echo $xml_return;
显示6个月的消费记录,$arr也可以是从数据库读出来的数据,这里只是作为一个例子,所以直接给一个数组赋值。
- <bills>
- <bill>
<sum>153.1</sum>
<name>01</name>
</bill>

- <bill>
<sum>882.86</sum>
<name>02</name>
</bill>

- <bill>
<sum>456.9</sum>
<name>03</name>
</bill>

- <bill>
<sum>717.7</sum>
<name>04</name>
</bill>

- <bill>
<sum>255.1</sum>
<name>05</name>
</bill>

- <bill>
<sum>533.1</sum>
<name>06</name>
</bill>

</bills>
 

Php部分就完成了 接下来是写MXML:
 
代码:
<?xml version="1.0" encoding="utf-8"?>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"  creationComplete="getaccount()">
   <mx:HTTPService id="listRequest" url="" useProxy="false" method="POST">
   <mx:request xmlns=""> </mx:request>
   </mx:HTTPService>
  
   <mx:Script><![CDATA[
    import mx.rpc.events.ResultEvent;//引用ResultEvent类
    public function getaccount():void{
  listRequest.url='http://localhost/arr.php';
     listRequest.send();
}
  ]]></mx:Script>
   <mx:LineChart showDataTips="true" clipContent="false" x="126" y="10" id="tongjitu"  dataProvider="{listRequest.lastResult.bills.bill}" width="678">
   <mx:horizontalAxis>     
    <mx:CategoryAxis dataProvider="{listRequest.lastResult.bills.bill}"  categoryField="name" title="(日)" />
   </mx:horizontalAxis> 
      <mx:series>
         <mx:LineSeries displayName="每日消费" yField="sum" xField="name"/>
    </mx:series>
   </mx:LineChart>
</mx:Application>
逐一解释一下
 
代码:
Application //MXML应用程序开头

 
代码:
creationComplete="getaccount()" //代表页面加载完成后 执行 getaccount函数

 
代码:
〈mx:HTTPService id="listRequest" url="" useProxy="false" method="POST"〉
   〈mx:request xmlns=""〉 〈/mx:request〉
   〈/mx:HTTPService〉
//则是一个HTTP的请求,发送POST到一个PHP文件 去获取数据

 
代码:
mx:Script //MXML里面的脚本 都用 <mx:Script>包含进去

下面分析下getaccount函数:
 
代码:
public function getaccount():void{
       listRequest.url='http://localhost/arr.php';
        listRequest.send();
    }
//列出了 HTTPService 请求地址是  http://localhost/arr.php
//你同样也可以写成相对路径 比如 listRequest.url='./arr.php';

 
代码:
mx:LineChart  //是一个 曲线 组件,我们可以直接拿来使用

 
代码:
dataProvider :数据源:listRequest.lastResult.bills.bill
       bills.bill 是XML里面的标签

 
代码:
  mx:LineSeries displayName="每日消费" yField="sum" xField="name" 
//则定义了 横纵坐标的值。   
//Sum  name  就是XML里面的数据的标签

时间: 2024-08-18 05:33:53

用PHP和mxml 实现FLASH 曲线图的相关文章

flash chart曲线图问题

问题描述 flash chart曲线图问题 小弟诚心,在线等待 flash chart 高手解决问题.详细情况继续沟通.希望共同学习,共同进步.急!急!急!

flash MXML标签添加的侦听

在flex中我们可以很方便的在mxml标签中使用事件名="函数名()"来给对象添加侦听.. 像click="goUrl()" 可是当我们不需要该侦听的时候.. 如果想使用 id.removeEventListener("click",goUrl)来删除侦听. 却发现怎么也remove不成功.. 原来使用该方法给对象添加侦听时.. flex并不是直接使用我们指定的函数(goUrl), 而是先动态生成一个函数. 然后再使用该函数调用我们指定的函数..

flash/flex 之 自定义MXML组件

1. 新建 mxml组件 代码如下 <?xml version="1.0" encoding="utf-8"?><s:Group xmlns:fx="http://ns.adobe.com/mxml/2009"          xmlns:s="library://ns.adobe.com/flex/spark"          xmlns:mx="library://ns.adobe.com/

Flash饼状图,柱状图,k线图等动态图表解决资源大全

k线图|饼状图|动态|解决|图表|柱状图 FLASH 3D饼状图,2D饼状图,3D柱状图,2D柱状图,交易K线图,走势图,曲线图.... 各类FLASH+XML图表应用资源,数据直观统计应用的必备工具.... 收集详尽的FLASH商业图表的解决方案.汇总在这里,点击打开下面的网站下载资源. AnyChart Flash Chart Component Aurigma FlashChart B-Line Charting Component Corda's PopChart FusionChart

Flash ActionScript 3.0系列教程

教程 作者的blog: www.kingda.org ActionScript 3.0系列教程(1):与Flash9先来一次亲密接触! Flash Professional 9 ActionScript 3.0 Preview 版本今天发布了,意味着从此我们从此不仅仅只能使用Flex 2来使用AS3.0,更可以使用我们一直很熟悉的Flash IDE来进行AS3.0开发了. 与Flex 2不同,Flash 9 alpha(即上面的Flash Professional 9 ActionScript

积少成多Flash(10)

积少成多Flash(10) - Flex 3.0 状态转换(State), 状态转换的过渡效果(State Transition), 自定义鼠标指针 介绍 演示 Flex 3.0 中的转换状态及转换状态中的过度效果,自定义鼠标指针 状态转换(State) - 对 UI 状态,以某一种编程模型做转换 状态转换的过渡效果(State Transition) - 设置 UI 状态的转换过程中的过 渡效果 自定义鼠标指针 - 对鼠标指针的样式做自定义设置 在线DEMO http://www.cnblog

积少成多Flash(9)

介绍 演示 Flex 3.0 中的布局控件的应用,样式和皮肤的应用 布局控件 - Flex 中常用的布局控件一览 样式 - 通过 css 控制 Flex 中各个控件的样 式 皮肤 - 使用 Flash 开发的 swf 做控件的皮肤 在线DEMO http://www.cnblogs.com/webabcd/archive/2009/11/09/1598980.html 1.布局控件一览 Layout.mxml <?xml version="1.0" encoding="

flash flex里播放声音的方法

flasf cs3 里的liberty 有声音 可以是 mp3  wav 等,右键选 linkage 填入类名(我这里填BTNsound),然后将它拖到场景中,发布出来(我的命名是sound.swf),放到工程src文件夹里.在flex里新建一个 类(我的Loadsound.as)代码如下:  package {  public class Loadsound  {   [Embed(source="Sound.swf",symbol="BTNsound")]//按

Flex/AS3/flash player支持屏蔽右键菜单,自定义菜单,并设置相应的菜单事件(示例,图解)

Flex/AS3/flash player支持屏蔽右键菜单,自定义菜单,并设置相应的菜单事件(示例,图解) 播放器 版本 11.2以后支持右键菜单屏蔽及自定义菜单 1.更新播放器 ,11.2 以上版本 http://download.macromedia.com/get/flashplayer/updaters/11/playerglobal11_3.swc http://download.macromedia.com/get/flashplayer/updaters/11/playerglob