（计算机应用技术专业论文）基于svg的矢量图形编辑系统的研究.pdf

华中科技大学硕士学位论文 摘要 r ( 随着图形格式的发展，矢量图形格式发挥着越来越重要的作用。可扩展的矢量 图形( s v g ) 是w 3 c 组织制定的一套基于x m l 的二维矢量图形格式规范，这就使得 s v g 集x m l 和矢量图形格式的优点于一身。在s v g 中允许3 种形式的图形对象存在： 矢量图形、点阵图像和文本。s v g 是基于文本格式的，所以必须对它进行解析才可 以识别。简单应用程序接口( s a x - ) 就是一种x m l 的解析标准。s a x 提供的是一种 线性文档处理模型。衫 由于s v g 是新推出的标准，目前的s v g 的编辑工具很少，特别是在行业用图上， 可以说没有合适的工具。雨基于s v g 的矢量图形编辑系统就是种可视化编辑s v g 行业用图的工具。通过把基本图形组织成图元( e l e m e n t ) 保存在图元库中，在需要 时将它对应于不同的物理设备。在绘制时，通过定义好的一个个功能完善的图元可 以方便快捷地绘制复杂的图形。绘制完成后以s v g 文件格式保存在本机或者是服务 器上。也可以打开已经存在的s v g 文件，通过一种扩展的s a x 事件解析模型，生成 矢量图形编辑系统中的可以识别的图形对象，然后对它进行编辑。 为了方便的进行编辑，矢量图形编辑系统还提供了许多便利化工具。通过上线 导航工具可以方便准确的进行图形定位：通过全景图和缩放工具可以进行局部化编 辑；通过智能连接可以在编辑时保持图形间的连接关系；通过图元、组合分解、撤 销重做机制可以简化绘图等等。通过系统提供的便利化工具用户不需要了解很多图 形知识就可以绘制专业水准的图形。 关键词：可扩展的矢量图形；文档对象模型；简单应用程序接口；f ，解4 ；f 毛一 华中科技大学硕士学位论文 a b s t r a c t a l o n gw i t ht h ed e v e l o p m e n to fg r a p h i c sf o r m a t ，m o r ea n dm o r e ，v e c t o rg r a p h i c s p l a y s a n i m p o r t a n t r o l e s c a l a b l ev e c t o rg r a p h i c s ( s v g ) i sa s e to fx m l b a s e d t w o d i m e n s i o ng r a p h i c ss t a n d a r de s t a b l i s h e db yw 3 co r g a n i z a t i o n ，a n dt h i sm a k e ss v g i n t e g r a t et h ea d v a n t a g e s o fx m la n dv e c t o rg r a p h i c s ，t h e r ea r et h r e ef o r m a t so f g r a p h i c s i ns v g ：v e c t o rg r a p h i c s ，l a t t i c ei m a g ea n dt e x t s v gm u s tb ep a r s e db e f o r ei tc a nb e r e c o g n i z e ds i n c e i ti st e x t - b a s e d s i m p l ea p i sf o rx m l ( s a x ) i sas t a n d a r du s e dt op a r s e x m l s a x p r o v i d e s ak i n do fl i n e a rd o c u m e n tp r o c e s sm o d e l a tp r e s e n t ，t h ee d i t o ro fs v gi sf e ws i n c es v gi san e ws e to f s t a n d a r d e s p e c i a l l y i ns p e c i a lf i e l di m a g e ，t h e r ei sn oa p p r o p r i a t et 0 0 1 h o w e v e r ，v e c t o rg r a p h i c ss y s t e mi sa k i n do fv i s u a lt o o lu s e dt oe d i ts p e c i a lf i e l ds v g ，t h r o u g hs t o r i n gb a s i cs h a p e si n e l e m e n t ，v e c t o rg r a p h i c ss y s t e mm a t c h e st h e mw i t hd i f f e r e n tp h y s i c a le q u i p m e n t s w e c a ne x p e d i e r t t l _ yp a i n fc o m p l e xg r a p h i c st h r o u g hu s i n gp r e v i o u s l yd e f i n e df u n c t i o n a l e l e m e n t sw h e np a i n t i n g a f t e rp a i n t i n g ，w ec a ns t o r ei t w i t hs v gf o r m a ti nl o c a lo r s e r v e r w ea l s oc a nu s ea ne x t e n s i v es a x e v e n tp a r s i n gm o d e lt oo p e ne x i s t e n ts v gf i l e c r e a t er e c o g n i z e dg r a p h i c so b j e c t ，t h e ne d i tt h e m i no r d e rt oe d i te x p e d i e n t l y ，v e c t o rg r a p h i c ss y s t e mh a sp r o v i d e dm a n yc o n v e n i e n t t o o l s s u c ha s ，e x p e d i e n t l yl o c a l i z i n gs p e c i f i cg r a p h i c st h r o u g ho n l i n ea n dn a v i g a t o r ； p a r t l ye d i t i n gt h r o u g hp a n o r a m i cm a pa n dz o o m i n gt o o l ；k e e p i n gg r a p h i c s r e l a t i o n t h r o u g hs m a r tc o n n e c t i o n ；s i m p l i f y i n gp a i n t i n gt h r o u g he l e m e n t s ，c o m p o s e d e c o m p o s e a n dr e d o u n d om e c h a n i s m e t c ，t h r o u g hu s i n ga l lt h e s ec o n v e n i e n tt o o l s ，ac u s t o m e rc a l l p a i n tp r o f e s s i o n a lg r a p h i c sw i t h o u tu n d e r s t a n d i n gm u c hk n o w l e d g e o f g r a p h i c s k e yw o r d s ：s v g ；d o m ；s a x ；p a r s e 华中科技大学硕士学位论文 1 绪论 1 1 课题背景 随着i n t e r n e t 技术的普及和发展，图形图像技术作为w e b 浏览技术的基础，发挥 着至关重要的作用，但是，耳前的i n t e r n e t 技术在图形图像方面，应该说还处在年轻 阶段。随着应用的逐渐深入，图像技术自身的一些缺点，如文件较大、在不同设备 上的显示效果不一样等问题日益突出，这从某种程度上讲，也限制了w e b 浏览技术 的进一步发展。为此，众多业内人士针对w e b 浏览器对图形图像功能支持较弱的 这缺点提出了改进措施，正是在这种局面下，s v g 应运雨生i 2 】。 s v g ( s c a l a b l ev e c t o rg r a p h i c s ) 的全称是可扩展的矢量图形，是为适应w e b 应 用飞速发展而制定的一套基于x m l 语言的矢量图形描述规范。虽然h t m l 作为网上 进行数据浏览和数据交换的主要文件格式，为网络技术的蓬勃发展发挥了不可磨灭 的作用，但随着其应用的不断深入，它的不足之处也逐渐暴露出来，主要有如下两 点：一是标记固定、有限且无内涵；二是不支持矢量图形 孓”。这两大缺陷越来越成 为限制w e b 应用的障碍。作为一种改进，w 3 c 于1 9 9 8 0 2 一1 0 发布了x m l l o 规范，解 决了h t m l 在标记上的不足，使得i n t e m e t 技术大大前进了一步，但仍不支持矢量图 形1 6 3 】。与此同时，各大软件厂商和组织纷纷推出自己的矢量图形规范。其主要代表 有a d o b es y s t e m si n c ，制定的p g m l ( p r e c i s i o ng r a p h i c sm a r k u pl a n g u a g e ) ，微软等公 司提出的v m l ( v e c t o r m a r k u p l a n g u a g e ) 睥j 等等。此外，一些公司还制作自己的p l u g i n 来支持矢量图形的浏览，但这些插件由于缺乏跨平台的支持，以及没有较好的配套 工具，而未能得到网上的广泛应用。正是在这种情况下，为统标准，结束目前的 混乱局面，w 3 c 组织于1 9 9 8 年8 月专门成立了s v g 工作组，致力于图形标准的制定工 作，并于1 9 9 9 0 2 11 发布了第一个讨论草案，后几经修订，发布了最终草案。 s v 6 是一种矢量图形格式，跟位图相比，具有无级缩放，不失真的特点，且文 件大小跟图形格式无关只跟图形复杂程度有关【9 , 1 0 。而且s v g 是基于文本格式的， 因此，任何文本编辑工具都可以进行编辑修改，但是用通常的文本编辑工具来编辑 s v g 文件，显然是不够直观，而且不方便也很不准确，所以提供一个对s v g 文件进 华中科技大学硕士学位论文 行可视化编辑的矢量图形工具，是很有必要的。 对于不同行业所需的s v g 图形，往往是非常复杂而且是巨大的。而市面上的s v g 工具由于没有提供相应的图元库，所以在绘制一个较大图形时，都不是很方便队1 2 1 。 本文所提出的矢量图形编辑系统就是为了解决这种问题而产生的。 1 2 国内外研究状况 计算机存储图形的格式主要有两种：位图格式和矢量图形格式1 3 l 。目前在网上 的图像有：j p e g 、g i f 、p n g 、v m l 、s v g 等等。g i f 是g r a p h i c si n t e r c h a n g e rf o r m a t 的缩写。g i f 格式是经过压缩的格式，文件较小，由于它是制作2 d 动画的文件格式， 所以在网上广泛使用nj p e g 是按照, j o i n tp h o t o g r a p h i ce x p e l sg r o u p 制定的压缩标准 产生的压缩格式，可以用不同的压缩比例对这种文件进行压缩，技术十分先进，对 图形质量影响很小，是主流的图形格式 1 4 , x 5 】。p n g ；恳专门针对w e b 开发的一种无损 压缩图像，结合了以上两种图像格式的优点，它的压缩比大大超过了l z w 等传统的 图像无损压缩算法，同时它还支持透明背景和动态效果。但是g i f 、j p e g 和p n g 都 是位图格式【l “，也就是通过记录每个图形的象素点的信息来保存图形，存在着严重 的不足：当试图改变图形的尺寸时，就需要更多的象素点信息，而位图保存的信息 不够，因此造成了难看的锯齿状的图形。而且即使g i f 、j p e g 和p n g 都经过压缩， 但是图形文件还是过大，因此传输缓慢。为了解决这些问题，就产生了矢量图形格 式。v m l 虽然是基于x m l 的图形标准，但是缺乏对x m l 相关标准的完整集成，而未 能得到广泛应用。 1 2 1s v g 工具 s v g 是一种矢量图形格式，所以也具有矢量图形的优点，任意缩放不影响图形 质量，且其大小只跟图形复杂度有关，所以跟普通位图格式相比，具有更小的文件 尺寸，更易于在网上传播【1 7 , 1 8 1 。s v g 并非仅仅是一种图像格式，它还是一种基于x m l 的语言，且同样支持层叠样式表c s s t l 9 l 和可扩展的样式酷x s l 2 0 】来定义它的样式， 这就意味着s v g 将是可扩展的、可样式化的、可脚本化的和易于集成的。 s v g 灵活的扩展了图像的文件格式，它由三个部分组成：矢量图形、位图和文 华中科技大学硕士学位论文 字。这样s v g 不仅可以应用矢量图形和文字对象，同样可以纳入位图，可以制作任 何其他格式图像所能达到的效果。而且格式是文本形式的，可以在以后任何时间进 行修改。s v g 内置了对j a v a s c r i p t 的支持，利用j a v a s c r i p t ，可以为s v g 添加各种交互 程序 2 1 1 。 s v g 作为w 3 c 组织正式推荐的图像格式，众多知名厂商纷纷宣布对s v g 的支持， 包括m i c r o s o f t 、n e t s c a p e 、s u n 、h p 、a d o b e 、m a c r o m e d i a 、c o r e l 等。目前比较流行 的s v g 工具有： 1 2 1 1s v g 浏览工具 1 a d o b es v gv i e w e r 作为s v g 的提出者之一，a d o b e 公司已经将s v g 融入到它的所有产品之中，目 前在s v g 的浏览器和编辑器上都有建树。由其开发的s v gv i e w e r 是以i e 的插件形式 来提供支持的s v g 浏览工具，由于a d o b e 公司在图形图像行业的领先优势，所以使 用最为广泛。在图像方面，它可以显示输出g i f 、j p e g 和p n g 格式的位图图像，并 支持对图像的过滤操作。在图形方面，它不仅支持基本图形的填充，而且支持路径、 裁减、过滤，而且在显示中可以反走样显示出较好的效果。在文字方面，它支持各 种字体字号，并可以对文字进行轮廓填充。不过，由于它还不支持g b 2 3 1 2 编码，中 文不得不转换为u t f 8 输出。支持丰富的动画效果。支持d o m ，可以内嵌脚本，达 到生动活泼的交互效果。支持超链接，可以链接到其他的文件或者是一个u r l 地址， 也可以是一个e m a i l 地址。支持背景音乐的播放，可以播放m p 3 和w a v 格式的声音 文件。 s v gv i e w e r 的安装非常简单，只要选择默认的安装即可。一旦安装好了该软件， s v g 文件的默认的打开方式就是由浏览器i e 打开，然后i e 调用插件来显示s v g 格式 的图形图像。这个插件还提供了一些特殊的功能，可以将显示区域扩大或者是缩小， 可以中断动画的播放，可以在显示区域搜索指定文本，当然也可以查看源文件和打 印。 2 【b ms v gv i e w e r 华中科技大学硕士学技论文 这个软件悬i b m 公司开发的可蚪浦览s v 0 的浏览工具。由于该软件出现的时间 较旱，那时s v g 臻鬻成为w 3 c 的推荐标准，搿以该软释氇随着s v g 标准韵逐步升绒 丽逐步完善。i b ms v gv i e w e r 是以一个独立的软件包来发布的。丽不是和a d o b e s v gv i e w 目一样以擂伟形式提供，崧某些方弼功能更加强大。 鑫予该辕待霆用j a v a 语言开发躲，掰数在运行改软，搏之前要先安装渔v a 鹩运 行环境和i b m 公司的x m l 解析器。浏览s v g 舶方法蹙用s v o 浏览工媳打开s v g 文件 部可。 3 c s i r os v gt o o l k i t 和k o a l aj a e k a r o o 遮两个s v g 浏览工具在遗行之前，也必颁安装j a v a 环境，通过使用x e r e e s 的 嬲l 秘黪惑c s s 语法分橱器，支持完整的d o m2 接霜。这两个较孝 舔是受赞的，并 且带育源代码，可以在网上下裁这两个软件。 l 2 12s v g 编辑工具 s v g 文 孛是基于文本揍冀懿，箧此经簿文本编辑工兵鄂可鞋对s v g 文件避嚣蕊 辑操作，例如_ a 事本工舄等等。但是出于缺麓足够的直观性，所以编辑起采并不方 便。丽曩编辑s v o 文静嚣要对$ v g 蕊藏菲常熟悉才畿正确进行编辑撩作，这样必然 就会限制使用的人群。所以许痴图像以及多媒体领域的厂家不仅参与s v g 官方规范 标准的修改讨谵。两且开菱出了诲多s v g 文糨的显示，编辑鞠转换工具。置翦在市 诼上做的较好的s v g 编辑工具主要有以下几种： 1 a d o b ei l l u s t r a t o r 9 0 a d o b ei t l t # t r a t o r 楚一个被广泛农用于乎瓣设诗豹髫澎处理软箨，最耨敝本蹙 9 0 ，它提供的功能很完美。i l l u s t r a t o r 9 0 中加入了s v g 功能，可以将设计好的网页输 出s v g 文箨，丽且还可黻为嚣藤上的嚣形对象定义不嗣瓣事件，对s v g 的藏级功能 也支持得很好【”】。 2 c o r e l d r a w 90 c o r e | 公霹豹c o r e l d r a w 鹭彤软件在乎匿设计领域久负盛名，早在c o r e l d r a w 9 0 之前的8 0 版本就开始支持w e b 蕊蕊设计，在其中增加了许多只有w e b 页面才孺要的 4 华中辩技大学硕士学位论文 对象，例如表单、超链接等等，可戬生成h t m l 格式的文件。对手页霞上鲍图形怼 象，该软件采用了多种处理方法来显示。s v g 出现以后，c o r e l d r a w 9 0 就提供了s v g 过滤器，可以摄好的显示含褒s v g 携网夏。 3 m a y u r a d r a w 36 2 m a y u r ad r a w 是m a y l l r a 公司推出的一种小巧的矢量图形制作工具，从3 6 2 版本开 始支持s v g 。m a y u r a d r a w 作为一种小型工蒸，支持的s v g 规范有浆，并且强先公弱 的市场簧略，很早就推出了m a y u md r a w36 2 ，此时w 3 c 正式的s v g 规范还没宵出 蠹，所借鉴豹不过是英3 胃跨的草案u 薅已，因此兼容往不强，输；的s v g 图像还不支 持交互、动画、链接以及脚本等高级功能。m a y u r a d r a w3 6 2 缺省的图像处理格式是 p d x 梅式，也再导) , i l l u s t r a t o r 的矢量图形稽式a i 文件，甚至还可醴插入位图作为内 嵌的点阵图像，绘制宪成后，可以导出s v g 格式的文档，内嵌的点阵图像作为个 矫部文件保存在s v g 文件相弼的目录下。 4 。b e a t w a r ee p i c t u r e 2 ，0 可以导 k l i l u s t r a t o r 格式的a i 文件、f r e e h a n d 格式和p h o t o s h o p 格式的p s d 文件， 并提供s v g 图像的输如。 5 g i l l ( g n o m ei l l u s t r a t i o na p p l i c a t i o n ) 提供导入编辑和导出s v g 文件的功能，并支持完整的d o m 接口。该软件是完垒 兔费豹，带有源代码，可鞋飘弼土下载。 1 。2 。1 3s v g 转换工具 1 ，b l a c k d i r tw m f 2 s v g 可以将w i n d o w s 位露元文件转换成8 v o 格式的文件。 2 。c s t r os v gt o o l k i t 可以将s v g 转换成j p e g 、p n g 和其他图形格式的一种命令行工具。 3 d i g i t a la p p l i c a t i o ns v g 2 p d f 可驻垮s v g 转换为p d f 格式浆文件。 华中科技大学硕士学位论文 4 f 1 a s h t o s v g 是英 n o t t i n g h a m 大学的产品，能够将s w f 文件转换为s v g 动画，但是需要f l a s h p l a y e r 的支持。 1 2 2x m l 解析器 x m l 是一种用来结构化文件信息的标记语言，x m l 规范中对于如何标记文件的 结构性有一个详细的法则，根据这组规则就可以创建标记语言。解析器就是根据这 些规则写出来的软件。解析器的主要功能就是检查x m l 文件是否有结构上的错误， 剥离x m l 的标记，读出正确的内容，再进行下一步处理。 同h t m l 一样，在浏览器中必须有h t m l 解析器，这样浏览器才能读懂各种使用 h t m l 标记所组成的网页，将其显示在我们面前。由于h t m l 的标记十分混乱，所以 解析起来很是麻烦。而x m l 规定了严格的语法和结构，所以x m l 解析起来相比容易 一些。 x m l 解析器解析x m l 文档，是建立在一定的解析模型基础上来阅读文档从而构 造元素和内容层次的。一般来说，x m l 解析器采用两种模型：线性模型s a x 和树状 模型d o m 2 2 , 2 3 】。 在w 3 c 中成立了专门从事d o m 标准化的工作组，1 9 9 8 年1 0 月d o ml e v e l1 成为 w 3 c 的标准，1 9 9 9 年1 2 月d o ml e v e l2 成为推荐标准，在2 0 0 0 年9 月1 号发布的d o m l e v e l3 标准的草稿扩展了d o m l e v e l2 。d o m l e v e ll 主要描述了三部分的内容：定 义了用于表达和操作结构化文档的接口和对象；接口和对象的语法，包括行为和属 性；接口和对象之间的关系。d o ml e v e l2 在其基础上增加的内容包括：文档的抽 象视图、对象树的遍历、层叠样式表等内容。d o m 的设计目标是成为一种独立于平 台和独立于语言的标准，所以工作组使用了对象管理组织( 0 m g ) 的接口定义语言 ( i d l ) 来定义d o m 接口，然后由各个不同的厂商来实现具体的接口，这样既统一 了标准，又使实现成为可能。 x m l 解析器可以用多种高级语言实现，也可以用于多种高级语言的二次开发。 这些语言包括：c 、c + + 、p e r l 和j a v a 等。c c + + 的x m l 解析器一般以d l l 和a c t v e x 6 华中科技大学硕士学位论文 麓形式笈商。在藉、篮注静c + + x m l 解橇器中，i b m 葳布豹x m l 4 c 2 彰嗡较大，微软 也发布了m s x m l 动态链按库，其中含有x m l 解析器。j a v a 的解析器一般以j a 艇包 缒形式笈毒，缝大藏分鄄蠢淫羁，菇势王盎v a 在x m l 酌解辑器使麓上毙e 陀+ + 枣耱褥 多 2 t 2 扪。 3 本文静磺舞重焘 s v g 是一个新推出的标准，所雌无论是浏览工其还是编辑工具都不是很多。但 是童予s v g 集x m l 帮矢量黼形优点于一旁，所戳应麓又十分广泛。由予备行备妲都 要绘制一些复杂而庞大的圈形，因此就需要在绘制时提供一些圈库，通过图库中定 义的圈元采绘制器监焉国。但是泰鬻主并甭存在这释工翼。 设计一个图糟编辑工具是很复杂的，涉及到许多图形变换、优化算法，而且为 了操证绘霸翡方爱链，还必须提供诲多霞莉工具来帮勖壤户。丽置要慧支持s v g ， 还要对它进行解析。所有遮些工作集中起来，就使得本系统显得过十庞大。为了保 涯系统瓣霹扩充谯窝虿攘护搓，设诗对采璃了瑟商对鬣瓣悉慧。通过葑装、继承鞠 组合等手段即提高灵活性，叉满足了复用性。在设计一些模块时，还运用了设计模 式静思想， 本文研究工作主要有： i 辩s v g 飙蒗进行分桁，班了解s v g 的特性，淄时熟悉了s v g 的语法规则，也 明白了解析s v g 文件所要究成的工作。对d o m 和s a x 进行了分析，得出了各自的优 煮帮缺煮。 2 通过面向对象的思想提出了一个基于s v g 的必量图形编辑模型，梅一个复 杂的系统捌分为若干个捂对独立静壤袭，通过各摸块游鬲工终来提供秘麓强丈韵应 用。并在此基础上，对各横块进行了分析和设计。 3 ，对智能连接进行了讨论，并阕述了系统为了保持连接信息所作静工作。 4 ，对$ a x 标准进行了研究；分援了s a x 览成的工作和剩下还需完成熬工作。黉 在此基础上提出了扩展的s a x 事件解析模型。 7 华中科技大学硕士学位论文 2s v g 规范和解析标准分析 本章首先分析了s v g 规范，对s v g 的优点和基本结构进行了简要描述。接着对 x m l 的两种解析标准d o m 和s a x 进行了讨论。 2 1s v g 规范分析 2 1 1s v g 简介 s v g 是一种基于x m l 的用来描述二维矢量图形和矢量点阵混合图形的置标语 言，其全称是可扩展的矢量图形( s c a l a b l ev e c t o rg r a p h i c s ) 。其中，“可扩展”( s c a l a b l e ) 一词在图形图像技术上指的是它不局限于一个固定的分辨率和大小，能在不同大小 的区域内正常或者比较正常的显示。在网络技术上，则用来形容一种特定的、拥有 众多用户的、有大量这种格式文件流行的、有许多应用程序支持的技术。s v g 作为 一种网络图形图像技术，既代表了它所生成的图形可伸缩，也意味着这项技术可扩 展。s v g 的可扩展性还体现在可重用上。“矢量”( v e c t o r ) 是指规范中描述了直线、 曲线、形状等几何图形，而无须像j p e g 等图像格式那样逐象素进行描述。“图形” ( g r a p h i c s ) 是指它提供了对矢量和矢量点阵混合图形的描述，因而它填补了大多 数基于x m l 的置标语言对复杂图形描述的空白。s v g 是图形、图像和文字的有机统 一，它提供了6 种类型的对象，其中包括矢量图形( v e c t o rg r a p h i cs h a p e ) 、图像 ( i m a g e ) 、渐变填充( g r a d i e n tf i l l i n g ) 、过滤器操作( f i l t e r ) 、可重用单元( r e u s a b l e c o m p o n e n t s ) 和文本( t e x t ) 1 , 1 7 】。 s v g 的绘图可以通过动态和交互式方式进行。s v g 不仅使用x l i n k 和x p o i n t e r 来 提供超链接功能，还定义了丰富的事件，这些事件可以应用于所有的图形对象。由 于s v g 支持脚本语言( s c r i p t ) ，因此高级网页制作者仅需进行简单的s c r i p t 编程， 来访i h - i s v gd o m 的元素和属性，即可响应特定的事件，从而提高了s v g 的动态和交 互性能。s v g 规范定义了s v g 的特征、语法和显示效果，其中包括x m l 命名空间 ( n a m e s p a c e ) 茅i j s v g 文档对象模型( d o m ) 。 正是由于矢量技术的引入，使得它具备了一些独特的优点： 8 华中科技大学硕士学位论文 1 能加快下载浏览速度。由于s v g 采用简单高效的矢量指令，即利用点和线的 描述来绘制图形。丽表现相同显示效果的位图，即便经过压缩后也会比它大得多， 这使得集成了s v g 的x m l 文档更小，因而下载速度也大大提高。基于这一显著优势， s v g 可以作为解决目前网上浏览瓶颈的最佳方案。 2 能获得更广泛的硬件支持。由于位图在不同分辨率的屏幕上显示效果不同， 且缩放后会出现锯齿和模糊效果，因此无法满足网页浏览的质量要求。而s v g 从较 低分辨率的便携式计算机到较高分辨率的台式机，再到高分辨率的打印机，都能提 供良好的视觉效果，这将大大提高w e b 应用，也是矢量技术所带来的技术上的突破。 3 能实现方便的图形定位与检索。通过使用x m l 灵活的标记特性，可以为图 形对象提供一定的语意，因而方便图形的搜索。 4 具有良好的可重用性。由于样式单在s v g 中扮演了重要角色，它便于矢量对 象在不同的页面中，以不同的外观显示，因而大大提高了元素的可重用性、可修改 性。 5 具有准确的颜色描述。s v g 支持在显示时，参照特定设备的描述文件来动态 地调整显示效果，且能够保证图形图像的颜色在跨网络传输后仍能够准确地显示。 2 1 2s v g 的基本结构 2 1 2 1 基本数据类型( b a s i cd a t at y p e s ) 在s v g 中，提供了许多数据类型f 17 】： 1 整型值是正号或负号后跟0 9 而没有带小数点的数值。一般来说其范围和一个 l o n g 型值的范围相同，但是有时不同的属性值规定不同，比如颜色值的最大值是2 5 5 。 2 一般就指带有小数点的值，同时也包括使用科学计数法所表示的值。推荐在s v g 复杂运算如坐标变换中使用，以避免精度不够而失真。 3 和 9 华中科技大学硕士学位论文 坐标值和长度值是一个后面可以紧跟单位的整型或者实型值。如果后面没有接 单位，就按照缺省单位来度量。如果后面接了单位，则是一个绝对距离。绝对距离 和显示设备的转换由s v g 客户端程序完成。 4 定义了一系列按顺序排列的同样类型的值。列表中的元素可以是任何类型。 5 ：一种特殊的 类型。 6 $ t l 如果一个整型和实型数据后接一个角度单位，那么这种组合就是一个角度值。 如果没有加单位，缺省角度单位为度。 颜色值在s v g 中通常给“c o l o r ”属性赋值，也用于“f i l l ”、“s t r o k e ”等属性 中。表达方式有数字法和r g b 方法，还可以通过关键字来描述。 7 绘图值是用来给“f i l l ”和“s t r o k e ”等属性来赋值的。绘图值的语法比较复杂， 在这里不加讨论。 8 百分值是实型值后面加一个“”的值，常用来表达一个相对的数值。许多属 性都允许百分值。 9 变换列表，后面有讨论。 1 0 ：频率值用来产生声音效果的值。 l1 ：时间值。实型值后加时间单位构成。 2 1 2 2 文档结构( d o c u m e n ts t r u c t u r e ) 让我们从s v g 的文档结构开始对s v g 有一个整体的印象。 一个s v g 片段由任意个数的包含在 标签中的s v g 段组成，这些段可以嵌 套。下面所示的是一个简单的s v g 文档【1 9 】： o 华中科技大学硕士学位论文 这段代码在白色背景上绘制四个大小不等的矩形，四个矩形用默认的黑色背景 填充。下面我们对s v g 文档结构进行分析： 第一行是x m l 的版本声明说黟 s v g 是一门基于x m l 的语言。 第二行到第四行指出了s v g 文件必须遵循的文档的语法规则。d t d ( d o c b m e n t t t y p ed e c l a r a t i o n ) 是用来定义x m l 文档的语法规则的文件。 第五行 这个标签说明这是一个s v g 文档。所有的绘图标签必须放在 和 , 之间。 标签是s v g 支持的基本图形一一矩形。通过 可以在画布上绘制一个 矩形。 2 1 2 3 样式( s t y l i n g ) 样式属性是s v g 的重要参数。样式定义了s v g 图元怎样被渲染。它被用来： 1 描述一个对象怎样被绘制。像线条颜色、线宽、线型、填充色等等。 2 定义文本参数，如字体类别、字体大小、字体等等。 3 对图元的渲染结果产生影响，如剪切路径、蒙板、滤镜等。 华中科技欠学硕士学位论文 s v g 熬徉式攥健在摄大程瘦上与c s s 帮x s l 类织。 2 1 2 4 嫩标系统( c o o r d i n a t es y s t e m s ) 在s v g 孛，“蕊布”怒指可醴裢里面绘制s v g 圈形的区域。画布魁无限大的区 域，但是我们总在一个有限的区域内绘制，这个区域就是s v g 视区( v i e w p o r t ) 。 榄嚣豹尺寸由s v g 文件和它的父文档莛嗣决定。一个棍区通道离度和宽度两个属性 来描述。 蕊隧有两个堂标系：税区坐标系和用户强标系。初始化时。这两个坐标系激点 与视区原点重合，一个单位长度就强一个像豢。但用户可以任意定义新的用户坐标 系。 2 1 2 5 路径( p a t h s ) 路径是一个翻形的轮廓，可班对路径描述的图形进行勾边、填色、或把它作为 翦切路径使用，也可以把邀三者进行组合。路径是通过“当前点”的概念来描述鸵。 这很像是用笔在鳜上画图+ 当前点就是笔酌靛置，随着笔在羝上穆动，条“路径” 就被画出来了。使用路径，可以定义任何想要的图形。将多条独立的路径组合起来， 就形成了组舍路径，可强擒述更加复杂静围彤。 2 1 。2 6 基本形状( b a s i cs h a p e s ) 在s v g 中支持的基本几何图形霄：矩形、圆、椭圆、直线、折线和多边形。这 些基本图形也可以通过( p a t h 标签来构造，弗且用于 属性都可以用于基本 图形。 2 。 。2 7 文本( t e x t ) s v g 巾，文本足作为豳形处理的。文本和其它图掰元素没什么区别，用法也差 不多，嚣照像坐搽变换、壤宠、剪惦、蒙援这些特 生也霹用于文奉。一好文本群鞋 被渲染成普通的鬣线形，也可以按照某一路径渲染。比如把一行文本写成一个嘲， 残写成波浪状等。s v g 支持番种字体积字号，农支持文本的攘搀或竖接，扶是到奄、 从右到左藏双向混合的排列。另一擀面，s v g 文本同时也是x m l 数据，因此具有以 下特性：可以透过某种方式( 如转按为语音) 被育视赏障碍的人阕洼；在大多数愦 华中科技大学硕士学位论文 况下，可以魅甲，通过系统剪贴板复制；x m l 的搜常引擎可以像对其它x m l 数据一 样鹫s v g 文本超作爰。 2 1 。2 8 填色( p a i n t i n g f i l l i n ga n ds t r o k i n g ) s v g 支持用几种不同的模式对豳彤和文率进行填色：单一色：变色( 绒性渐变 霰技射妖海变) ；慝慕填充( 焉矢曩嚣戴鹫像平镝壤琶) ；鑫定义壤充。 2 2x m l 麟橱标准分析 2 2 1 文档对象模型( d o m ) d o m ( d o c u m e n to b j e c tm o d e l ) 是w 3 c 撬供潮魏x m l 文档酌一种树牧搂型。在 应用程序中，基于d o m 的x m l 解析器：瞎一个x m l 文档转化为个慰象模型的集台 ( 运鬻称巍d o m 树) ，正遥通过对这巾对象摸墅莳撩作，来实现对x m l 文档数据的 操 乍。通过d o m 接口，应用程序可以在任何慰傧访润x 2 v i l 文档中经悸一部分数据， 因此，这种利嗣d o m 绥口的机制也被称为随机访问机制。 d o m 接口提撰了一释蘧过分星对象模型来济闻x m l 文橙信息斡方式，这些分精 对象模型依据x m l 文档结构形成一棵节点树。无论x m l 描述的是什么类型f q 信息， 翮鬻d o m 稽所生藏翡模壁帮是节点辚鹊形式。氇就是说，d o m 强制使用莉模型来访 问x m l 文档中的信息。出于x m l 本质土就是一种分屡结构。所以这釉搓述方法是挑 刍舂效韵1 8 。 2 , 2 2 赞单瘦用程序接口( s a x ) s a x ( s i m p l ea p i sf o rx m l ) 提供的访问模式是一种顺序模式，也就愚一种线 幢文稿处理模囊。当使矮s a x 耪析器对x 琵文档避行分轿时会翘靛一系刊的事件， 并激滔相应的零件处璎函数，应用程序通过剥这些事件处理霹数来实现对x m l 文档 抟访阊，强诧s a x 接口也棱舔为事释驱动按弱。 鸯予事件触发妁本鸯是有酵序黪，因姥，s a y 箍供戆是一耪愆痔谤楚机溅。刭 于已经分析过的部分，不能再倒回去萋新处域。s a x 2 所以叫做简单应用程序接口， 是嚣为s a x 群辑器只馓了些筒荸的工作，太帮分豹工律惩要瘟用程序窘基去骰。 也就是既，s a x 解析嚣在实现时，它只是顺序的检餐x m l 文档中的字节流，判断当 华中科技大学硕士学位论文 前字节是x m l 语法中的哪部分、是否符合x m l 的语法，然后再触发相应的事件， 而事件处理函数本身则要应用程序自己去实现。 2 2 3d o m 和s a x 性能分析 d o m 树所提供的随机访问方式给应用程序的开发带来了很大的灵活性，它可以 任意的控制整个x m l 文档中的内容。然而，由于d o m 解析器把整个x m l 文档转为 d o m 树放在内存中，因此，当文档比较大或者结构比较复杂时，对内存的需求就比 较高。而且，对结构复杂的树的遍历也是一项耗时的工作。所以d o m 解析器对机器 性能的要求比较高，实现效率不是很理想。但是，由于d o m 解析器采用的树形结构 的思想与x m l 文档的结构相吻合，同时鉴于随机访问所带来的方便，因此，d o m 解 析器还是有很广泛的使用价值。 同d o m 相比，s a x 解析器缺乏灵活性。然而，s a x 解析器没有把整个文档放在 内存中，故文档的大小和复杂程度都不会影响s a x 解析器的性能，实现效率高。s a x 允许用户任何时候中止文档的解析，这就使得处理文档部分信息成为可能，解析可 在得到某些特定的信息后中止，这一特性使得系统资源得到较大的优化。 2 3 小结 本章是全文的基础。要想一个系统支持s v g 文件格式，就必须对s v g 有所了解。 所以本章首先分析了s v g 规范，介绍了s v g 的优点并着重分析了s v g 的基本结构。 由于s v g 是基于x m l 文本格式的，必须通过解析才可以识别，所以在本章第二节介 绍了x m l 的解析标准d o m 和s a x ，并对两种标准进行了分析。 4 华中科技大学硕士学位论文 3 基于s v g 的矢量图形编辑框架( v g s ) 本章首先提出了基于s v g 的矢量图形编辑框架，并在此基础上，对系统的各个 部分的功能进行了初步探讨。最后简要的论述了各功能模块是如何共同协作来提供 系统服务的。 3 1 v g s 系统框架 矢量图形编辑系统v g s ( v e c t o rg r a p h i c ss y s t e m ) 是一个独立于具体应用的通 用矢量图形编辑环境。该系统采用面向对象的方法，将图形所包含的各种图形对象 定义为图元( e l e m e n t ) ，并将各种图元进行分类组织，形成图元库。在绘制图形时， 可以利用图元库中的图元进行组合，从而以较好的可重用性和较高的生产效率生成 所需的图形。当图形绘制完成后，可以设置图形中图元的属性，使之与现实中具体 的物理设备相关联。矢量图形编辑系统目前支持最具应用前景的s v g 文件格式，非 常适合在i n t e r n e t 上发布。从i n t e r n e t 上发布图形文件后，利用采集到的物理设备的参 数数据，实时的动态的改变图元的显示形态【2 6 2 8 1 。v g s 的系统框架如图3 1 所示： i l数据管理器模块 上 i图形模块 t i图形工具模块 输 入 输 出 模 块 图3 1v g s 系统框架 3 2v g s 模块功能分析和设计 v g s 系统由七个主要模块构成，每个模块又可以划分为若干个子模块。 3 2 1 图形模块 3 2 1 1 图形模块的功能 图形模块是其他模块的基础。它的主要功能有以下几点： 华中科技大学硕士学位论文 1 定义了基本图形、图元和文字的类层次关系 其中支持的基本图形有直线、点、矩形、折线、多边形、椭圆、圆、圆弧和曲 线几种。它们之间的类层次如图3 2 所示： 图3 2 图形类继承关系图 2 。定义了图形的矢量存储方法 矢量图形和位图的区别主要是存储格式的不同，而造成了其所表现的功能不同。 矢量图形格式仅仅保存图形的关键点的信息，位图是保存图形的每个象素点的信息， 所以当放大图形尺寸时，由于位图保存的信息有限，而造成了图形的失真，但是矢 量图形则不同，当图形放大时，通过图形的特点，计算出图形新的关键点，再通过 新的关键点而画出矢量图，只要计算规则适当，就不会发生图形的失真现象。矢量 图形描述如表3 1 所示1 2 ”。 通过面向对象的方法，把这