730 likes | 887 Views
城市建设系 地理信息系统专业课程. 第四章 WebGIS 应用技术. 城市建设系 龙岳红. 内容导航. 1 SVG 在 webgis 中的应用 2 VRML 在 WebGIS 中应用 3 海量遥感影像数据的 Web 发布 4 基于 WebService 的开放式 GIS. 重点难点. 重点: SVG 的特点, SVG 语法及应用; VRML 的关键技术; 遥感影像数据发布的关键技术; WebServes 体系 结构及 OGC 的 GIS 服务标准 难点: 遥感影像数据发布的关键技术的理解和应用 WebServices 的理解和应用。.
E N D
城市建设系 地理信息系统专业课程 第四章 WebGIS应用技术 城市建设系 龙岳红
内容导航 1 SVG在webgis中的应用 2 VRML在WebGIS中应用 3 海量遥感影像数据的Web发布 4 基于WebService的开放式GIS
重点难点 • 重点: SVG的特点,SVG语法及应用;VRML的关键技术; 遥感影像数据发布的关键技术;WebServes体系 结构及OGC的GIS服务标准 • 难点: 遥感影像数据发布的关键技术的理解和应用 WebServices 的理解和应用。
SVG(1):svg概念 • 什么是SVG? SVG(Scalable Vector Graphic)即可伸缩矢量图形,是一个基于XML的标准开放的矢量图形格式。 完全使用文本来描述,是基于文本的图像格式。使用简单的文本命令, SVG可以在网页上显示出各种各样的高质量的矢量图形,支持很多功能:几何图形、自定义置入字体、动画、渐变色、透明和滤镜效果等图像效果。 SVG图像是基于XML(可扩展标识语言--未来的网络语言)的应用,并由W3C组织的SVG开发组负责详细的研究和开发.
SVG (Scalable Vector Graphics) • SVG1.0由W3C于1999年1月提出,已经在2001年9月5日成为的正式推荐标准。 • SVG可以单纯的仅作为图形数据的展现,亦可做为计算机动画的格式。 • SVG三种图形对象型态,包括:向量图形、文字及网格影像,使用者可以根据自己的需求在SVG的文件内任意组合运用这三种对象。 • SVG的标准是由许多的厂商和W3C所共同制定的,厂商包括:Adobe System、AOL等。
使用记事本或其他文本编辑器查看内容 使用浏览器打开该.svg文件,显示效果如右图(需装支持svg显示的浏览器插件) svg图像的文本及图像显示
SVG(2):特点 • 1、Svg的特点 • 基于xml标准,因此这使它能同HTML、CSS、DOM、XSL、JavaScript、CGI一样成为一种新的标准,具有HTML所缺乏的伸缩性与灵活性 • 矢量图形:文件量小, 并且SVG支持利用gzip压缩算法减少文件尺寸(压缩后的文件通常被称为SVGZ文件);可无极缩放 • 由文本构成的图像:易进行修改和更新,体现“可升级”特性
SVG(2):特点 • 灵活的文件格式:SVG扩展了图像的文件格式,由矢量图形、文字和点阵图像3部分构成,字在SVG图像中保留可编辑和可搜寻的状态,其中的图像描述可以重复使用 • 支持交互性:SVG支持同步多媒体集成语言(SMIL,也是xml的一种应用),使得在图片内进行交互成为可能。 • 内嵌字型数据:解决动态字体的问题,不需要Web即时下载字体了
SVG(2):特点 • 2、SVG较位图图像(gif,JPEG等)的独特优势: 任意放缩;文本独立;较小文件尺寸;较快下载速度; 超强显示效果: 适合任何分辨率(dpi), 不会产生位图图 像的马赛克现象; 超强色彩控制: SVG图像具有一个1600万色彩的调色板, 支持多种色彩模式 ; 超强交互性: 由于SVG是基于XML的,因而能制作出空前强 大的动态交互.SVG图像能对用户动作做出不同响应,例如 高亮,声效,特效,动画等.
Adobe 公司的SVG应用实例:CML2SVG http://www.adobe.com/svg/examples.html http://www.adobe.com/svg/demos/
SVG(2):特点 • 基于文本格式的SVG矢量图像特点 1.SVG图像中的命令语句可以自由的和脚本或程序,和JavaScript或XML进行交互,完全通过代码来实现. 2.作为基于文本的格式,能实现方便的图形定位与检索. 3.SVG图像可以方便的由程序语言来动态的生成,例如通过程序语言图像可以根据数据库中的关系量实时的改变
SVG(2):特点 • 基于文本格式的SVG矢量图像特点 4.SVG完全支持DOM(文档对象模型),(因而SVG以及SVG中的对象(元素)完全可以通过脚本语言接受外部事件的驱动,例如鼠标动作,实现自身或对其他物件,图像的控制。 ) 5.SVG可以很好的跨平台工作,解决外部输出,色彩,带宽等相关问题。
SVG(2):特点 GML、SVG、VML比较 • GML、SVG、VML都与矢量图形有着密切的关系:GML在表示实体的空间信息的同时加入了实体的其他属性信息,是表示实体的空间信息和属性的编码标准,但它并不支持直接显示图形。 • 而VML(矢量标注语言)和SVG是在表示图形的矢量信息同时加入了图形的显示信息(即以什么样的样式显示矢量图形),是显示矢量图形的两种比较好的格式。 • 相比之下,SVG是综合了VML的优点后推出的,是国际标准,它比VML具有更多的优点,也有更广阔的前景。但由于VML有IE的支持, 而SVG要想在浏览器中显示就需要安装插件,在这一点上,VML优于SVG。
SVG(3):发展 • SVG的发展历程: • 1985,adobe发布了用于打印的PostScript(文本格式,与设备无关,但文件大,不适合网络传输) • 1998年4月,来自Adobe、IBM、SUN等公司向W3C联盟(World Wide Web Consortium)提交了联合制定的PGML(Precision Graphics Markup Language,精确图形标记语言) • 1998年5月,微软、 Macromedia等公司向W3C联盟提交了矢量图形标准VML(Vector Markup Language,向量标记语言)。
SVG(3):发展 • 1999年2月11日,W3C综合两者之长,发布SVG第一个工作草案 • 2000年8月,W3C正式发布SVG候选推荐规范 • 2001年9月4日,W3C发布SVG 1.0。 • 2003年1月14日,W3C发布SVG 1.1,目前的推荐标准。 • 2003年1月14日,W3C推出SVG移动子版本:SVG Tiny和SVG Basic。 • W3C目前正在研究制定SVG 1.2版本。
SVG(3):发展 • 存在的问题: • 1 SVG最大的问题是没有完全支持SVG的浏览器出现。(主要问题是SVG本地运行环境的下厂家支持程度,没有主流浏览器内置支持是无法普及SVG技术的。) • 2 SVG与Flash、VML的竞争。(SVG面临的另一个问题是如何和已经占有重要市场份额的矢量图形格式Flash竞争的问题。2005年之前Adobe看中svg的优势力推SVG技术,并且该出版巨头对svg技术发展提供了非常重要的贡献。05年收购Macromedia之后,该公司淡出对SVG的支持) • Flash背后是Adobe,VML背后的是微软。这些是企业利益的博弈,他们都寄望自己的格式占领主流以最大化自己的企业利益,而这些直接影响着SVG的发展速度。
SVG(4):svg的显示 • 插件支持 目前,最常用的SVG插件来自Adobe公司(Adobe SVG Viewer),另 外Corel也提供SVG浏览器( Corel SVG Viewer)。 • 本地支持 1、比较著名的 SVG 项目包括 Mozilla SVG Project,KDE 的 ksvg, 以及Amaya 等。 2、Mozilla Firefox自版本 1.5 发行后,即开始支援 SVG 格式的显示了。 3、基于 Java 的 SVG 项目主要有 Batik SVG Toolkit 等。 4、Opera 支持SVG显示。 • Microsoft计划在Internet Explorer 8.0支持SVG, 事实上IE8已经于2009年3月发布,但是并未加入该项功能。微软已宣布加入万维网联合会(W3C)之下的可缩放向量图形(SVG)工作小组(见:站长创投,http://www.adminvc.com/view_142181_1.html),svg工作小组期待IE9.0
SVG(4):svg的显示 • 各种SVG解释器支持程度比较(http://zh.wikipedia.org/wiki/SVG) W3C的SVG网站上有一个测试套件可以用来测试SVG解释器对于标准的支持。这个套件既可以在线运行也可以下载到本地运行。截至2007年中,对于流行的SVG软件有如下测试结果: 1、直接支持SVG的浏览器:对SVG支持最好的浏览器是Opera,它支持大多数的SVG特性。Mozilla Firefox 2.0对SVG特性的支持相当弱,许多重要特性如动画等都不能支持。 2、对于专门的SVG浏览器,Batik SVG viewer能对大多数特性有良好支持,与Opera不相伯仲。但它不能和浏览器互动。 3、使用插件的浏览器:加载了Adobe SVG Viewer的Internet Explorer也能支持多数SVG特性,但是由于没有浏览器的原生支持,在交互方面许多特性不支持。
SVG(5):svg的制作软件 • 能制作SVG的软件有: 商业软件: Adobe公司的illustrator9.0 Corel公司的CorelDraw9 开源软件: Inkscape Sodipodi ESRI公司的ArcGIS9.2支持SVG图像的直接导出
SVG(6):SVG语法及实例 Svg 标签 <svg width =“21cm” height=“13.5cm”> <title>可以把这个标签看成跟HTML的title标签一样</title> <desc>用来描述这份文件内容的地方,功能类似批注,在这个标签里面出现的内容并不会出现在执行后的画面中 </desc> 这里面的内容就是整个SVG文件的重心,不管是一般的向量图形、影像、文件或是动画,这些内容通通包含在这个部分里面 </svg>
SVG的图形标签 • 线段<line> • 矩形<rect> • 圆<circle> • 椭圆<ellipse> • 曲线<polyline> • 多边形<polygon> • 文字<text> • 影像<image>
实例1:绿色矩形和Hello World <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd"> <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"> <desc> <!-- put a description here --> </desc> <g> <!-- your graphic here --> <rect width="200" height="100" fill="green"/> <text> <tspan x="44" y="77">Hello World!</tspan> </text> </g> </svg>
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd"> <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"> <desc> <!-- put a description here --> </desc> <rect x="1" y="1" width="1198" height="398" style="fill:none; stroke:blue"/> <rect x="100" y="100" width="400" height="200" rx="50" style="fill:green;"/> <g transform="translate(700 210) rotate(-30)"> <rect x="0" y="0" width="400" height="200" rx="50" style="fill:none; stroke:purple; stroke-width:30"/> </g> </svg> 实例2:图形变换
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd"> <svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"> <image x="20" y="20" width="300" height="300" xlink:href="266981.jpg"> <title>XML功能</title> </image> </svg> 实例3:引用图像
参考书籍: 实例4 教材上 图4.1svg示例程序(代码) 注意:SVG和xml一样大小写敏感,需区分大小写
SVG(7):svg元素模块 动画模块Animation.Module 剪裁模块clipPath 颜色轮廓模块color-profile 条件处理模块switch 光标模块cursor 扩展性模块foreignObject 过滤器模块 字体模块Font.Module 梯度模块 Hyperlink.Module:a 图像模块image 标记模块marker 遮罩模块mask 阵列模块pattern 脚本模块script 造型模块path rect circle line polyline polygon ellipse 结构模块svg g defs desc title metadata symbol use 样式模块style 文本模块text tspan tref textPath altGlyph altGlyphDef altGlyphItem glyphRef 视图模块
SVG(7):svg元素模块 以下模块是用 SVG 解释器分析和处理的模块: • 超链接模块允许您将链接关联到图元; • 图像模块定义如何绘制光栅图像; • 标记模块允许您在工程图的开头、中间或末尾添加标记; • 阵列模块允许您使用一个预定义图形对象填充或绘制造型。可以使用向量造型或位图图像定义该预定义图形对象; • 造型模块与图形图元的绘制组合在一起; • 文本模块定义如何绘制文本元素。 • 结构模块允许编组图形
SVG(8):空间数据在svg中的组织 地图 由于目前svg仅支持基本图形元素,所以须按空间实体模型组织,实体由标识 码、属性和几何数据组成。 可采用常用的层次组织方法(书 P88如图4.2) 实体可以是简单要素或复杂要素。 图层1 图层2 … 图层n 实体1 实体2 … 实体n
SVG(9):基于svg空间数据表达 属性数据查询 脚本结合svg事件来完成 图形的编码 点:通过<def>,<symbol>定义,或采用<circle> 线:<path><circle><polyline><rect> 面: <path><circle><polygon><rect> 图层管理 <g>代表组(group):可多层次嵌套,可加样式表进行修饰
HTTP请求 Web浏览器 Web服务器 GIS数据类型理解 GIS数据 查找相关的 Plug-in GIS数据库 没有找到 找到 Plug-in显示 GIS数据 要求加载 Plug-in 基于Plug-in方式的WebGIS体系结构 SVG(10):基于svg的WebGIS体系结构
服务器 客户端 Web浏览器 SVG插件 JavaScript 或vbscript Web服务器 URL请求 SVG文档 SVG转换器 Web页面和 SVG文档 GIS数据库 基于svg的WebGIS体系结构
VRML-1:什么是虚拟现实 • 什么是虚拟现实? 虚拟现实(Virtual Reality)又称“虚拟实境”,是一项综合集成技术,涉及计算机图形学、人机交互技术、传感技术、人工智能等领域,它用计算机生成逼真的三维视、听、嗅觉等感觉,使人作为参与者通过适当装置,自然地对虚拟世界进行体验和交互作用。 • VR主要有三方面的含义: 第一,虚拟现实是借助于计算机生成逼真的实体,“实体”是对于人 的感觉(视、听、触、嗅)而言的; 第二,用户可以通过人的自然技能与这个环境交互,自然技能是指 人的头部转动、眼动、手势等其他人体的动作; 第三, 虚拟现实往往要借助于一些三维设备和传感设备来完成交互 操作。
VRML-1:什么是虚拟现实 虚拟现实技术的重要特征 • 多感知性(视觉、听觉、触觉、运动等),沉浸感(Immersion),交互性(Interaction),自主感(Autonomy)是虚拟现实技术的四个重要特征,其中自主感是指虚拟环境中物体依据物理定律动作的程度,如物体从桌面落到地面等。 • VR三个最突出的特征,即交互性(Interactivity)、想象性(Imagination)和沉浸感(Immersion),称三“I”特征。以此区分相邻技术,如多媒体技术、科学计算可视化技术。 • 交互性指参与者用专门设备,能实现对模拟环境的考察与操作程度,例如用户可用手直接抓取模拟环境中的物体,且有接触感,有重量感,视场中被抓起的物体也应随着手的移动而移动。 • 想象性是VR与设计者并行操作,为发挥它们的创造性而设计的这极大地依赖于人类的想象力。 • 沉浸感,即投入感,是力图使用户在计算机所创建的三维虚拟环境中处于一种全身心投入的感觉状态,有身临其境的感觉,即所谓“沉浸感”。
清华大学虚拟现实与人机交互界面实验室研制的设备清华大学虚拟现实与人机交互界面实验室研制的设备
清华大学-在研项目 虚拟现实驾驶模拟系统研制 协同式虚拟设计与快速制造技术基础研究 中美两国驾驶行为影响因素研究 老年人行为计算机建模与仿真 陀螺测试转台及飞行模拟系统测试研究
VRML-1:什么是虚拟现实 • 虚拟现实的最终目的是建立和谐的人机环境。虚拟现实主要构筑在计算机图形学上,具体应用包括一些高端的图形工作站软件和低端的网络三维方案(VRML、X3D、Cult3D、Shockwave3D等) • 近年来,VR已逐渐从实验室的研究项目走向实际应用。 • 目前在娱乐、医疗、工程和建筑、教育和培训、军事模拟、科学和金融可视化等方面获得了应用。日本松下公司用来招揽买主的“厨房世界”。 • 在国内,有关VR的项目已经列入计划,VR的研究和应用正在全面展开。杭州大学开发了虚拟故宫游玩系统。
VRML-1:什么是虚拟现实 虚拟现实的关键技术 1 真实感图形与纹理贴图 2 光线模型和光线跟踪 3 视差原理与体视图的生成 4 VRML结构与虚拟现实的实现方法
VRML-2:VRML概念 • VRML是虚拟现实建模语言(Virtual Reality Modeling Language)的简称,它是用来描述三维物体及其行为的,可以构建虚拟境界(Virtural World)。 • VRML的基本目标是建立因特网上的交互式三维多媒体,基本特征包括分布式、三维、交互性、多媒体集成、境界逼真性等。 • 按照VRML联盟(VRML Consortium)的设想,VRML应该是“在因特网上用于3D多媒体和共享虚拟世界目的的一个开放标准”。这里强调了几个重点: 1) 开放的标准:VRML已经在1997年被International Electrotechnical Commission(IEC)确认为国际标准(ISO/IEC-14772-1:1997)。
VRML-2:VRML概念 2) 3D多媒体能力:在VRML成为正式的标准很久以前它就已经成为了事实上的标准:很多应用软件如CAD、动画以及其他的3D建模程序都使用VRML格式来在彼此间发布、共享数据,这些应用软件现在都提供输出VRML格式文件或提供转化格式的工具。同时,VRML已经被考虑在MPEG-4标准,Java3D以及其他的正在开发的标准之中。 3) 共享的虚拟世界:VRML的先驱们的最初动力来自一个梦想:希望大家能够在一个3D共享的虚拟世界中交谈和工作。这个目的已经在逐步实现。 4) 基于因特网:与以往的3D应用不同,在设计VRML的时候一个基本出发点就是要在因特网上共享3D物体和场景。这是一个很重要的前提。现在的社会不再是单机或者局域网,只有在因特网上使用VRML才会有更强大的生命力,当然,在局域网的环境下VRML世界表现得会更好。
VRML-3:VRML的发展历史 1994年5月,在瑞士日内瓦召开的万维网(www)第一届国际会议 上,Mark Pesce和Tony Parisi在会上介绍了他们开发的可在万维网上 运行的虚拟现实界面。 1994年10月在芝加哥(Chicago)召开的第二次WWW会议上公布VRML1.0 的规范草案。 (主要的功能是完成静态的3D场景,以及与HTML链接的功能和措施。) 1995年秋,SGI进一步推出了WebSpace Author(供创作的程序)。 (这是一种Web创作工具,可在场景内交互地摆放物体,并改进了场景 的功能,还可用于发表VRML文件。)
VRML-3:VRML的发展历史 • 1996年初,VRML委员会审阅并讨论了若干个VRML2.0版本的建议方案,其中有: SGI:动态境界( Moving Worlds) 太阳微系统(Sun Microsystem):全息网(Holl Web) 微软公司(Microsoft) :能动VRML(Aictive VRML) 苹果公司(Apple):超世境界(Out of the world) 最终在1996年2月底以投票裁定。Moving Worlds以70%选 票赢得了绝对多数。 • 1996年3月,VGA(VRML设计小组)决定将这个方案改造成为VRML2.0。 • 1996年8月,在新奥尔良(New Orleans)的SIGGRAPH‘96会议上公布。