vml实现web top原型(8)-导出

最新推荐文章于 2023-10-30 10:56:46 发布

原创最新推荐文章于 2023-10-30 10:56:46 发布 · 981 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#web #javascript #behavior #button #office #function

web编程专栏收录该内容

54 篇文章

订阅专栏

本文介绍了一种将VML（Vector Markup Language）绘制的拓扑图置于特定区域(div/group)的方法，并实现了整体缩放功能。通过这种方式，可以方便地导出VML源码，同时提供了放大功能以更好地查看细节。

之前的例子中，vml都是直接输出到主页面的document上的。这样不便于输出时和无关的内容分离。

我们可以把vml 输出到一个单独的区域，div，这样可以方便地导出vml的源码。

另外。在生成vml 时。我们统一使用一个group作为画布。以便实现整体的缩放功能。

注意,vml是不可以导出成图片的，只能导出成vml、doc、xls等格式（导成office格式时会错位,office2003）

<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:10;left:10";coordsize="1000,1000"> </v:group> </div>  <mce:script type="text/javascript" language="javascript"></mce:script> <button onclick="show()">源码</button> <button onclick="zoom(2)">放大 2倍css</button><br> </body> </html>