动态生成拓扑结构图问题？

Leoyang_FarAwayFrom 2010-04-12 02:52:11

加精

首先是从数据库取出来的xml格式的数据，根据这个数据自动生成拓扑结构图,不用每次手动去添加；并且随着xml文档的动态变化而变化... ...

在网上收了一下，有人推荐用：SpringGraph，不过，当我再去搜索这个是什么？他的用法时，却没有一个比较完整的介绍？如果有大侠路过此地，还请指点一下，就此谢过....

...全文

2438 77 打赏收藏转发到动态举报

写回复

用AI写文章

77 条回复

切换为时间正序

请发表友善的回复…

发表回复

dreaminglove 2012-03-28

打赏
举报

楼主做成功了没有，我也想是想拓扑图效果，你可以给我学习下嘛？

dreaminglove 2012-01-16

打赏
举报

谁有好的结构组织图的代码。net 发给我dreaminglove@qq.com

康少_小贱 2011-08-01

打赏
举报

对我很有用

yulang13 2010-08-27

打赏
举报

学习了

S_J_S 2010-07-18

打赏
举报

楼主不知道是什么应用，我做电信行业拓扑图方面twaver应该是最流行的拓扑组件，以下onlinedemo楼主可以参考参考

Silverlight的demo
http://www.servasoftware.com/demo/twaver_dotnet/twaversilverlightdemo.html

Flex的demo
http://servasoftware.com/demo/twaver_flex/demo.swf

Java的demo
http://download.servasoftware.com/twaver/demo/demo.html
http://download.servasoftware.com/twaver/demo/demo.jnlp

Leoyang_FarAwayFrom 2010-04-22

打赏
举报

最近有事忙，先结贴出成果来再贴出来

Leoyang_FarAwayFrom 2010-04-16

打赏
举报

[Quote=引用 69 楼 c3robot 的回复:]
自动生成拓扑结构图，好想法。
[/Quote]

谢谢纯属工作需要

c3robot 2010-04-16

打赏
举报

自动生成拓扑结构图，好想法。

dkgis 2010-04-15

打赏
举报

学习中

Leoyang_FarAwayFrom 2010-04-15

打赏
举报

补充xml文档：



<node id="1" name="海棠晓月总表" imgUrl="olt" level="0"  fatherNode="0" brotherCount="1" parentCount="0"/>

  

  <node id="2" name="观景楼总表" imgUrl="splitter" level="1" fatherNode="1" brotherCount="3" parentCount="1"/>

  <node id="3" name="听涛阁总表" imgUrl="splitter" level="1"   fatherNode="1" brotherCount="3" parentCount="1"/>

  <node id="4" name="颂梅苑总表" imgUrl="splitter" level="1"   fatherNode="1" brotherCount="3" parentCount="1"/>

  

  

  <node id="5" name="1层总表" imgUrl="onu" level="2"   fatherNode="2" brotherCount="4" parentCount="3"/>

  <node id="6" name="2层总表" imgUrl="onu" level="2"   fatherNode="2" brotherCount="4" parentCount="3"/>

  <node id="7" name="3层总表" imgUrl="onu" level="2"   fatherNode="2" brotherCount="4" parentCount="3"/>

  <node id="8" name="4层总表" imgUrl="onu" level="2"   fatherNode="2" brotherCount="4" parentCount="3"/>

  

  <node id="9" name="1-1表" imgUrl="other" level="3"   fatherNode="5" brotherCount="4" parentCount="4"/>

  <node id="10" name="1-2表" imgUrl="other" level="3"  fatherNode="5" brotherCount="4" parentCount="4"/>

  <node id="11" name="1-3表" imgUrl="other" level="3"  fatherNode="5" brotherCount="4" parentCount="4"/>

  <node id="12" name="1-4表" imgUrl="other" level="3"   fatherNode="5" brotherCount="4" parentCount="4"/>

  

  <node id="13" name="2-1表" imgUrl="other" level="3"   fatherNode="6" brotherCount="4" parentCount="4"/>

  <node id="14" name="2-2表" imgUrl="other" level="3"  fatherNode="6" brotherCount="4" parentCount="4"/>

  <node id="15" name="2-3表" imgUrl="other" level="3"  fatherNode="6" brotherCount="4" parentCount="4"/>

  <node id="16" name="2-4表" imgUrl="other" level="3"   fatherNode="6" brotherCount="4" parentCount="4"/>

  

  <node id="17" name="3-1表" imgUrl="other" level="3"   fatherNode="7" brotherCount="4" parentCount="4"/>

  <node id="18" name="3-2表" imgUrl="other" level="3"  fatherNode="7" brotherCount="4" parentCount="4"/>

  <node id="19" name="3-3表" imgUrl="other" level="3"  fatherNode="7" brotherCount="4" parentCount="4"/>

  <node id="20" name="3-4表" imgUrl="other" level="3"   fatherNode="7" brotherCount="4" parentCount="4"/>

  

  <node id="21" name="3-1表" imgUrl="other" level="3"   fatherNode="8" brotherCount="4" parentCount="4"/>

  <node id="22" name="3-2表" imgUrl="other" level="3"  fatherNode="8" brotherCount="4" parentCount="4"/>

  <node id="23" name="3-3表" imgUrl="other" level="3"  fatherNode="8" brotherCount="4" parentCount="4"/>

  <node id="24" name="3-4表" imgUrl="other" level="3"   fatherNode="8" brotherCount="4" parentCount="4"/>

