<2008年5月>
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567

统计

  • 随笔 - 30
  • 文章 - 0
  • 评论 - 39
  • 引用 - 0

常用链接

留言簿(2)

随笔分类(19)

随笔档案(30)

Mining

最新随笔

搜索

  •  

最新评论

阅读排行榜

评论排行榜

60天内阅读排行

如何在IE页面上显示和编辑流程图

在Web 要实现地图,流程图,涂鸦等功能的时候,可以选择VML,SVG,Javaapplet,或者Flash。百度的map 搜索的地图展示就是使用VML 的。


1、 VML

VML是微软1999年9月附带IE5.0发布的,全称是Vector Markup Language(矢量可标记语言),其实是Word和HTML结合的产物。可以将Word文档另存为HTML,其中的文本和图片可以很容易的转换,但如果是手绘制的图形在以往的IE里面就无法解释了,如果都转换成图形文件又不太现实。于是微软把Word里面的图形控件结合到IE里面,使IE也具备了绘图功能。

VML 的资料:

MS 的 How to Use VML on Web Pages 
   http://msdn.microsoft.com/library/default.asp?url=/workshop/author/VML/ref/basic1.asp
Think In VML(VML基本教程) 
   http://www.itlearner.com/code/vml/index.html

VML画板  
   http://www.tool.la/VMLPalette/

VML编辑器 
   http://www.dynamicdrive.com/dynamicindex11/editor.htm

流程图 
   http://cosoft.org.cn/projects/webflow

How to Implement Vector Markup Language (VML) on Web Pages?
   http://www.tudjarov.hit.bg/vml/vmlbt.html

VML Chart 控件 
   http://dev.csdn.net/article/23/23770.shtm

Chart Demo
   http://webfx.eae.net/dhtml/chart/demo.html


2、SVG


SVG,全称为Scalable Vector Graphics(可伸缩矢量图形)。它是W3C制定的、用矢量描述图形的XML应用标准。它有着许多的优点,比如可扩充性(scalable),动态的,交互性强。SVG支持无极放大,对SVG图片进行任意比例的放大都不会损害图片的显示(没有太多的失真),其他诸如BMP,JPEG格式的图片都不支持无级放大。SVG有动画元素,只要在SVG文件中嵌入SVG动画元素就可以实现动画效果了。同时SVG也定义了丰富的事件,包括鼠标事件和键盘事件,只要对SVG进行相关的脚本编程就可以实现SVG文件的交互操作。


相关示例:

SVG脚本编程
http://dev.csdn.net/article/26/26676.shtm
http://www.adobe.com/svg/examples.html



SVM & SVG 相关的库和应用有
Prototype Graphic Framework
   http://prototype-graphic.xilinus.com/

Cumulate Draw 很强大的一个画图工具, 基本上实现了Visio 的功能
   http://www.cumulatelabs.com/cumulatedraw/
RichDraw - Simple VML/SVG Editor
   http://starkravingfinkle.org/blog/2006/04/richdraw-simple-vmlsvg-editor/
Mapbar 地图
   http://main.mapbar.com/
mxDraw 很强大的一个流程图画板
   http://www.mxgraph.com/demo/mxgraph/editors/diagrameditor.html

Del.icio.us
   http://del.icio.us/hedgerwang/VML


3、Flash


Flash的强大功能就不用介绍了,相信它完全可以实现任何流程图的操作功能。但是,Flash的学习成本太高了,它的ActionScript让我们这些写惯了java、js的开发人员一头雾水。而且相关的网络资源实在是太少了,当初我google了N久,才勉强找到一个通过读取xml文件显示流程图的example,功能仅仅是显示xml文件中配置的流程节点(有需要源码的朋友可以mail我)。所以,要想实现强大的流程图编辑功能,Flash只推荐高手使用。


4、Java Applet

在SVM 和 SVG 出现以前,有网络涂鸦,就是用Applet 做成的,但是现在好像用的不多了。

 

posted on 2007-01-11 12:06 泡泡牛 阅读(1536) 评论(3)  编辑 收藏 引用 所属分类: Software

评论

# re: 如何在IE页面上显示和编辑流程图  2007-04-29 14:07 leonard

hi

我最近做毕业设计 想参考 那个 显示流程图的flash,
你能把源码发给我一份么?

我的email是 pku76[at]126.com ([at] to @, plz ...)

谢谢了~~~`
  回复  更多评论    

# re: 如何在IE页面上显示和编辑流程图  2008-02-28 11:37 xuliangchao

能把源码发给我一份么?

我的EMAIL:xuliangchao@hotmail.com
  回复  更多评论    

# re: 如何在IE页面上显示和编辑流程图  2008-02-28 11:59 泡泡牛

@xuliangchao
我只做了 vml 的实现, 参考的是下面的地址, 你可以直接访问这些, 然后从ie 缓存得到源码的.
个人感觉 http://www.mxgraph.com/demo/mxgraph/editors/diagrameditor.html 的是最强大的, 是整一个的ui库实现, 但是速度也比较慢.

VML画板
http://www.tool.la/VMLPalette/

VML编辑器
http://www.dynamicdrive.com/dynamicindex11/editor.htm

流程图
http://cosoft.org.cn/projects/webflow

How to Implement Vector Markup Language (VML) on Web Pages?
http://www.tudjarov.hit.bg/vml/vmlbt.html

VML Chart 控件
http://dev.csdn.net/article/23/23770.shtm

Chart Demo
http://webfx.eae.net/dhtml/chart/demo.html
  回复  更多评论    

标题  
姓名  
主页
验证码 *
内容(提交失败后,可以通过“恢复上次提交”恢复刚刚提交的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
[使用Ctrl+Enter键可以直接提交]