flex 之twaver1--简单网络拓扑实现

注:原创作品,分享以供学习交流,转载请注明出处。


twaver简介:
twaver是flex的一个实现网络拓扑的包,相当与java中第三方的jar包。在项目中如要使用twaver则需引入Twaver.swc包。

下面实例实现效果:
拓扑图中有五个节点,分别是:中国,北京、上海、广州、深圳。 从中国这个节点发散四条线连接到北京,上海,广州,深圳四个城市。下面是实例:

<?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:tw="http://www.servasoftware.com/2009/twaver/flex"
applicationComplete="init()"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import flash.geom.Point;

import twaver.*;
import twaver.network.Network;

private function init():void
{
//获取网络topo的数据模型
//netWork是网络拓扑的容器,这个容器中盛放 节点(node),连线(Link)
var box:ElementBox = netWork.elementBox;

//定义第一个节点“中国”,并加入到网络拓扑的数据模型中
var zhongguo:Node = new Node();
zhongguo.name = "中国";
zhongguo.location = new Point(20,100);
box.add(zhongguo);

//定义第二个节点:“北京”,并敬爱如到网络拓扑的数据模型中
var beijing:Node = new Node();
beijing.name = "北京";
beijing.location = new Point(160,0);
box.add(beijing);


//定义第三个节点:“上海”,并加入到网络拓扑的数据模型中
var shanghai:Node = new Node();
shanghai.name = "上海";
shanghai.location = new Point(160,50);
box.add(shanghai);

//定义第四个节点:“上海”,并加入到网络拓扑的数据模型中
var guangzhou:Node = new Node();
guangzhou.name = "广州";
guangzhou.location = new Point(160,150);
box.add(guangzhou);

//定义第五个节点:“上海”,并加入到网络拓扑的数据模型中
var shenzhen:Node = new Node();
shenzhen.name = "深圳";
shenzhen.location = new Point(160,200);
box.add(shenzhen);

//定义中国--北京之间的连接线
var zhongbei:Link = new Link(zhongguo,beijing);
zhongbei.name = "中国到北京的网络谱图";
var zhongshang:Link = new Link(zhongguo,shanghai);
zhongshang.name = "中国到上海的网络谱图";
var zhongguang:Link = new Link(zhongguo,guangzhou);
zhongguang.name = "中国到广州的网络谱图";
var zhongshen:Link = new Link(zhongguo,shenzhen);
zhongshen.name = "中国到深圳的网络谱图";

box.add(zhongbei);
box.add(zhongshang);
box.add(zhongguang);
box.add(zhongshen);
}
]]>
</fx:Script>
<mx:Panel title="Hello Twaver" width="100%" height="100%">
<tw:Network id="netWork" backgroundColor="0x00ff00" width="100%" height="100%"/>
</mx:Panel>
</s:Application>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值