<?xml version="1.0"?>
<!-- Simple example to demonstrate the ColumnChart and BarChart controls. -->
<s:Application xmlns:fx=" http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" >
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Style source="Dom.css"/>
<fx:Script>
<![CDATA[
protected function sendMessage(event:MouseEvent):void
{
var val:Object= new Object();
val.sets = cbb.selectedItem.label;
val.time = df.selectedDate.getTime();
service.send(val);
}
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.CalendarLayoutChangeEvent;
import mx.events.DropdownEvent;
[Bindable]
public var cards:ArrayCollection = new ArrayCollection(
[ {label:"QQ", data:1},
{label:"土豆视频", data:2},
{label:"新闻", data:3},
{label:"CCTV1", data:4},
{label:"微博", data:5}]);
[Bindable]
private var date1:ArrayCollection = new ArrayCollection( [
{ message: "QQ", Gold: 35, Silver:39, Bronze: 29 },
{ message: "土豆视频", Gold: 32, Silver:17, Bronze: 14 },
{ message: "新闻", Gold: 27, Silver:27, Bronze: 38 },
{ message: "CCTV1", Gold: 27, Silver:27, Bronze: 38 },
{ message: "微博", Gold: 27, Silver:27, Bronze: 38 }]);
]]>
</fx:Script>
<fx:Declarations>
<!-- 定义数据表静态数据-->
<!--
-->
<!--远程数据连接,可以进行数据提交和数据查询获取-->
<mx:HTTPService
id="service"
url="../config.xml"
useProxy="false"
fault =""
result ="">
</mx:HTTPService>
</fx:Declarations>
<s:Panel x="10" y="25" width="100%" height="100%">
<!--label应用名称标签-->
<s:Label x="150" y="50" text="应用名称" width="92" height="30" fontSize="20" color="#0B0B0B" fontFamily="中易宋体"/>
<!--下拉菜单-->
<s:ComboBox width="150" id="cbb" x="246" y="50" height="30" dataProvider="{cards}"/>
<!--label时间标签-->
<s:Label x="620" y="50" text="时间" height="30" width="50" fontSize="20" color="#050505" fontFamily="中易宋体" fontWeight="bold"/>
<!--时间选择表单-->
<mx:DateField id="df" x="680" y="50" height="30"/>
<!--button查询按钮-->
<s:Button x="800" y="50" label="查询" height="30" color="#772E2E" click="sendMessage(event)"/>
<!--二维数据表格-->
<mx:DataGrid x="580" y="200" height="267" id="dg" width="325" dataProvider="{service.lastResult.message}">
<mx:columns>
<mx:DataGridColumn headerText="应用名称" dataField="name"/>
<mx:DataGridColumn headerText="总流量" dataField="phone"/>
<mx:DataGridColumn headerText="总访问次数" dataField="countnum"/>
</mx:columns>
</mx:DataGrid>
<!-- 柱状数据显示-->
<mx:ColumnChart x="150" y="200" id="columnchart1" width="350" height="267">
<!--X轴标识名-->
<mx:horizontalAxis>
<mx:CategoryAxis dataProvider="{date1}" categoryField="message"/>
</mx:horizontalAxis>
<!--柱状图数据-->
<mx:series>
<mx:ColumnSeries displayName="Series 1" dataProvider="{date1}" xField="message" yField="查询数据" />
</mx:series>
<!--X/Y轴横纵标识数据-->
<mx:verticalAxis>
<mx:LinearAxis minimum="4000.00" maximum="5000.00"/>
</mx:verticalAxis>
<mx:secondVerticalAxis>
<mx:LinearAxis minimum="110" maximum="170"/>
</mx:secondVerticalAxis>
<!--折线数据展示-->
<mx:secondSeries>
<mx:LineSeries id="ls" displayName="Series 2" dataProvider="{date1}" yField=""/>
</mx:secondSeries>
</mx:ColumnChart>
<mx:Legend dataProvider="{columnchart1}" x="485" y="127" height="60" width="88"/>
</s:Panel>
</s:Application>
<!-- Simple example to demonstrate the ColumnChart and BarChart controls. -->
<s:Application xmlns:fx=" http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" >
<s:layout>
<s:VerticalLayout/>
</s:layout>
<fx:Style source="Dom.css"/>
<fx:Script>
<![CDATA[
protected function sendMessage(event:MouseEvent):void
{
var val:Object= new Object();
val.sets = cbb.selectedItem.label;
val.time = df.selectedDate.getTime();
service.send(val);
}
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.CalendarLayoutChangeEvent;
import mx.events.DropdownEvent;
[Bindable]
public var cards:ArrayCollection = new ArrayCollection(
[ {label:"QQ", data:1},
{label:"土豆视频", data:2},
{label:"新闻", data:3},
{label:"CCTV1", data:4},
{label:"微博", data:5}]);
[Bindable]
private var date1:ArrayCollection = new ArrayCollection( [
{ message: "QQ", Gold: 35, Silver:39, Bronze: 29 },
{ message: "土豆视频", Gold: 32, Silver:17, Bronze: 14 },
{ message: "新闻", Gold: 27, Silver:27, Bronze: 38 },
{ message: "CCTV1", Gold: 27, Silver:27, Bronze: 38 },
{ message: "微博", Gold: 27, Silver:27, Bronze: 38 }]);
]]>
</fx:Script>
<fx:Declarations>
<!-- 定义数据表静态数据-->
<!--
-->
<!--远程数据连接,可以进行数据提交和数据查询获取-->
<mx:HTTPService
id="service"
url="../config.xml"
useProxy="false"
fault =""
result ="">
</mx:HTTPService>
</fx:Declarations>
<s:Panel x="10" y="25" width="100%" height="100%">
<!--label应用名称标签-->
<s:Label x="150" y="50" text="应用名称" width="92" height="30" fontSize="20" color="#0B0B0B" fontFamily="中易宋体"/>
<!--下拉菜单-->
<s:ComboBox width="150" id="cbb" x="246" y="50" height="30" dataProvider="{cards}"/>
<!--label时间标签-->
<s:Label x="620" y="50" text="时间" height="30" width="50" fontSize="20" color="#050505" fontFamily="中易宋体" fontWeight="bold"/>
<!--时间选择表单-->
<mx:DateField id="df" x="680" y="50" height="30"/>
<!--button查询按钮-->
<s:Button x="800" y="50" label="查询" height="30" color="#772E2E" click="sendMessage(event)"/>
<!--二维数据表格-->
<mx:DataGrid x="580" y="200" height="267" id="dg" width="325" dataProvider="{service.lastResult.message}">
<mx:columns>
<mx:DataGridColumn headerText="应用名称" dataField="name"/>
<mx:DataGridColumn headerText="总流量" dataField="phone"/>
<mx:DataGridColumn headerText="总访问次数" dataField="countnum"/>
</mx:columns>
</mx:DataGrid>
<!-- 柱状数据显示-->
<mx:ColumnChart x="150" y="200" id="columnchart1" width="350" height="267">
<!--X轴标识名-->
<mx:horizontalAxis>
<mx:CategoryAxis dataProvider="{date1}" categoryField="message"/>
</mx:horizontalAxis>
<!--柱状图数据-->
<mx:series>
<mx:ColumnSeries displayName="Series 1" dataProvider="{date1}" xField="message" yField="查询数据" />
</mx:series>
<!--X/Y轴横纵标识数据-->
<mx:verticalAxis>
<mx:LinearAxis minimum="4000.00" maximum="5000.00"/>
</mx:verticalAxis>
<mx:secondVerticalAxis>
<mx:LinearAxis minimum="110" maximum="170"/>
</mx:secondVerticalAxis>
<!--折线数据展示-->
<mx:secondSeries>
<mx:LineSeries id="ls" displayName="Series 2" dataProvider="{date1}" yField=""/>
</mx:secondSeries>
</mx:ColumnChart>
<mx:Legend dataProvider="{columnchart1}" x="485" y="127" height="60" width="88"/>
</s:Panel>
</s:Application>