网络图形标准SVG的特征及实现.pdfVIP

网络图形标准SVG的特征及其实现1 任品汪国平董士海 北京大学计算机科学与技术系，北京，l0087】 络应用，它灵活，可扩展，舷表现丰富的图形内容，实现了强大的交互性，可重用性和可 伸缩性．本文介绍sVG的技术特点，实l季应用和发展趋势．并结合实验室主页的制作介绍 svG图形的实现。 关麓诃：S、阿，)函儿，网络图形，矢量图形，图形标准 1 引言 随着In魄nct技术的迅速发展，人们对网络中的使用的图形图象有了更高的要求。希 望有一种既能表现丰富的图形内容，又能跨平台使用，兼容流行的技术标准规范，还可以 控制文件大小。便于网络传播，并舱使网络中使用的各种显示打印设备都能正确一致处理 的新一代图形格式。svG(scalable蛐Gl印hicn正是在这种背景下应运而生。 sVG主要面向网络应用，是w3c组织开发的新—代基于Ⅺ咀，的2维矢量图形标准。 它描述如下3种类型的图形对象：矢量图形、图像、文本。图形对象既能被分组．又能被 加入样式，变换和组合。其特征集包括嵌套变换(∽sted劬哪砌m口曲∞)，剪切路径(clh枷g pa血s)，蒙版(nnsks)，滤镜效果和模板对象。 1998年4月A由be。ⅢM参与制定的PGML(Pr∞ision Gr印hic8M出pI釉舒珀辨)微 年8月成立了s、，G工作组致力于开发新的图形标准．于1999年2月11日发布了第一个工 作草案，先后发布了九个工作草案，于今年8月2B成为候选标准(c聃didale 鼬c0Ⅲ联nd鲥蚀)¨l。w3c专门建立了一个测试站点f2l，正式的标准即将出台。 2 svG的技术特点 2．1 SVG的图形对象 sVG用专门的标记描述的矢量图形有矩形、圆、椭圆、直线、折线和多边形。对于不 能用上述图形表示的复杂图形可以用路径印蚰I竦描述。可以对备图形元素施以填充，勾 勒边界，使用滤镜．通过Ⅺ江(D【坝Isil)le St)，1c stylc出鳅Lan团m萨)或cSS(ca蚓Iding Shee姆)的方法添加各种样式等操作。 路径分直线和曲线两种，其中曲线用圆弧或三次或两次的Bez妇曲线绘制。路径有长 北京大学君政基金盎助项目。 ·220· 度属性，可以辅助实现文本按路径摆放，基于2爵径舶动画等效果。 svG在字体处理上为了使最终用户能够在任何情况下看强的字体相同，而不依赖其系 统字体库，采用了css2中的字体显示核心技术Ⅵ，eb旧。址。在sVG图形生成同时生成压缩 的该文件中用到的字体信息，可随svG文件一同传输。常用字体也可以用名字引用。字体 可以手工生成。也有公司提供从Tr∞Bpe字体自动生成SVG字体的工具Hl。 sVG通过坐标矩阵的变换可以实现坐标转换、放缩、旋转、倾斜等效果，还可以通过 矩阵相乘实现一组嵌套变换。 color c0曲删唧)颜色规 SvG的颜色管理同时支持sRl3B规范和10c(如魄删ionlI 范，可以在IcC兼容的设备上显示更为丰富的色彩。使用IcC色域时，svG采用色域描 述(col∞舯词cdc鲫ipdon)机制来建立IOc色域和svG内容的联系。色域描述被加入客 户端的色城信息中以选择相应的色彩。 在填充或勾勒边界时可以使用渐变色(掣矗dicm)和底纹哂目∞咖)。渐变色分线性(1i肥Ⅱ) 和放射性佃ldi呐两种。可以灵话的设置渐变的各种属性。 sVG中还提供了剪切路径(cH坤i雌坤n珥)和蒙版(m4sk嫩术。使用剪切路径可以使 在路径定义区域之内的图形显示出来，而屏蔽掉其辨的图形。蒙版操作遥过改变目标对象 的蛐值来生成如淡人淡出，融人背景等特殊效果。 svG提供了丰富的滤镜效果。s、rG文件中定义并引用的滤镜，传蓟客户端由浏览器 解释后调用相应算法生成。在图形发生变化时，只需耍客户蜡重新解释绘制即可。滤镜效 果可以叠加组合，通过对不同滤镜的组合使用。来生成各种专业的图像处理的效果。 svG中挺供了对嵌入图像的支持。可以在劬∞窖e标签中直接