Web中实现矢量图形的方法不在乎两种SVG和VML。可升级矢量图像( SVG, Scalable Vector Graphics)和VML (Vector Markup Language)的产生有着十分积极的意义。它具有支持矢量图和动画、由文本构成图形易于操作、对点阵图形兼容等特点。然而,不同浏览器对两种标准的支 持并不一致, 微软的IE浏览器系列对VML支持比较好,而其他的浏览器软件对SVG标准支持更完美。这也使得开发基于Web的图形系统变得更加复杂。
而多比控件通过SVG/VML+JS实现跨浏览器的矢量图形实现方案,这其实和cufon等网络字体的实现原理是有些类似的:非IE浏览器使用SVG绘图,然后IE中使用VML。它的目的是想要提供一种简单易用的真正跨浏览器的矢量图形实现方案,包括一些动画效果。
背景知识
在说SVG之前,先要说一下HTML。现在流行的web页面是由HTML构成的。大家在浏览本页面时,可以用浏览器的查看“源文件”的功能,看看在花花绿绿的网页背后是些什么东西。
实际上我们所有看到的东西都是HTML语言,被浏览器解释成现在的样子。
然而,现在的网页似乎少了一些东西,那就是对图形的描述和表示。要想在网页中画一条斜线或一个圆,就已经超出了目前HTML的能力范围。我们只能通过镶嵌入图片、FLASH或用JavaScript语言来编程实现。
虽 然找到了曲线救国的方法,但随着Google等搜索引擎的发展,又冒出了一个问题。无论是图片还是Flash,都不能被搜索引擎很好的识别。比如你在 Flash中写了一篇文章,搜索引擎就很难知道这篇文章的内容。因为Flash的播放格式是一个封闭私密的格式。只有Flash的开发商知道如何解开。
这时,我们就需要一个能显示图形,又具有可搜索性的格式出现。
SVG就是其中之一。
由于HTML是一个可扩展的体系,在预先定义的一大堆标签种类中,可以再定义一些新的标签,比如用来表示圆的<circle>标签。
这就意味着未来的浏览器可以认识一些新的标签,来描述图形。
但是,具体该用一些什么标签来描述图形呢?w3c这个国际组织就想出了SVG。在它的SVG标准中,提出了一系列定义,比如直线如何定义、圆如何定义、是否可以在SVG中贴图片、写文字等等。
有些浏览器开发者在了解w3c这一标准后,觉得很好,那就支持呗。比如Safari、Firefox和Chrome的开发者。但有些浏览器开发者不屑一顾,比如IE的开发者。
至于IE的不支持,也许是因为IE的开发者好不容易想出了VML这个东西。说起来SVG和VML都是用XML来描述图形的方法,都可以让浏览器画出矢量图形来。可以说SVG和VML异曲同工,但标准完全不一样。这就开始掐架了。
不过从我本人搜索了这么半天来看,SVG的提出者是w3c,这个组织也是XML的标准制定者。从对于XML的理解来看,w3c里面的人从理论上讲应该比Microsoft的专家更理解XML。因此SVG更具备XML的一些内在精神。至于是什么内在精神,就只有以后再说了。
SVG的未来似乎和MS无关了,但和另一个大佬adobe有关。
本 来adobe是SVG的坚定支持者,他甚至针对IE浏览器开发了查看SVG的浏览器插件。当IE浏览到有SVG的网页时,就会询问用户,是否安装 adobe的SVG viewer插件。如果用户安装,只要一小会儿就可以查看网页上的SVG了。这个过程和Flash的查看是一样的。
这里我们又要将Flash和SVG作一些比较了。实际上Flash也是一个矢量图形的制作工具。前面已经说了一些,Flash是未公开的格式。不能被搜索。实际上我们可以发现Flash和SVG正好覆盖了封闭格式和公开格式的两种矢量图形动画和交互的解决方案。
可想而知,adobe后来收购了Flash的开发公司,正好完善了其产品线。这样用户无论想达到什么目的,都可以用adobe公司的产品。
因 此,从前途上来说,SVG是下一代web网的组成部分,它符合XML标准,这意味着可以享受到目前HTML语言享受到的一切支持。比如浏览器的支持、 JavaScript的支持、搜索引擎的支持等等。同时,与目前的HTML无缝衔接,不分彼此。可以实现下一代web的平滑过渡。
因此,SVG的应用并不是一夜之间的事情。而是慢慢的,一点一点的。当我们在一个较大时间范围作回顾时,我们才会对SVG的应用有所感悟。
分享到:
相关推荐
SVG是另一种更现代的矢量图形标准,但在IE8及更早版本中并未得到支持,因此,对于这些浏览器,VML成为了一个有效的替代方案。 首先,我们需要理解VML的基本结构。VML元素通常以`<v:shape>`、`<v:line>`、`<v:oval>`...
VML(Vector Markup Language)是微软推出的一种矢量图形标记语言,它允许网页开发者在HTML文档中嵌入矢量图形。JavaScript与VML结合,可以实现动态、交互式的图形绘制,比如在本实例中,我们将探讨如何利用这两种...
总之,"vml+js实现的框图编辑器"是一个融合了传统与现代Web技术的示例,展示了如何用JavaScript和矢量图形技术来创建功能丰富的交互式应用。开发者可以通过研究这个项目,学习如何处理图形用户界面的交互、数据序列...
总结来说,这个“Javascript + VML + SVG 工作流设计器”利用了JavaScript的动态性、VML和SVG的矢量图形能力,为用户提供了一种在浏览器中设计和管理工作流程的强大工具。无论是新版本的浏览器还是旧版本的IE,都能...
首先,我们来看VML,全称Vector Markup Language,是一种矢量图形语言,主要用于在网页上绘制矢量图形。与HTML类似,VML也是一种标记语言,它允许开发者通过XML语法定义形状、线条、填充等元素。由于VML主要被微软...
总结,VML和SVG都是用于创建矢量图形的重要工具,但SVG作为开放标准,更受现代浏览器支持。通过类工厂设计模式和适当的浏览器检测策略,开发者可以确保在所有主流浏览器上提供一致的用户体验。同时,掌握SVG的高级...
VML,全称为Vector Markup Language,是在SVG之前的一种矢量图形技术,主要在Internet Explorer浏览器中得到支持。尽管SVG现在已经成为W3C的标准,但考虑到兼容性问题,有些开发者仍会使用VML。实现3D曲面效果时,...
本篇文章将对VML与SVG进行归纳和分析,并提出了一种基于JavaScript的跨浏览器动态矢量图形构架(DVGA)。 首先,VML与SVG是两种不同的矢量图形语言。VML是一种基于XML的矢量图形语言,可以在IE中绘制矢量图形。SVG...
6. **兼容性**:虽然VML主要是在IE浏览器中得到支持,但考虑到现代浏览器大多支持SVG,这个项目可能也考虑了其他浏览器的兼容性问题,如使用JavaScript库如Raphaël来提供跨浏览器的矢量图形支持。 总的来说,这个...
VML(Vector Markup Language)是一种基于XML的标记语言,主要用于在网页上绘制矢量图形。它在Internet Explorer浏览器中得到了良好的支持,特别是在那些不支持SVG(Scalable Vector Graphics)的老版本浏览器中。...
SVG(Scalable Vector Graphics)和VML(Vector Markup Language)都是用于在网页上创建矢量图形的技术。在本文中,我们将深入探讨这两种技术如何应用于实现兼容所有浏览器的网络拓扑图,以及如何处理大量节点的显示...
VML(Vector Markup Language)是一种矢量图形标记语言,它允许网页...然而,需要注意的是,VML现在已经不再被广泛支持,现代浏览器更倾向于使用SVG(Scalable Vector Graphics)或者canvas元素进行矢量图形的绘制。
Flash以其强大的动画功能和跨平台兼容性而闻名,而VML则提供了更精细的矢量图形绘制能力。将两者结合,开发者可以创建更丰富、更动态的网页图形内容。 在网页图形显示方面,VML和Flash VML允许开发者在不依赖插件的...
SVG、CANVAS、VML是三种用于在Web上创建矢量图形的方法,它们各有优缺点,适应不同的场景需求。 SVG(Scalable Vector Graphics)是一种基于XML的开放标准,被广泛支持,尤其在现代浏览器中,如Firefox和Opera。在...
在IT领域,JavaScript(简称JS)是一种广泛应用于网页和网络应用开发的脚本语言,而VML(Vector Markup Language)是微软推出的一种矢量图形语言,用于在网页上绘制矢量图形。本教程将深入探讨如何结合这两种技术,...
《使用VML与ASP构建投票系统详解...同时,考虑到VML主要在旧版本的IE浏览器中支持,现代的Web开发更倾向于使用SVG(Scalable Vector Graphics)或Canvas进行图形绘制,它们具有更广泛的浏览器兼容性和更多的功能特性。
- 为了简化VML的使用,有一些JavaScript库如Raphaël(http://raphaeljs.com/)提供了跨浏览器的矢量图形绘制功能,包括对VML的支持,使得在不同浏览器中实现图形绘制变得更加容易。 6. **局限性**: - VML并不...
在实际项目中,开发者可以结合使用这两种技术,比如在IE浏览器中使用VML,其他现代浏览器使用SVG,以实现跨浏览器的兼容性。"流程展示"这个文件可能包含了实现这一功能的源代码、示例和说明文档,供开发者参考和学习...
这个实例是通过JavaScript库RaphaelJS实现的,它支持SVG和VML两种矢量图形标准,使得这个功能在不同的浏览器环境下都能正常工作。以下是关于这个项目的关键知识点: 1. **SVG (Scalable Vector Graphics)**:SVG是...