Leoyang_FarAwayFrom 2010-04-15

打赏
举报

下面是我现在做出来的效果图和实现方法，但是在算法上，还要有待优化，还请高手提点一哈

class类里定义的变量：



                public static var w:Number;

		public static var h:Number;	

		public static var count1:int=0;

		public static var count2:int=0;

		public static var count3:int=0;

		public static var count4:int=0;

		public static var flag:int=0;

		public static var n:int=0;

		public static var fatherNodeID:Array=new Array();	

	        public static var fatherNode:Array=new Array();

实现部分：



/**

 * 从xml创建整个拓扑图 

 * @param xml

 * 

 */

public function createFromXML(xml:XML):void {

			for each(var nodeXML:XML in xml.node){

				createNode(nodeXML);

			}

                        createLine(lineXML);

    }

/**

 * 创建一个节点 

 * @param type

 * @return 

 * 

 */

public function createNode(data:Object,viewRenderer:UIComponent=null):INode{

			var node:INode=new Node();

			node.data=data;

			if(viewRenderer==null){

				node.viewRenderer=new ImageNodeRenderer();

			}else{

				node.viewRenderer=viewRenderer;

			}			

			

			(node.viewRenderer as Container).data=node;	//把每个节点都作为本容器的对象

			

			_nodeIdMap[node.id]=node;//把节点保存到节点集合中

			_nodeUIMap[node.viewRenderer]=node;		

			drawSpace.addChild(node.viewRenderer);//向容器里面加入节点对象子控件

			

			w=drawSpace.width;

			h=drawSpace.height;

			

			//确定节点在容器中显示的位置

			       

			   //对根结点的坐标位置  

			    if(int(data.@level)==0) { 

			          node.viewRenderer.x=w/5;

			          node.viewRenderer.y=h/2; 

			    }

			     

			    //对一级子项的布局 

                  else if(int(data.@level)==1){

                  	var j:int=int(data.@brotherCount);

                  	count1++;

                    for(var i:int=0;i<count1;i++){

                         node.viewRenderer.x=2*w/5;

			             node.viewRenderer.y=(i+1)*h/(j+1); 

                      }

                  }

                 //对二级子项的布局 

                  else if(int(data.@level)==2){

                  	var j1:int=int(data.@brotherCount);

                  	count2++;

                    for(var i1:int=0;i1<count2;i1++){

                         node.viewRenderer.x=3*w/5;

			             node.viewRenderer.y=(1+i1)*h/(j1+1);

                      }

                  }

                 //对三级子项的布局 

			      else if(int(data.@level)==3){

			      	fatherNode[0]=new int(0);

			      	var j2:int=int(data.@brotherCount);

			      	var FNodeCount:int=int(data.@parentCount);

			      	//记节点数

			      	fatherNodeID[count3]=int(data.@fatherNode);//取得第三级父节点并存入数组(全部父节点)

			      	

			      	//删除第三级父节点中重复的节点数，并放入fatherNode数组中

			      	for(var k:int=0;k<1;k++){

			      		for(var ii:int=0;ii<fatherNode.length;ii++){

			      		     if(fatherNodeID[count3].toString().match(fatherNode[ii].toString())){

			      		     	flag=1;

			      	            break;

			      	           }

			      	         else{

			      	         	flag=0;

			      	            continue;

			      	          }

			      		} 

			      		if(flag==0){

			      	          fatherNode[count4+1]=fatherNodeID[count3];

			      	          count4++; 

			      	         }

			      	}

			      	count3++;

			      	

			      	//实现第三级有同一个父节点的节点坐标的y坐标和上一级的y坐标一致，x坐标每次自增50

                    	for(var a:int=0;a<fatherNode.length;a++){

                    	     if(fatherNodeID[count3-1]==fatherNode[a]){

                    	           for(var m:int=0;m<1 && n<int(data.@brotherCount);m++){

                    	           

                    	               var j3:int=int(data.@parentCount);

                    	               var y1:int=a*h/(j3+1);

                    	               node.viewRenderer.x=4*w/5+n*50;

                    	               node.viewRenderer.y=y1;

                    	               n++;

                    	               if(n==int(data.@brotherCount))

                    	               {

                    	                n=0;

                    	               }

                    	              break;

                    	             } 

                    	     }

                    	}

                   }	

			  

			return node;

		}

