资源描述：
《svg动画编程及其应用34278new》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。
1、2005年5月汕头大学学报(自然科学版)第20卷第2期May2005JournalofShantouUniversity(NaturalScience)Vol120No12文章编号:100124217(2005)0220069206SVG动画编程及其应用1,21张杰,刘晓平(1.合肥工业大学计算机与信息学院可视化与协同计算(VCC)研究室,安徽合肥230009;2.汕头大学计算机系,广东汕头515063)摘要:分析了SVG图形技术、SVG动画模型与DOM、SMIL、SIMLANIM的关系以及SVG简单动画及复杂动画的常用种类及其实现方法,并给
2、出SVG动画在机械领域的应用实例.关键词:SVG;SMIL;动画中图分类号:TP391文献标识码:A0引言由万维联盟W3C推出的SVG(ScalableVectorGraphics)技术可用来生成二维的图形、动画,随着SVG技术的成熟,越来越多的研究人员在各自的研究工作中采用了SVG,[1]自2002年开始的每年一届的SVG大会促进了SVG的应用.国内外的SVG应用主要是在网络地图方面,武汉大学是国内SVG研究及应用的主要单位,多个武汉大学研究团队借助于校内的国家重点实验室,完成了多个基于SVG[2,3][4]的地理信息应用,华中科技大学也将
3、SVG应用于电力信息模型.SVG技术也可应[5,6]用到工程设计等领域.作者所在的网络图形应用研究小组主要研究如何应用SVG及X3D技术编写三维动画制作软件,软件应用了X3D、SVG、XML、DOM、数据库、JAVA等技术,应用最新的概念和方法实现过去很难实现或必须通过昂贵专用软件才能实现的二维、三维动画及交互应用功能.作为研究工作的一部分,本文主要介绍SVG动画编程方法,并通过典型例子介绍如何将SVG动画应用到机械领域.1SVG图形技术SVG是近几年来主要用于网络的、开放的二维向量图形技术,通过在网络浏览器上安装SVG插件,可在网页上显示S
4、VG文档的图形、动画及实现交互效果,也可以在一些独立的应用程序中应用JAVA、C++等语言处理SVG文档,生成二维向量形式的图收稿日期:2004-07-14作者简介:张杰(1963～),男,安徽芜湖人,博士生,副教授.基金项目:国家自然科学基金资助项目(No:60273044)70汕头大学学报(自然科学版)第20卷形、动画及交互内容.SVG经历了SVG110、SVG111和SVG112三个阶段.其中,SVG110是SVG技术的初始版本,目前已停止发展;SVG111是目前使用的版本,还在不断更新,截止到2004年5月15日,SVG111最新版本
5、是2003年1月14日发布的;SVG112是SVG下一个版本.SVG文档为XML(ExtensibleMarkupLanguage)格式,可以将XML、XSLT等技术及大量相关软件应用到SVG领域.SVG文档内可插入Javascript程序段,也可由外部Javascript程序控制SVG文档.编写由Javascript、JAVA等程序控制的SVG文档需要了解和掌握DOM规范.SVG文档的基本组成部分是元素(Element),SVG定义了多种类型的元素,例如,定义了6种基本形体元素:圆,椭圆,矩形,线,折线,多边形.复杂形体或曲线可以由path
6、元素生成.SVG的事件模型结合SVG的动画功能,可用来编写交互应用(如二维图形游戏).最新的SVG112标准草案使人们得以处理声音、视频等多媒体内容.SVG作为W3C组织开发的、基于XML的、纯文本格式的技术,其开放特性使得人们可以根据需要应用在图形生成、动画及交互操作等方面.SVG可借助于Javascript、JAVA等语言处理图形文档,构造出动态、逼真的二维图形效果.由于SVG和VRML(X3D)同为基于XML的网络图形技术,可相互传递信息及数据,为复杂的图形应用奠定了基础.2SVG动画与SMIL,SMILANIM,DOM的关系211SV
7、G动画与SMIL的关系SVG动画模块是SVG工作组与SYMM(W3CSynchronizedMultimedia)工作组合作开发出来的,SYMM工作组开发了SMIL(SynchronizedMultimediaIntegrationLanguage)标准,用来在网页上展示各种多媒体内容,包括SVG格式的内容.SMIL110没有动画模块,SMIL210增添了动画模块.SMIL定义有4个基本动画元素:animate,set,animateMotion,animateColor.这些元素有一般的属性,如from,to,values等,也有用于样条动
8、画(Splin2eAnimation)的专用属性,如path,keyTimes,keySplines.212SVG与SMILANIM的关系[7]SMILANIM是S
