| 文章索引 |
|---|
| 面向未来的可升级矢量图形 |
| 一、SVG中对矢量图形的支持 |
| 二、SVG中对图像过滤操作的支持 |
| 三、SVG中对动画的支持 |
| 所有页面 |
本篇文章介绍了SVG的背景情况，作者用图文并茂的方式向我们介绍了SVG的各种功能及优势，从SVG浏览支持到代码，再到效果演示，让我们很容易理解SVG的基础知识。文章还讲到SVG不仅使用Xlink和Xpointer提供超链接功能，还定义了丰富的事件，它可通过嵌入方式、Ajax、脚本方式Script和SVG Dom等技术实现动态交互功能等。
为此，众多业内人士针对Web浏览器图像图形功能支持较弱这一缺点提出了改进措施。近年来，各大软件厂商和组织纷纷推出自己的矢量图形规范，主要代表有Adobe Systems Inc.制定的PGML（Precision Graphics Markup Language）、CCLRC提出的Web Schematics、Autodesk, Inc和微软等提出的VML（Vector Markup Language）。此外，一些公司开始制作自己的plug-in来支持矢量图形的浏览，但这些插件都由于缺乏跨平台的支持，以及没有较好的配套编辑工具，而未能得到网上的广泛应用。正是在这种情况下，为统一标准，结束目前的混乱局面，W3C组织于1998年8月专门成立了SVG工作组致力于图形标准的制定工作，并于1999年2月11日发布了第一个讨论草案，后几经修订于最近发布了最终草案。
SVG是一种基于XML的用来描述二维矢量图形和矢量/点阵混合图形的置标语言，其全称是可升级矢量图形规范（Scalable Vector Graphics）。其中，"可扩展"（scalable）在图形图像技术上指的是它不局限于一个固定的分辨率和大小，譬如可以在不同分辨率的屏幕上以相同的大小显示，也可以在同一个网页中以不同的大小或观全局或观细节；而在网络技术上指的是这一规范能够与其它规范相融合，从而满足更广泛的用户需求，适合于更广泛的应用方式。"矢量"（vector）是指规范中描述了直线、曲线、形状等几何图形，而无须象PNG、JPEG等图像格式那样逐象素进行描述，这使得集成了SVG的XML文档更小，下载速度也大大提高。"图形"（graphics）是指它提供了对矢量和矢量/栅格混合图形的描述，填补了大多数基于 XML的置标语言规范对复杂图形描述的空白。
SVG规范定义了SVG的特征、语法和显示效果，包括模块化的XML命名空间（namespace）和SVG文档对象模型(DOM)。在以前的草案中，仅为SVG定义了一个DTD，这个DTD支持样式单的引用。但这样一来，SVG 就不再是一个自定义的全包容的语言规范，而需要浏览工具额外具有对样式单文件的处理能力。出于这种考虑，在新近出台的SVG的第八个草案中，为SVG提供了两种不同的形式，即样式化SVG和交换型SVG，它们各自有不同的DTD及MIME类型。样式化SVG允许对图形对象进行样式添加，它可以通过引用外部样式文件、在文件头中预先进行样式声明和通过属性为元素定义样式三种方式使用样式单，是SVG用于网络环境的推荐存储格式。而交换型SVG取消了对样式单的支持，完全使用元素属性描述各个图形对象的显示效果。在未来的网络传输中，交换型SVG将会充当现在印刷业广泛使用的图形格式--EPS格式的网络版。并且，由于所有显示信息都封装到XML的属性中，交换型SVG还可以作为XSLT转换后所得到的结果文件格式，广泛应用于XML文档显示效果的描述中。
SVG的绘图可以通过动态和交互式方式进行，在实际操作中，则是以嵌入方式或脚本方式来实现的。SVG不仅使用Xlink和Xpointer来提供超链接功能，还定义了丰富的事件，这些事件可以应用于所有的图形对象。由于SVG支持脚本语言（script），高级网页制作者仅须进行简单的Script编程，访问SVG DOM的元素和属性，即可响应特定的事件，从而提高了SVG的动态和交互性能。这使得SVG无论在显示效果还是动态交互上都不逊于当前在互联网上独领风骚的FLASH。而且，SVG除了单独使用外，还可以在XML文件中作为命名空间引入，或者用作HTML文件中的特殊对象。同样，SVG作为一种基于XML 的语言规范，也具有XML的可扩展性，可以在SVG文件中引入其它置标语言的命名空间。这些特性使得SVG在互联网上将畅通无阻，比起采用二进制文件格式不能与其它网页语言兼容的FLASH更胜一筹。
SVG是图形、图像和文字的有机统一。根据功能不同，SVG的主要对象可以归为基本要素对象和页面描述功能对象两大类，请看下图。
由上图可以看出，SVG除了支持HTML中常用的标记，如文本、图像、链接、交互性、CSS的使用、脚本（Script）外，还提供了大量针对图形、图像、动画的特定标记。下面我们就来对它们进行分别介绍。
