vml 实现web topo原型（12）-自动摆放

最新推荐文章于 2024-04-19 10:03:50 发布

laputa73

最新推荐文章于 2024-04-19 10:03:50 发布

阅读量1.1k

点赞数

分类专栏： web编程文章标签： web button function date javascript behavior

本文链接：https://blog.csdn.net/laputa73/article/details/5411620

版权

web编程专栏收录该内容

54 篇文章 0 订阅

订阅专栏

作为网络拓扑，自动摆放时必不可少的功能。

根据MVC模型的思路，控制摆放的逻辑应该放在后台的控制层。

不过这里为了简化演示，直接通过js来实现简单的摆放算法。

这里主要显示一下效果。主要通过设备的hop属性来控制设备显示所在的层数和位置。

支持：

矩形摆放

圆形摆放

环形摆放

<html xmlns:v="urn:schemas-microsoft-com:vml"> <STYLE> v/:* { BEHAVIOR: url(#default#VML) } </STYLE> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title> 拓扑 </title> </head> <mce:script type="text/javascript" language="javascript" src="./js/createNE.js" mce_src="./js/createNE.js"></mce:script> <mce:script type="text/javascript" language="javascript" src="./js/moveObj.js" mce_src="./js/moveObj.js"></mce:script> <mce:script type="text/javascript"></mce:script> <body bgcolor="#ffffff"> <div id="backdiv"> <v:group id="backgroup" style="position:absolute;Z-INDEX:2;WIDTH:1000.0;HEIGHT:1000;top:50;left:50";coordsize="1000,1000"> </v:group> </div> <mce:script type="text/javascript"></mce:script> <button οnclick="save()">源码</button> <button οnclick="zoom(2)">放大2倍</button><br> <button οnclick="alignbyrect(lvl,m*n)">矩形摆放</button> <button οnclick="alignbyround(m*n)">圆形摆放</button> <button οnclick="alignbycircle(lvl,m*n)">环形摆放</button> </body> </html>

laputa73

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
vml 实现web topo原型（12）-自动摆放

作为网络拓扑，自动摆放时必不可少的功能。根据MVC模型的思路，控制摆放的逻辑应该放在后台的控制层。不过这里为了简化演示，直接通过js来实现简单的摆放算法。这里主要显示一下效果。主要通过设备的hop属性来控制设备显示所在的层数和位置。支持：矩形摆放圆形摆放环形摆放<!-- dev5.html 1.拓扑整体放在一个区域(div/group) 2.自动摆放
复制链接

扫一扫