zhushoudong 2010-04-15

打赏
举报

先学习了很有用自己也在研究flex

flyinwinds 2010-04-15

打赏
举报

顶顶啊

CCjian 2010-04-15

打赏
举报

太菜了,没看懂..

有没有效果图?

whbo0512 2010-04-14

打赏
举报

学习我也很想知道

Leoyang_FarAwayFrom 2010-04-14

打赏
举报

[Quote=引用 55 楼 leoyang_farawayfrom 的回复:]
求算法

节点对象在canvas上的显示布局问题，我准备先得到canvas的wigh、height，然后首先通过ObjFatherID父节点ID==0找到根节点，把他的位置用百分比设置比如说：

JScript code

w=drawSpace.width;
h=drawSpace.height;
if(int(data.@fatherNode)==0)
……
[/Quote]
我现在做出来的东西，每一级子项的节点坐标全部都在最后一次循环的坐标处，彼此覆盖

roanlo 2010-04-14

打赏
举报

完全看不懂，帮忙顶一下，最好有傻瓜式的东西，一看就能懂

renas01as01 2010-04-14

打赏
举报

dom模型应该可以解决这类问题

Leoyang_FarAwayFrom 2010-04-14

打赏
举报

求算法

节点对象在canvas上的显示布局问题，我准备先得到canvas的wigh、height，然后首先通过ObjFatherID父节点ID==0找到根节点，把他的位置用百分比设置比如说：



w=drawSpace.width;

h=drawSpace.height;

   if(int(data.@fatherNode)==0)

			      { 

			          node.viewRenderer.x=w/5;

			          node.viewRenderer.y=h/2; 

			     }

 //对一级子项的布局 

                  else if(int(data.@fatherNode)==1){

                  	var j:int=int(data.@SonCount);//还得考虑问题，如果他没有子节点

                    for(var i:int=1;i<=j;i++){

                         node.viewRenderer.x=2*w/5;

			             node.viewRenderer.y=i*h/j; 

			             return node;

			             continue;

                      }

                  }

else if(int(data.@fatherNode)==2){

                  	var j1:int=int(data.@SonCount);

                    for(var i1:int=1;i1<=j1;i1++){

                         node.viewRenderer.x=3*w/5;

			             node.viewRenderer.y=i1*h/j1;

			             return node;

			             continue; 

                      }

                  }

			      else{

			      	var j2:int=int(data.@SonCount);

                    for(var i2:int=1;i2<=j2;i2++){

			      	 node.viewRenderer.x=4*w/5;

			         node.viewRenderer.y=i2*h/j2; 

			          return node;

			             continue; 

                     }

}

但是此算法存在问题:就是每一级子项节点都重合在一个位置，求一个正确的算法？
我要实现的是：在每一级子项节点又通过其父节点的子项个数，用百分比确定每一个级子项的位置,可改动我的xml文档增加属性
谢谢

备注：xml文档改动

 <node id="1" name="海棠晓月" x="50" y="250" imgUrl="olt" fatherNode="0" SonCount="3" type="n1" states="normal"/>

cj413304161 2010-04-14

打赏
举报

大菜鸟，怎的话i

自动在mininet上部署生成一个包含两个三层树形节点与一个三角形节点结合而成的拓扑图，可更改参数形成更复杂的拓扑图

网络拓扑图动态线条实现

局域网拓扑图 net 可以扫描网络端口，查找网络中的主机

无线传感器网络实验五种网络拓扑结构的生成：总线型，星型，网状，树型，环型语言：MATLAB+Python

Flex

4,328

社区成员

9,091

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章