最简单的flex网络拓扑图开发（二）从xml生成topo图

? ? 在文章http://www.voidcn.com/article/p-gshayhlq-bmh.html我们已经介绍了最简单的拓扑图构建，但是该拓扑图是死的，而不是可以根据后台的数据的改变而改变。

? ? 这篇文章主要是介绍怎么把拓扑图和后台数据实时互动起来。

? ? 首先我们还是加载swc：

? ??http://ken-javaframeword.googlecode.com/files/framework2.0_2.swc

样本的xml

<?xml version="1.0" encoding="UTF-8"?>
<BusinessView saveUrl="/GraphicalView.do?method=saveMap&mapId=2">
	<Nodes>
		<Node image="image/unknow.gif" y="37" id="1" label="名称:MyBizView"
			 x="359" url="www.hao123.com" width="32" height="32" />
		<Node image="image/unknow.gif" y="177" id="2" label="测试"
			 x="634" url="www.hao123.com" width="32" height="32" />
	</Nodes>
	<Lines>
		<Line end="2" color="0xd9D6C3" start="1" />
	</Lines>
</BusinessView>

<?xml version="1.0" encoding="utf-8"?>
<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" minWidth="955" minHeight="600" xmlns:topo="com.shine.topo.view.topo.*">
	<s:layout>
		<s:BasicLayout/>
	</s:layout>
	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import com.shine.framework.core.model.BaseXmlModel;
			import com.shine.framework.core.util.ArrayMap;
			import com.shine.framework.core.util.BaseHttpServiceUtil;
			import com.shine.framework.core.util.XMLArrayCollection;
			import com.shine.topo.view.Line.TopoLine;
			import com.shine.topo.view.node.BaseNodeContainer;
			
			private var resultXmlModelArrayCollertion:XMLArrayCollection=null;
			private var lineXmlModelArrayCollection:XMLArrayCollection=null;
			private var nodeMap:ArrayMap=null;
			
			private function complete():void{
				container.completeLoading();
				
				//远程加载xml
				var httpUtil:BaseHttpServiceUtil=new BaseHttpServiceUtil;
				httpUtil.getResultXml("xml/example.xml",xmlResult);
			}
			
			private function xmlResult(xml:String):void{
				nodeMap=new ArrayMap;
				
				//解析所有的Node节点
				resultXmlModelArrayCollertion=new XMLArrayCollection;
				resultXmlModelArrayCollertion.saxXmlNodeByTag(XML(xml),["Node"]);
				
				for each(var baseXmlModel:BaseXmlModel in resultXmlModelArrayCollertion){
					var node:BaseNodeContainer=new BaseNodeContainer;
					node.initNode(baseXmlModel);
					container.addTopoNode(node);
					nodeMap.put(baseXmlModel.getString("id"),node);
				}
				
				lineXmlModelArrayCollection=new XMLArrayCollection;
				lineXmlModelArrayCollection.saxXmlNodeByTag(XML(xml),["Line"]);
				
				for each(var baseXmlModel:BaseXmlModel in lineXmlModelArrayCollection){
					var  line:TopoLine=new TopoLine();
					line .initTopoLine(baseXmlModel,BaseNodeContainer(nodeMap.get(baseXmlModel.getString("start"))),BaseNodeContainer(nodeMap.get(baseXmlModel.getString("end"))));
					container.addTopoLine(line);
				}
			}
		]]>
	</fx:Script>
	<topo:BaseTopoContainer id="container" width="100%" height="100%" creationComplete="{complete()}" />
</s:Application>

? ? 具体xml解析算法请参考：

http://www.voidcn.com/article/p-cvduaqlx-bmh.html