<canvas> 标记和 SVG 以及 VML 之间的差异

<canvas> 标记和 SVG 以及 VML 之间的一个重要的不同是,<canvas> 有一个基于 JavaScript 的绘图 API,而 SVG 和 VML 使用一个 XML 文档来描述绘图。

这两种方式在功能上是等同的,任何一种都可以用另一种来模拟。从表面上看,它们很不相同,可是,每一种都有强项和弱点。例如,SVG 绘图很容易编辑,只要从其描述中移除元素就行。

下面分别对SVG与 VML进行简单的介绍。

VML(The Vector Markup Language)

HTML中的VML使用的简单的文本来表示图像,这样就可以很少的字节来表示比较复杂的图像,VML与HTML兼容,通过在HTML中声明VML命名空间并声明处理函数,就可以和其他HTML元素一样使用VML元素,在客户端浏览器显示图像,VML标记里面可以定义DHTML大部分属性和事件,比如说id,name,title,onmouseover等等。但是VML的功能不只是绘图,它还可以在图形中嵌入文本,并可实现超链接,还可通过脚本语言实现一定的动画功能。

SVG(Scalable Vector Graphics)

SVG是一种基于XML的开放的矢量图形描述语言。SVG图像是与XML1.0兼容的文档,SVG元素是指示如何绘制图像的一些指令,阅读器(Viewer)解释这些指令,把SVG图像在指定设备上显示出来。使用SVG可以在网页上显示出各种各样的高质量的矢量图形,支持很多功能:几何图形、动画、渐变色、滤镜效果等。最关键是他也是完全用普通文本来描述的!也就是说,这是一种专门为网络设计的基于文本的图像格式。

VML相当于IE中的画笔,能实现你所想要的图形,而且结合脚本,可以让图形产生动态的效果,VML是微软1999年附带IE5.0发布的,VML其实可以看作是word与html结合的产物,可以将word文档另存为html,其中的文本和图片可以很容易的转换。VML支持广泛的矢量图形特征,它们基于由相连接的直线和曲线描述路径。在VML中使用对两个元素:shape和group。这两个元素定义了VML的全部结构;shape描述一个矢量图形元素,而group用来将这些图形结合起来,这样他们可以作为一个整体进行处理。

SVG 可被非常多的工具读取和修改(比如记事本),支持多种滤镜和特殊效果,在不改变图像内容的前提下可以实现位图格式中类似文字阴影的效果,易于修改和编辑。
 SVG 与 JPEG 和 GIF 图像比起来,尺寸更小,且可压缩性更强; SVG 是可伸缩的;SVG 图像可在任何的分辨率下被高质量地打印; SVG 可在图像质量不下降的情况下被放大; SVG可以方便的建立文字索引,从而实现基于内容的图像搜索,图像中的文本是可选的,同时也是可搜索的(很适合制作地图);SVG 可与现有技术可以互动融合。例如,SVG技术本身的动态部分(包括时序控制和动画)就是基于SMIL标准。另外,SVG文件还可嵌入JavaScript(严格的说应该是ECMA Script)脚本来控制SVG对象,还可以与 Java 技术一起运行;SVG 文件是纯粹的 XML。为了保证网络图像能够顺利地和目前已经由W3C开发的 D0M1,DOM2,CSS,XML,X Pointer,XSLT,XSL,SMIL,HTML,XHTML技术,以及其他标准化技术,如 ICC,URI,UNICODE,RGB,ECMA Script/JavaScript,Java协调一致,SVG是完全基于x M L(Extensible Markup Language可扩展置标语言),并能和上述各项技术相融会的新一代的网络图像格式。SVG并非仅仅是一种图像格式,由于它是一种基于XML的语言,也就意味着它继承了XML的跨平台X和可扩展X,从而在图形可重用X上迈出了一大步。如SVG可以内嵌于其他的XML文档中,而SVG文档中也可以嵌入其他的XML内容,各个不同的SVG图形可以方便地组合,构成新的SVG图形; SVG 图形格式可以用来动态生成图形。例如,可用SVG动态生成具有交互功能的地图,嵌入网页中,并显示给终端用户
 可以说,SVG的出现带来了一次技术革命。利用SVG能够创建更加丰富多彩的信息可视化和交互性的应用,尤其是可以创建具有动态的、数据驱动的、交互式图形、图像。另外,由于是纯文本格式的.SVG比传统的图形、图像格式如GIF和JPEG占用更少的空间。因此,SVG更加适合有线带宽,并可提高下载速度。SVG和XML的开放式标准特性使其成为国际性语言。SVG标准得到了IBM、Adobe、Microsoft、Corel等几十家大公司的支持,其最新的版本是SVG 1.2。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值