`
fokman
  • 浏览: 238797 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

flex server push 实现动态图表显示

    博客分类:
  • Flex
阅读更多

参考网上的资料实现重力传感器在图形上的显示,使用Blazeds 的server push机制实现功能。
1.java代码sensor的三个轴,x y z

public class Gsensor {
	
	private String month;
	private int xValue;
	private int yValue;
	private int zValue;
	
	public String getMonth() {
		return month;
	}
	public void setMonth(String month) {
		this.month = month;
	}
	public int getXValue() {
		return xValue;
	}
	public void setXValue(int value) {
		xValue = value;
	}
	public int getYValue() {
		return yValue;
	}
	public void setYValue(int value) {
		yValue = value;
	}
	public int getZValue() {
		return zValue;
	}
	public void setZValue(int value) {
		zValue = value;
	}

 2.开启线程每一秒中向客户端发送数据

public class GsensorChartPush implements Runnable {

	@Override
	public void run() {
		while(true){
			List<Gsensor> gsensor = getGsensor();	
			MessageFactory.sendMsg("gsensorpush",gsensor);
			try{
				Thread.sleep(1000);
			}catch(InterruptedException  se){
				se.printStackTrace();
			}
		}
	}

	private List<Gsensor> getGsensor() {
		List<Gsensor> gList = new ArrayList<Gsensor>();
		for(int i=0;i<5;i++){
			Random random = new Random();
			String month = i == 1 ? "January" : i == 2 ? "February" : i==3 ? "February":i==4 ? "April":i==5?"May":"June";  
			Gsensor gsensor = new Gsensor();
			gsensor.setMonth(month);
			gsensor.setXValue(random.nextInt(10));
			gsensor.setYValue(random.nextInt(20));
			gsensor.setZValue(random.nextInt(30));
			gList.add(gsensor);
		}
		return gList;
	}

 3.MessageFactory工厂实现消息的发送

 

public class MessageFactory {
	
	private static MessageBroker msgBroker = MessageBroker.getMessageBroker(null);
	private static String clientId = UUIDUtils.createUUID();
	
	public static void sendMsg(String destination,Object body){
		AsyncMessage msg = new AsyncMessage();
		msg.setDestination(destination);
		msg.setClientId(clientId);
		msg.setMessageId(UUIDUtils.createUUID());
		msg.setTimestamp(System.currentTimeMillis());
		msg.setBody(body);
		msgBroker.routeMessageToService(msg, null);
	}
}

 4.配置blazeds messing-config.xml

<destination id="gsensorpush">
        <properties>
            <server>
                <allow-subtopics>true</allow-subtopics>
                <subtopic-separator>.</subtopic-separator>
            </server>
        </properties>
        <channels>
			<channel ref="my-polling-amf"/>
        </channels>        
    </destination> 

 5.flex前端页面代码

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
	layout="absolute" creationComplete="init()">
	<mx:Script>
		<![CDATA[
			import mx.messaging.events.MessageFaultEvent;
			import mx.rpc.events.ResultEvent;
			import mx.messaging.events.MessageEvent;
            import mx.collections.ArrayCollection;
            import mx.controls.Alert;
            
 			private function init():void{
 				consumer.subscribe();
 			}
 			
 			private function messageHandler(event:MessageEvent):void{
 				lineChart.dataProvider = event.message.body;
 			}
 			
 			private function messageFault(event:MessageFaultEvent):void{
 				Alert.show("接收错误");	
 			}
 			
		]]>
	</mx:Script>
	<mx:Consumer id="consumer" destination="gsensorpush" message="messageHandler(event)" fault="messageFault(event)"/>
    <mx:SolidColor id="sc1" color="blue" alpha=".3"/>  
    <mx:SolidColor id="sc2" color="red" alpha=".3"/>  
    <mx:SolidColor id="sc3" color="green" alpha=".3"/>  
	
	<mx:Stroke id = "s1" color="blue" weight="2"/>  
    <mx:Stroke id = "s2" color="red" weight="2"/>  
    <mx:Stroke id = "s3" color="green" weight="2"/> 

	<mx:Panel title="DateTimeAxis Example" height="100%" width="100%">
        <mx:LineChart id="lineChart" height="100%" width="45%"
            paddingLeft="5" paddingRight="5" 
            showDataTips="true">
                
            <mx:horizontalAxis>
                <mx:DateTimeAxis dataUnits="seconds"/>
            </mx:horizontalAxis>

            <mx:series>
                <mx:LineSeries yField="XValue" form="curve" displayName="X" lineStroke="{s1}"/>
                <mx:LineSeries yField="YValue" form="curve" displayName="Y" lineStroke="{s2}"/>
                <mx:LineSeries yField="ZValue" form="curve" displayName="Z" lineStroke="{s3}"/>
            </mx:series>
        </mx:LineChart>
    </mx:Panel>
</mx:Application>
 

 

  • 大小: 21.4 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics