(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf_第1页
(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf_第2页
(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf_第3页
(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf_第4页
(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf_第5页
已阅读5页,还剩76页未读 继续免费阅读

(计算机科学与技术专业论文)富媒体电视投票系统的设计与实现.pdf.pdf 免费下载

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

,lfjij1 包含其他人已经发表或撰写过的研究成果,也不包含为获得北京邮电大学或其他 教育机构的学位或证书而使用过的材料。与我一同工作的同志对本研究所做的任 何贡献均已在论文中作了明确的说明并表示了谢意。 申请学位论文与资料若有不实之处, 本人签名: 扭宝宝 本人承担一切相关责任。 r 期:兰! ! ! :! :z 0 关于论文使用授权的说明 学位论文作者完全了解北京邮电大学有关保留和使用学位论文的规定,即: 研究生在校攻读学位期间论文工作的知识产权单位属北京邮电大学。学校有 权保留并向国家有关部门或机构送交论文的复印件和磁盘,允许学位论文被 查阅和借阅:学校可以公布学位论文的全部或部分内容,可以允许采用影印、 缩印或其它复制手段保存、汇编学位论文。( 保密的学位论文在解密后遵守 此规定) 保密论文注释:本学位论文属于保密在一年解密后适用本授权书。非保密论 文注释:本学位 本人签名: 导师签名: 适用本授权书。 1 7 tj 朝鲨! 里:f ! 垄 日期:砬 垒。l 迦 f 争八 毋刊 北京邮电大学硕士研究生学位论文富媒体电视投票系统的设计与实现 富媒体电视投票系统的设计与实现 摘要 随着互联网的发展,传统多媒体技术己渐渐难以满足用户日益增长的需求。 而增加了丰富交互性的富媒体的出现,为传统互联网广告带来了革命性的变化。 同时,随着移动多媒体业务的发展,富媒体也将在移动平台上有越来越广阔的应 用前景。 本文阐述了富媒体系统所具有的基本架构,以及富媒体技术所关注的关键技 术。在分析和比较了当前较为流行的几种与富媒体有关的公开标准之后,采用了 l a s e r 这一涵盖了富媒体端到端服务的标准作为本文设计的富媒体系统所遵循 的基本标准。本文利用开源多媒体框架g p a c ,基于l a s e r 标准设计了富媒体 系统的客户端与服务器模块。其中客户端模块包括了对接收的媒体流的重新排序 和解析、对各种音视频以及场景文件的播放与同步,以及对脚本交互事件的处理。 服务器模块包括业务处理模块、场景处理模块、场景下发模块和媒体发送模块等。 同时实现了按照时间将s v g 文档分割为l a s e r 相应新增更新插入等命令这一 技术细节,并在此系统上设计实现了电视投票业务。最后,本文采用了流媒体服 务器端到端地验证了该系统的正确性,且能够看到电视投票业务在该系统上运行 状况良好。 关键词:富媒体l a s e r 电视投票系统 卜r j_ j _ d e s i g na n di m p l e m e n t a t i o no f r i c hm e d i a t e l e v i s i o nv o t i n gs y s t e m a b s t r a c t w i t ht h ed e v e l o p m e n to fi n t e r n e t ,t h et r a d i t i o n a lm u l t i m e d i ah a sb e e ng r a d u a l l y d i f f i c u l tt om e e tt h eg r o w i n gd e m a n do fu s e r s t h u s ,a i l e wm e d i aw i t hr i c h i n t e r a c t i v i t yc a l l e dr i c hm e d i ae m e r g e s i tb r i n g s ar e v o l u t i o n a r yc h a n g ef o rt h e t r a d i t i o n a li n t e r n e ta d v e r t i s i n g m e a n w h i l e ,w i t ht h el a u n c h i n go fm o b i l em u l t i m e d i a s e r v i c e s ,r i c hm e d i aw i l lh a v ew i d ea p p l i c a t i o n so nm o b i l ep l a t f o r m n i st h e s i si n t r o d u c e st h eb a s i cs t r u c t u r eo fr i c hm e d i as y s t e m ,a sw e l la st h e r e l a t e dt e c h n o l o g y a f t e rt h ea n a l y s i sa n dc o m p a r i s o no fs e v e r a lp o p u l a ro p e n s t a n d a r d sa s s o c i a t e dw i t hr i c hm e d i a ,w ed e s i g no u rs y s t e mf o l l o w i n gl a s e r ,w h i c h i sa ne n d t o e n dr i c hm e d i as y s t e ms t a n d a r d b yu s i n ga no p e n _ s o u r c em u l t i m e d i a 行a m e w o r ks o f t w a r en a m e dg p a c ,a n db a s e do nl a s e r ,o u rr i c hm e d i as y s t e m i n c l u d e sc l i e n ta n ds e r v e r m o d u l e s c l i e n tm o d u l ei n c l u d e s m e d i as t r e a m r e a r r a n g e m e n ta n da n a l y s i s ,t h ep l a y b a c ka n ds y n c h r o n i z a t i o no fs c e n ef i l e s a n da v a r i e t yo fa u d i oa n dv i d e o ,a l o n gw i t ht h es c r i p te v e n tp r o c e s s i n g s e r v e rm o d u l e i n c l u d e sb u s i n e s sp r o c e s s i n gm o d u l e ,s c e n ea n a l y s i s a n ds e n d i n gm o d u l e ,m e d i a s e n d i n gm o d u l ea n ds 0o n w ea l s oa c h i e v et h es e g m e n t a t i o no f s v gd o c u m e n t si n t o l a s e rc o m m 柚d si na c c o r d a n c ew i t ht i m e b a s e do i lt h i ss y s t e mw ed e s i g na n d i m p l e m e n tat e l e v i s i o nv o t i n ga p p l i c a t i o n f i n a l l y ,u s i n ga s t r e a m i n gm e d i as e r v e rw e v e r i f vt h ec o r r e c t n e s so ft h i se n d - t o - e n ds y s t e m ,a n dt h et vv o t i n gs e r v i c e sc a nr u i l w e l lo nt h es y s t e m k e yw o r d s :r i c hm e d i a , l a s e r , t e l e v i s o nv o t i n gs y s t e m i l 北京邮电人学硕:j :研究生学位论文 富媒体电视投票系统的设计与实现 第一章 1 1 1 2 1 3 1 4 第二章 2 1 2 2 2 3 第三章 3 1 3 2 3 3 3 4 3 5 目录 弓i 言1 课题研究背景1 移动富媒体应用。1 课题研究意义与目的3 论文内容与组织4 富媒体技术研究5 富媒体服务简介5 2 1 1 富媒体的概念5 2 1 2 富媒体系统5 2 1 3 富媒体关键技术5 2 1 4 富媒体相关公开标准介绍6 s v g 技术7 2 2 1s v g 的概念和特点7 2 2 2 s v g 版本8 2 2 3s v g 语法简介【8 】【9 】。9 2 2 4s v g 解析器1 4 2 2 5s v g 显示和开发工具1 8 l a s e r 技术。1 8 2 3 1l a s e r 主要内容1 9 2 3 2s a f 主要内容。2 1 2 3 3改良后的l a s e r 与其它标准的比较2 2 富媒体电视投票系统设计2 3 总体设计2 3 电视投票业务流程设计2 3 服务器设计2 5 3 3 1 场景处理模块2 8 3 3 2 业务逻辑处理模块3 l 3 3 3 场景下发模块3 1 3 3 4 媒体发送模块3 2 3 3 5客户数据处理模块。3 2 客户端设计3 2 传输机制3 5 i l l 北京邮电人学硕上研究生学位论文 富媒体电视投票系统的设计上j 实现 3 5 1 富媒体采用的传输协议栈3 6 3 5 2使用h 订p 协议的富媒体下载方式3 7 3 5 3 使用r t p r t s p 协议的富媒体实时流3 7 第四章场景的分割与l a s e r 场景命令生成3 9 4 1s v g 文档分割3 9 4 1 1s v g 文档基本结构3 9 4 1 2s v g 文档的计时方法分析3 9 4 1 3s v g 文档分割算法4 0 4 2l a s e r 命令生成4 5 4 2 1l a s e r 命令的x m l 形式4 5 4 2 2l a s e r 命令获取算法4 6 第五章系统实现4 9 5 1 基于g p a c 的富媒体系统搭建4 9 5 1 1g p a c 简介。4 9 5 1 2g p a c 各个组成部分一4 9 5 1 3 g p a c 的编译一5 0 5 1 4g p a c 在富媒体系统中的使用。5 3 5 2 场景的实现与效果5 5 5 2 1 初始场景5 6 5 2 2 投票场景5 7 5 2 3 脚本事件的实现6 0 5 3 场景分割后结果6 1 5 4 远程播放的实现6 2 5 5 性能分析6 3 第六章总结与展望。6 5 参考文献6 6 附录6 8 缩略语对照表6 8 致谢7 0 作者攻读学位期问发表的学术论文目录7 l i v 北京邮电大学硕l j 研究生学位论文 富媒体电视投票系统的设计与实现 1 1 课题研究背景 第一章引言 随着互联网技术的迅速发展,只包括视频、音频、图像、文本、动画等内容 的传统多媒体技术已渐渐难以满足用户的日益增长的需求。于是,在约二十年前, 富媒体( r i c hm e d i a ) 这一新的媒体形式在国外兴起。富媒体与传统媒体技术的 最大区别就在于:多媒体应用一般缺乏交互性,而富媒体却增加了交互性的概念, 提高了受众的参与度,从而改善了用户体验。富媒体一经出现,即为传统网络广 告界带来革命性的变化。同时我们可以看见其具有非常广阔的发展前景:不仅仅 是互联网页面,它还在向其它媒体平台扩展。 从2 0 0 3 年开始,随着移动数据服务的普及、手机性能的提高、数字电视技 术的发展和移动网络的不断健全,美国、日本等各国的主要运营商纷纷推出了移 动电视( 俗称手机电视) 的服务。而在我国,自2 0 0 6 年3 月以来,中国移动和 中国联通公司也相继推出了移动电视服务。2 0 0 6 年1 0 月,国家广播电影电视总 局正式颁布了自主研发的移动多媒体广播行业标准,2 0 0 7 年完成了从发射到接 收的全部设备的产业化,2 0 0 8 年进入到组网试验阶段。移动运营商们已经不仅 将移动电视服务作为数据服务业务的新增长点,而且将其视为3 g 网络的主打服 务l l j 。在这一趋势中,多业务融合、提供交互性和个性化是移动多媒体业务未来 的主流发展方向。而富媒体结合文本、图形、图像、音频、视频及动态脚本技术, 能够通过定制提供内容更加丰富、交互性及个性化更强的多媒体增值业务。因此, 系统化的富媒体技术研究将是开展各类多媒体互动增值业务研究的重要基础。 1 2 移动富媒体应用 手机上的富媒体有丰富的应用,国外已有一些相关研究,包括一些相关标准 和应用。下面列举了一些以l a s e r 标准为基础的目标应用1 2 】: 交互式移动电视:交互式移动电视不仅是手机上的电视,它还增加了交互式 服务并使观众有更多的选择和控制。不管是在上班途中看新闻,或者是在赶回家 的路上看比赛,用户可以在任何时间或地点用任意的方式观看电视。交互式电视 为移动运营商、内容供应商以及广播公司提供了新的市场机遇:当富媒体改变顾 客使用电视和视频点播服务的方式并成为新的商业模式时,它将带来新的收入来 北京 手机门户网站:对于移动运营商和虚拟网络运营商来说,手机门户网站对于 他们的长期成功是很关键的。它能创造新的收入来源,增加订阅,并且是消费者 保持忠诚度的重要原因。一流的手机门户网站应该是当用户想要什么,则为他们 提供什么。在近期的研究中,n i e l s e nn o r m a ng r o u p 跟踪了一周移动用户的体验。 用户说,虽然他们知道在移动门户网站上的信息会跟互联网上的不同,但他们还 是希望找到相同的信息。而对百分之九十的用户来 兑,事实并非如此。富媒体门 户网站在解决结合文本、图像、音频、视频、以及结合在线和本地内容以建立有 效的网页这方面,还有很长的路要走。 磊 臂瓣 t 女铷错 鬈铹 绒i 缔 酗 艺冀】a 巴= = 3e :e 匿z 0 e = = 3 墨口懿= = c = 黼 繇p 一_ 蝴一, 霹燃蛐一,z ( a ) 交互式移动电视 ( b ) 音乐自动点唱机( c ) 手机门户 图1 - 1 富媒体目标应用( 一) 动态用户界面:富媒体用户界面增强了品牌效应,并推进了移动门户和服务 的使用。它给移动运营商和设备商的移动设备提供了一个单一的、统一的抽象层, 支持垂直应用和富媒体门户。使用可配置的部件,运营商可以让客户直接访问特 定的服务和应用。 事件微型站点:作为促进品牌意识和发展一对一客户关系的手段,移动营销 正在逐渐成熟。为不同类型的用户精心量身定做的市场营销活动不仅产生商业活 动,而且优化用户体验。现在,多媒体手机有更宽的屏幕并且支持网络视频流, 2 虢篓- 冀茹熏 o 北京邮电人学硕1 :研究生学位论文富媒体电视投票系统的设计与实现 移动营销需要不仅仅限于“推”活动或互动短信测验,新的方式将邀请用户与包 含音乐和视频的富媒体内容进行互动。 富媒体广告:在线互动交流是当今广告业增长最快的部分。通过使品牌和媒 体公司用广告推销和投资他们的内容,移动服务正成为成功的商业模式。富媒体 技术平台使广告人改进移动广告的质量和互动性,并利用目标客户的特点,优化 用户体验和移动广告的准确性、个性化和广告划分。 。* o ( d ) 动态用户界面( e ) 事件微型站点富媒体广告 图1 2 富媒体目标应用( - - ) 1 3 课题研究意义与目的 手机上的富媒体应用与互联网上的有许多不同:目前大部分手机中的软件系 统还是一个封闭系统,无法进行丰富的手机应用开发,也没有充分考虑到移动数 据业务的用户体验。为了改善用户体验,满足用户需求,嵌入式移动富媒体应用 显得尤为重要。前期的富媒体技术主要有h t m l 、j a v as c r i p t s 、f l a s h 等等。其 中f l a s h 得到了最为广泛的应用,其利用独特的时间片段分割( t i m e l i n e ) 和重 组( m c 嵌套) 技术,结合a c t i o n s c r i p t 的对象和流程控制,实现了灵活的界面 设计和动画设计。f l a s h 具有跨平台的特性,可以保证同样的内容在不同终端的 最终显示效果的一致。主要的应用有动画、游戏、用户界面和丰富的w e b 应用 程序等等。f l a s h 是在p c 机上占主导位置的标准,在移动设备上也有部分应用。 比如a d o b e 基于h a s h 技术给出的运营商的移动富媒体解决方案f l a s h c a s t h o m e ,通过在终端定义特定的手机门户来将实时或离线数据服务传送给用 户。但是f l a s h 是私有标准,对其推广和研究起到一定阻碍作用。 移动终端富媒体设计相比于p c 机具有更多的困难:传输带宽有限;由于电 池电源有限,移动设备如手机的处理器处理能力都受到限制;同时受体积小的限 制,手机的存储空间有限,而且其屏幕、键盘都较小,可进行的操作有限。这些 3 北京邮电人学硕l j 研究生学位论文 富媒体电视投票系统的设计与实现 都是移动富媒体技术需要面临的问题。 我国虽然在富媒体技术研究上起步较晚,但对富媒体的各种应用的需求却在 不断增长。目前国外已有成型的公开技术标准m p e g 组织的l a s e r ( l i g h t w e i g h t a p p l i c a t i o ns c e n er e p r e s e n t a t i o n ) 和3 g p p 组织的d i m s ( d y n a m i ca n di n t e r a c t i v e m u l t i m e d i as c e n e s ) ,以及其它的私有技术如a d o b e 公司的f l a s hl i t e 等。而我国 却缺少成熟的专利技术。因此我们迫切需要系统地研究自已的嵌入式富媒体技 术。 利用富媒体技术实现的电视投票系统可以作为验证富媒体系统的一个典型 应用。因此本文通过讨论在p c 环境罩模拟移动设备上富媒体电视投票系统的设 计与实现,为以后富媒体技术的进一步研究提供了参考。 1 4 论文内容与组织 本文首先介绍了富媒体的一般系统架构和技术点,分析比较了几种富媒体标 准的特点,其中重点是l a s e r 技术。接着详细描述了基于l a s e r 标准的富媒体 服务器和播放器的设计,并在借助开源多媒体框架g p a c 的基础上实现了此系 统。最后对本次工作作出了总结与未来展望。 本文的具体结构安排如下: 第一章介绍本论文课题的研究背景和发展现况,然后简单地阐述了这个课题 的研究目的和意义,最后概述了本文的研究内容和论文的结构安排。 第二章简述了富媒体的基本概念、系统架构和关键技术,简要介绍了现行公 开富媒体标准,最后着重介绍了s v g 标准、l a s e r 标准和s a f 协议栈。 第三章介绍了富媒体系统的各个模块的设计,包括应用业务、服务器端、客 户端的设计以及传输机制的选择。 第四章介绍了s v g 场景分割算法和l a s e r 场景命令的生成算法。 第五章着重介绍了电视投票场景以及富媒体系统的实现与结论分析。 第六章对所做的工作进行总结,并对后续工作做出了展望。 4 北京邮电大学硕士研究生学位论文 _ - - _ _ _ _ _ _ _ _ _ _ _ _ - 。_ 。一1 。_ 。一 富媒体电视投票系统的设计与实现 第二章富媒体技术研究 2 1富媒体服务简介 2 1 1 富媒体的概念 富媒体是指具有视频、音频、图像、文本、动画等多种丰富媒体以及交互性 信息的传播方式。富媒体与传统媒体技术的区别就在于:多媒体应用一般交互性 有限,而富媒体增加了用户与呈现内容之间的丰富互动性;传统媒体的传播模式 采用的是单向式传输,信息发布者将媒体信息传给受众后,传播就结束了,而富 媒体则可以在发布者和受众之间进行双向通信,使得受众与媒体之间、受众与信 息发布者之间以及受众与受众之间都能够进行交流互动,提高受众的参与度,从 而改善了用户体验。 2 1 2 富媒体系统 富媒体系统可以表示为一个客户杌服务器( c s ) 架构,它主要由三个部分 组成:富媒体服务器、传输机制和富媒体客户端【引。如图2 1 所示,富媒体内容 由场景描述信息、离散媒体( 如图像) 和连续媒体( 如音频、视频) 组成,服务 器是这些内容的输入端。场景描述信息可以通过场景更新信息来动态地被改变。 富媒体内容可以和媒体同步信息、原数据以及提示轨一起被封装进一个容器格 式,然后被打包传输。在传输机制方面,此系统利用多种一对一、一对多的传输 机制来下载、渐进下载和流式传输各种场景。客户端播放这些富媒体内容,并且 允许本地和远程的回馈和数据请求。 2 1 3 富媒体关键技术 从富媒体系统的一般架构中,我们可以看出有以下几个关键技术需要解决: 场景描述:描述富媒体内容中各种媒体元素( 音频、视频、图片、图形、文 本) 空间和时间分布的方法。目前主流的场景描述方法采用的标准是w 3 c 定义 的s v g 标准。 5 北京邮电大学硕士研究生学位论文富媒体电视投票系统的设计与实现 图2 - 1 富媒体系统的一股架构 场景更新t 解决如何实现从一个场景更新到另一个场景的问题。在m p e g 组织制定的l a s e r 标准中,定义了一套场景更新的命令,用以实现场景切换和 场景元素复用的问题。3 g p p 的d i m s 标准建立在其基础上,对其进行了优化。 封装和传输:解决如何将多种媒体元素封装流化并传输的问题。在l a s e r 标准中定义了一种名为s a f 的二进制封装格式,可以灵活地映射到r t p t s 等传 输流上。d i m s 标准定义了如何在r t p 上封装传输富媒体内容。 交互方法:解决用户与多媒体内容间的交互问题。富媒体内容可以通过嵌入 脚本,执行程序等实现交互操作。 2 1 4 富媒体相关公开标准介绍 m p e g 4b i f s ( b i n a r yf o r m a tf o rs c e n e s ,二进制场景格式) ,m p e g - 4 标准 的第1 1 部分,是m p e g 组织最先尝试对富媒体进行合成编码的标准,它包含有 2 d 、3 d 图形对象的媒体内容创建、场景不断更新机制以及场景中的媒体数据严 格同步等。 s m i l ( s y n c h r o n i z e dm u l t i m e d i ai n t e g r a t i o nl a n g u a g e ,同步多媒体集成语言) 【4 1 ,1 9 9 8 年它即成为w 3 c 标准,是一种用于描述视听呈现的语言,用于精细编 制多媒体呈现,以此实时地组合视频、音频、文本以及图形,进行同步控制。它 是使用可扩展标记语言编写的语言,具有严格的格式和良好的可移植性。2 0 0 5 年1 2 月s m i l 的2 1 版本发布。 s v g ( s c a l a b l ev e c t o rg r a p h i c s ,可伸缩矢量图形) ,是由w 3 c 制定的基于 可扩展标记语言来描述二维矢量图型的一个开放标准。 6 北京邮电大学硕j :研究生学位论文 富媒体电视投票系统的设计与实现 l a s e r ( l i g h t w e i g h ta p p l i c a t i o ns c e n er e p r e s e n t a t i o n ,轻量级场景描述) i 副, m p e g 4l a s e r 是m p e g 组织针对移动富媒体制定的标准。l a s e r 最大的特点 是使用s v g 和s m i l 进行场景描述,并且包含整个端到端的富媒体发布链条: 简单的内容创建、优化的数据传输和增强的媒体播放,这些都使其更适合于移动 多媒体服务。此标准一直在不断改进中,并拥有两个实际应用产品:法国的 s t r e a m e z z o ( w w w s t r e a m e z z o t o m ) t 2 j 和韩国的p i n e o n e ( w w w p i n e c o m ) 1 7 1 。这两个 产品都是端到端的,包括在各种移动设备和平台上的l a s e r 播放器,l a s e r 内 容服务器和流化器,以及l a s e r 创作软件等。 d i m s ( d y n a m i ca n di n t e r a c t i v em u l t i m e d i as c e n e s ,动态交互多媒体场景) 1 3 】 标准是在l a s e r 、m o r e ( m o b i l eo p e nr i c hm e d i ae n v i r o n m e n t ,移动开放式富 媒体环境) 【6 】等交互技术的基础上发展出来的一种新技术。该标准隶属于3 g p p s a 4 工作组,主要是在l a s e r 技术的基础上对其进行扩充和完善,在某种程度 上是l a s e r 的主导公司s t r e a m e z z o 在3 g p p 推广l a s e r 的产物。 2 2 s v g 技术 2 2 1s v g 的概念和特点 s v g ( s c a l a b l ev e c t o rg r a p h i c s ,可伸缩矢量图形) ,是由w 3 c ( w o r l dw i d e w e bc o n s o r t i u m ,万维网联盟) 制定的基于x m l ( e x t e n s i b l em a r k u pl a n g u a g e , 可扩展标记语言) 来描述二维矢量图型的一个开放标准l 引。 在万维网历史的大部分时间里,浏览器显示的图形都是光栅格式的。在光栅 图像( 如g i f 或j p e g 图像) 中,文件包含图像中每个像素的颜色值。浏览器 读取这些值并做出相应行动。这一系统能够忠实再现摄影图像,但它在某些情形 下显得不足。例如,尽管浏览器能以不同大小显示一个图像,但通常会产生锯齿 边缘,在这些地方,浏览器不得不为那些在原始图像中不存在的像素插入或猜测 数值。此外,光栅文件格式的二进制性质使其难以基于数据库信息动态地创建图 像,并且动画最多也仅限于“翻动书本”类型的动画,即快速连续地显示单独图 像。 矢量图形,通过指定为确定每个像素的值所需的指令,部分克服了这些困难。 例如,向量图形不再为一个直径一英寸的圆提供像素值,而是告诉浏览器创建一 个直径一英寸的圆,然后让浏览器( 或插件) 做其余事情。如果图像需要以正常 大小的三倍来显示,那么浏览器只要按正确的大小画圆而不必执行光栅图像通常 的插入法。类似地,浏览器接收的指令可以更容易地与外部信息源( 如应用程序 7 北京邮电大学硕卜研究生学位论文富媒体i 乜视投票系统的设计与实现 和数据库) 绑定,要对图像制作动画,浏览器只要接收有关如何操纵属性( 如半 径或颜色) 的指令即可。图2 2 为光栅图与向量图的对比效果图。 bi t m a po u t l i n e j p e g g i f p n gs v g 图2 - 2 光栅图与向量刚8 1 基于上面所说的特性,s v g 图形格式具有以下优点:( 1 ) 图像文件可读, 易于修改和编辑;( 2 ) 与现有技术可以互动融合,例如,s v g 技术本身的动态 部分( 包括时序控制和动画) 就是基于s m i l 标准;( 3 ) s v g 文件可嵌入j a v a s c r i p t ( 严格的说应该是e c m a s c r i p t ) 脚本来控制s v g 对象;( 3 ) s v g 图形格式可 以方便的建立文字索引,从而实现基于内容的图像搜索;( 4 ) s v g 图形格式支 持多种滤镜和特殊效果,在不改变图像内容的前提下可以实现位图格式中类似文 字阴影的效果;( 5 ) s v g 图形格式可以用来动态生成图形。例如,可用s v g 动 态生成具有交互功能的地图,并显示给终端用户。 2 2 2 s v g 版本 起初2 0 0 1 年的s v g1 0 、和2 0 0 3 年的s v g l 1 版本都不是专门针对移动设 备来设计的,于是2 0 0 3 年1 月1 4 日推出了专门针对移动设备的版本:s v gb a s i c 和s v gt i n y 。由于移动设备在c p u 速度、内存大小、支持的显示颜色等各个参 数上有很大的不同,单一的专业标准很难满足所有移动设备的要求。因此,为了 覆盖不同移动设备家族的需求,s v g 工作小组最终制订了两个级别的m o b i l e s v g 专业标准。一种专业标准是s v gt i n y ( s v g t ) ,适用于资源高度受限的移动 设备,如手机;另一种专业标准是s v gb a s i c ( s v g b ) ,适用于高端的移动设备, 如p d a 等。由于移动设备硬件条件的限制,相对于标准的s v g ,m o b i l es v g 在支持的内容、属性、功能等方面作了限制。2 0 0 8 年1 2 月2 2 日,s v g t i n y1 2 版本成为了w 3 c 的推荐版本。这个版本可用于的设备:手机,p d a ,笔记本电 脑和台式电脑。包括s v g1 1 完整版的一部分特性和新的扩展性能。此外,还有 正在开发中的s v g2 0 版本等。 8 北京邮电人学硕l 研究生学位论文富媒体电视投票系统的设计j 实现 2 2 3s v g 语法简介阳儿叼 2 2 3 1 框架元素 表2 - 1s v g 框架元素标签 框架元素 说明备注 根元素,定义了在用户当前坐标系中的一个矩形可渲染区域 将一批特征类似的元素定义成一个集合 s v g 文档中的注释,说明文档内容这两个元素的值 s v g 文档中的注释,说明文档标题 都不会被渲染。 引用,预先定义一个或一些不进行实际渲染的元素,然后在实际使用时会包 需要的时候通过对它们的引用来进行绘图含下面两个元素 定义图像的模板这两个元素可成 引用s v g 中已经定义好的可视化元素 对使用 在需要进行跨平台,跨语种的图像交流,或者在文档中插入 其它非s v g 格式的数据时才使用 2 - 2 - 3 2 形状元素与坐标变换 表2 2 形状元素标签 形状元素说明备注 定义矩形。可以通过属性值r x 和d ,设置来实现圆角矩形 这些形状和路径 基于中心点和半径定义一个圆形可以组合起来形 依据中心点和两个半径定义一个椭圆 成任何可能的图 根据两个点定义一个线段 像。每个基本形 根据所有拐点的坐标值定义一个折线 状都带有指定其 根据一组坐标值绘制一个封闭多边形 位置、大小、颜 绘制任意路径,可利用贝塞尔曲线绘制曲线 色、轮廓等属性。 标签的v i e w b o x 属性是用来规定视口的坐标范围,常用来拉伸一个图 像使其适合某一特定矩形区域。p r e s e r v e a s p e c t r a t i o 属性是图像不能被随意缩放 时的处理方法,它能调整v i e w b o x 在视口中的显示位置和大小。 此外,一个s v g 文档中可以嵌套定义多个 元素,每一个 元素都 可以建立一个新的视口,同时也建立一个缺省的初始视口坐标系和初始用户坐 标。 9 北京邮电人学硕一f :研究生学位论文 富媒体电视投票系统的设计j 实现 坐标变换有以下几种方法: 平移变换( t r a n s l a t e ) :t r a n s f o r m = “t r a n s l a t e ( x ,y ) ”,新坐标系的原点移动到原坐 标系的( x ,y ) 处,新坐标轴的方向和原坐标轴相同。 旋转变换( r o t a t e ) :t r a n s f o r m = “r o t a t e ( a n g l ec x ,c y ) ”,其中a n g l e 代表旋转角度, ( c x ,c y ) 是旋转中心所在的坐标。顺时针方向旋转的角度是正值,逆时针方向旋转 的角度是负值。 伸缩变换( s c a l e ) :t r a n s f o r m = “s c a l e ( s x ,s y ) ”,其中s x 和s y 分别代表x 轴方 向和y 轴方向拉伸或缩小的比例因子。大于1 是拉伸,小于1 是缩小。 歪斜变换( s k e w ) :t r a n s f o r m = “s k e w x ( x - a n g l e ) ”或t r a n s f o r m = “s k e w y ( y a n g l e ) ”, 其中x a n g l e 和y - a n g l e 分别表示沿x 轴和y 轴歪斜的角度。 矩阵变换( m a t r i x ) :矩阵变换是坐标变换的通用形式,以上几种变换都是矩 阵变换的特殊情况。一个二维坐标系的矩阵变换通用计算公式是: 其中x 和y 是旧坐标值,x 1 和y 1 是新坐标值。t r a n s f o r m = “m a t r i x ( ab cdef ) ”, 这里的6 个参数分别是矩阵中的6 个元素。 文字和字体 表2 3 文字元素标签 文字标签说明 备注 用米在s v g 图像中插入普通的文字 在 元素中嵌a , 元素以重新设置文字的位置、 角度等其它参数 可以使用 元素进行文本内容的引用,它只能作为 的子元素来存在 作为 的子元素,用来引用一个字型定义元素来 字型替换 说明需要使刚的字型 作奠j 的子元素,用来引用一个字型定义元素来 说明需要使用的字型 用来指定或引用一个字符的字型数据 的子元素,将文字按照一定的路径曲线进行排列文字编排 1 0 、llllllll, i 1 _ | x y 1 ,j-_-_-_-_-、 、liii_li_ e f 1 c d 0 a b 0 ,j-_-_一, = 、l-, x y 1 北京邮电人学硕j :研究生学位论文富媒体电视投票系统的设计与实现 在处理字体时,s v g 只是把所需字体的轮廓与文字本身分离,两部分内容 作为逻辑上相对独立的部分嵌入到同一个s v g 文件中。s v g 的客户端解释程序 在接收到含有字型数据的文档时,会把字体的字型数据转化为轮廓数据,以此来 确定文字的显示效果。但文字仍然是纯文本,确切地讲是带了字体描述数据的纯 文本其它程序可以检索此文本,并对其进行复制、粘贴等普通操作。 2 2 3 5 绘图 上面已经介绍了一些围绕对象的笔划或线等。这些属性实际上还有子属性, 可以通过设置子属性来创建不同的绘图效果。这些属性包括: f i l l :该属性指定用来填充对象内部区域的颜料。该属性可以只是一种颜色, 但也可以是渐变或图案。f i u 的值通常是关键字、颜色说明或指向预定义元素的 u r i 。 f i l l o p a c i t y :该属性指定元素的透明性。值的范围从完全透明( o ) 到完全不 透明( 1 ) 。 s t r o k e :该属性指定元素外边框的外观。象f i l l 一样,它引用颜料,通常将 它指定为一种简单颜色。 s t r o k e w i d t h :该属性指定笔划线的宽度。 s t r o k e 1 i n e c a p :该属性确定线末端的形状,可取的值有粗端( 缺省值) 、圆 和正方形。 s t r o k e 1 i n e j o i n :该属性确定对象各角的外观。允许的值有直角( 缺省值) 、 圆和斜角,它如示例中所示将尖角的边缘“剪掉 。 s t r o k e d a s h a r r a y :该属性是一个整数系列( 如3 、2 、3 、2 、4 、3 、2 和3 ) , 它允许对虚线中每一划的相对长度进行控制。 s t r o k e o p a c i t y :类似于f i l l - o p a c i t y ,该属性确定元素笔划线的相对透明性。 2 2 3 6 色彩渐变与模式填充 表2 _ 4 色彩渐变与模式填充元素 文字标签说明备注 定义线性色彩渐变 色彩渐变和模 定义放射状色彩渐变 式填充一般都 作为 元素和 元素的 在 标签 子元素而存在,它规定了渐变关键点的色彩和位置 定义一个填充模板 中定义 北京邮电人学硕十研究生学位论文富媒体l 乜视投票系统的设计与实现 用图案填充对象在很多地方与用渐变填充类似。两种情况下,都定义填充然 后从填充属性内部调用它。 定义图案与定义任何其它作为s v g 图像一部分出现的对象相似。它有位 置、高度和宽度,通常还有一个或多个包含的对象。位置是基于整个文档还是基 于正在被填充的对象由p a t t e r n u n i t s 属性确定,该属性可以设置为 o b i e c t b o u n d i n g b o x 或u s e r s p a c e o n u s e ;这些属性分别设置基于对象和文档的坐 标。与渐变相似,可以变换图案( 使用p a t t e m t r a n s f o r m 属性) 。 2 2 3 7 剪裁、遮罩与图像合成 剪裁:使用o v e r f l o w 和c l i p 属性能在创建了一个新视口元素时以剪裁的方式 起作用。而 标签用于定义一个剪裁路径以供其它元素使用。 遮罩的相关标签为 。 图像合成实际上也就是根据图像各自的色彩和透明度数据进行计算从而得 出合成色彩的过程。s v g 目前只支持非常简单的a l p h a 通道合成,而且有固定 的计算公式。 2 2 3 8 滤镜 滤镜效果使用 标签和相关的i d 识别来定义。其中有两个关键的属性: s o u r c e g r a p h i c 和s o u r c e a l p h a 。s o u r c e g r a p h i c 表示了需要被滤镜的原始物件,例 如图形,文本;s o u r c e a l p h a 和s o u r c e g r a p h i c 属性上基本类似,但包含了一个 a l p h a 通道。这样可以通过a l p h a 通道的值实现滤镜的功能。 通过组合简单的滤镜变换元素,如光照、偏移、模糊、色彩变换等,可以产 生更加丰富和多样的效果。 滤镜效果是s v g 中最复杂也最具感染力的效果,众多的混合模式与复杂的 光源设置、立体变换等形式给图像提供了无限的创意空间。 2 2 - 3 9 动画元素 s v g 支持示例图形的随时间变化。s v g 可以通过两种方式动画化: 一种方式是

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论