基于WebGL的洪水演进三维可视化时空仿真方法.pdf
《基于WebGL的洪水演进三维可视化时空仿真方法.pdf》由会员分享,可在线阅读,更多相关《基于WebGL的洪水演进三维可视化时空仿真方法.pdf(9页珍藏版)》请在咨信网上搜索。
1、2097-3012(2023)02-0295-09 Journal of Spatio-temporal Information 时空信息学报 收稿日期:2022-09-22;修订日期:2023-06-18 基金项目:山东省交通运输厅科技计划项目(2019B58);山东省交通运输厅科技计划项目(2020B72);山东省交通规划设计院集团有限公司科技创新项目(KJ-2020-SJY-04)作者简介:张涛,研究方向为虚拟地理环境、算法开发、BIM+GIS 平台研发。E-mail: 基于 WebGL 的洪水演进三维可视化时空仿真方法 张涛1,朱世超2,甄倩倩2,相诗尧1,郭长顺1,李兵1 1.山东省
2、交通规划设计院集团有限公司 全寿命周期 BIM 技术应用研发中心,济南 250031;2.山东高速基础设施建设有限公司,济南 250014 摘 要:为了防止洪水灾情误判和延报,实时、快速、准确地获取洪水发展趋势和时空变化信息成为提高洪灾预报亟待解决的问题。现有的洪水演进可视化和计算方法仍然停留在二维数据和伪三维模型的处理和展示,难以为洪灾预测和预报提供准确信息。基于此,本文提出一种基于 WebGL 洪水演进三维可视化的时空仿真方法;首先根据三维场景数据格式的不同分别进行细节层次分级和合并节点处理,然后深入分析洪水演进时空过程和定量化计算方法,最后利用 WebGL 在浏览器端动态加载三维场景数据
3、、高效渲染洪水时空演变过程以及精确统计洪水淹没数值。研究表明,本方法满足洪水演进仿真的时效性和精度要求,有效解决了 Web 端三维数据加载卡顿的问题,适用于多种网络终端。关键词:WebGL;洪水演进;时空仿真;三维场景;网络终端 引用格式:张涛,朱世超,甄倩倩,相诗尧,郭长顺,李兵.2023.基于 WebGL 的洪水演进三维可视化时空仿真方法.时空信息学报,30(2):295-303 Zhang T,Zhu S C,Zhen Q Q,Xiang S Y,Guo C S,Li B.2023.Spatio-temporal simulation method for 3D flood evolut
4、ion visualization based on WebGL.Journal of Spatio-temporal Information,30(2):295-303,doi:10.20117/j.jsti.202302018 1 引 言 依靠洪灾频发区精细三维数据进行淹没分析和研究过程模拟,是洪灾短期准确预报的有效手段(陈静等,2014)。环境地形、水量和人为主观等因素的影响,会导致对洪水发展、运动过程的误判和延报,往往造成人员伤亡和经济损失(孙连华和秦萍,2023)。因此,要实施有效及时的防灾减灾预报和策略,就必须深入研究洪水淹没原理和演进过程,对洪水淹没的全周期过程进行高度精确的仿真
5、模拟(常静,2010)。随着智慧防灾减灾体系的建立,如何在网络环境下实时掌握洪水动态变化成为三维 GIS 的关键问题之一(樊青松和肖晨旦,2019)。目前,关于洪水淹没仿真的技术,存在问题:一是基于C/S端的地理信息系统(geographic information system,GIS)软件,如 ArcGIS、Erdas 等实现洪水淹没的静态展示,但难以真正做到洪水演进三维化仿真过程展示(黄一帆和李文辉,2021;李晨光,2019;刘恒洋,2019);二是一些 B/S 架构前后端底层的系统式开发和基于现有软件的二次开发(刘晓林,2022;刘畅等,2018;田林钢等,2020),需要以插件安装
6、形式使用,且难以兼容多个浏览器,无法满足多用户对 Web 端三维 GIS 轻量化、实时性的要求。从实现效果上讲,一是难以高效加载与调度海量三维场景数据,满足不了宏观三维场景的应用需求(Bai 等,2015);二是难以兼顾洪水淹没空间维度与时间维度的同步变化,不能实现贴近实际的洪水三维演进过程(Teng 等,2017;Rueda等,2013;张连翀等,2017)。WebGL 是一种面向浏览器端的跨平台、开放、免插件的三维可视化绘图标准,且提供了基于 GPU硬件加速的三维渲染技术(刘一鸣,2018)。基于HTML5 WebGL 可为开发者和最终使用户带来更简 296 Journal of Spat
7、io-temporal Information 时空信息学报 2023,30(2)洁的开发与访问体验(杨帆和杜凯,2016)。利用WebGL 技术在浏览器端实现洪水淹没分析和模拟仿真成为洪灾预防和预报的重要途径之一(朱祖乐,2016)。但目前 WebGL 技术仅支持较小数据量三维场景的加载和展示,对海量数据的实时绘制和交互式分析难以直接支持,现有的基于 WebGL 的三维 GIS 产品均未能很好地支持三维场景下的载体数据加载和洪水淹没过程动画模拟(刘明等,2023)。因此,针对大场景三维数据加载缓慢的问题,本文提出基于 WebGL 洪水演进三维可视化的时空仿真方法,设计一种大体量数据轻量化策略
8、,利用 WebGL 高效绘制和动态渲染的特点,对洪水淹没演变过程进行动画模拟仿真。实验证明,本方法满足三维数据高效加载与显示,真实模拟洪水淹没演变过程,对现实性洪水灾害预测和预报具有较强的实用性。2 方法与技术 基于 WebGL 的洪水演进三维可视化时空仿真方法的体系结构,如图 1 所示。本方法体系结构由数据层、存储层、原理层、服务层和应用层五层组成。数据层是根据地形数据精度和位置信息,利用四叉树对高精度地形数据进行细节层次(level of detail,LOD)、多粒度的划分,生成三维瓦片;对倾斜影像生成高效加载索引文件并合并根节点,经格式转换后得到 WebGL 支持格式 3dtiles。
9、存储层是将数据层的结果以空间数据库的方式发布到Web 服务器,以供终端调用。原理层包括地形影像生成LOD 缓存的方法、倾斜模型合并根节点方法和洪水淹没算法。服务层基于 WebGL 提供的地图服务、数据服务、三维服务形成洪水淹没仿真服务,实现对数据的加载、可视化、分析和渲染。应用层是用户在各种终端只需一个网址就可获取洪水淹没演进过程和定量化指标。2.1 数据预处理 2.1.1 地形和影像数据预处理 由于地形和影像数据量大,直接加载到 Web端会造成操作卡顿和缓冲延时的问题,采用瓦片金字塔结构对数字高程模型(digital elevation model,DEM)和影像数据进行处理,生成多分辨率的
10、瓦片数据。金字塔结构是一种多分辨率层次模型,能够在统一的空间参照下按分辨率级别的不同建立一组 DEM 和影像数据,将整体的DEM 和影像数据进行分块处理,按照经纬度记录建立子块位置的空间索引,以响应不同分辨率数据的访问和存储需求,提高对 DEM 和影像数据的访问效率(朱庆等,2017)。把原始地形数据作为瓦片金字塔的底层 Level 0,进行分块,形成第0 层瓦片矩阵;在第 0 层的基础上,按每 2 像素2像素的方法生成第 1 层 Level 1,进行再次分块,形成第 1 层瓦片矩阵,如图 2(a)所示。按照这个倍率依次对上层数据进行处理,直到形成完整的瓦片金字塔。图 1 洪水淹没仿真模拟体系
11、结构 Fig.1 Simulation architecture for flood submergence 张涛 等:基于 WebGL 的洪水演进三维可视化时空仿真方法 297 图 2 瓦片结构示意图和 LOD 层级效果图 Fig.2 Tile structure diagram and level of detail effect 在瓦片金字塔的基础上对每个瓦片设置 LOD层级。LOD 技术是根据物体模型的节点在显示环境中所处的位置和重要度,决定物体渲染的资源分配,降低非重要物体的面数和细节度,从而获得高效率渲染运算(陈良超和李锋,2019)。当三维场景拉近看时,模型表现非常精细;当浏览整
12、个场景时,模型只需以较粗糙方式显示。这样最大程度优化了资源的占用,提高了整个三维场景的性能。图2(b)显示的是视点距离与模型精细化之间的关系。在 Web 端可以设置模型 LOD 层级、每一级网格简化率和每个层级之间的切换距离,此距离指相机视点与模型之间的距离,其决定了当前场景显示模型的精细程度。经过预处理后的地形和影像切片数据发布到Web 服务器上,提供数据和地图服务,Web 端通过调用 URL 地址访问数据。2.1.2 倾斜摄影三维模型预处理 倾斜摄影三维模型不仅能够真实地反映地物 情况,高精度地获取物方纹理信息,还可通过先进的定位、融合、建模等技术,生成真实的三维实景模型(孙杰等,2019
13、),可用于大场景下的三维空间分析。倾斜摄影三维模型由航测影像自动生成,其三维格网精细而复杂,导致倾斜摄影三维模型数据量往往非常大,这给数据转换、加载和应用带来严峻考验(汪洋等,2021)。倾斜摄影三维模型 OSGB格式自带原生 LOD 结构,根据模型在三维场景中所处位置和重要程度,加载不同精细化的数据,即观察点离模型较近时,加载精细层保持高细节显示;观察点离模型较远时,使用模糊层数据降低内存消耗(王凯松等,2019)。原生 LOD 层有利于模型的加载,但一个航测测区的模型是由很多个瓦片文件夹组成,会增加模型加载次数从而影响效率;为了提升模型加载和展示性能,合并根节点减少根节点数目,直到最优为止
14、,如图 3 所示。由于 Cesium 暂不支持 OSGB 格式数据,所以利用开源转换工具讲 OSGB 格式数据转换为 3dtiles并发布到 Web 服务器为 Web 端提供三维数据服务。图 3 倾斜摄影三维模型根节点合并示意图 Fig.3 Illustration of root node merging in tilt photogrammetry-based 3D models 298 Journal of Spatio-temporal Information 时空信息学报 2023,30(2)2.2 洪水淹没算法 2.2.1 洪水淹没类型 按照洪水淹没的成因,可以将洪水淹没分为无源淹
15、没和有源淹没。无源淹没只考虑降水造成的水位抬升,不考虑地表径流的汇入,所有高程值低于水位值的区域均认为被淹没。有源淹没通常设定一个或多个淹没源点,根据水位值从淹没源点向四周搜索连通的洼地,并根据水流速度确定各时间段的淹没范围,模拟出洪水淹没的时空过程(蒋杰等,2009)。2.2.2 洪水淹没算法原理 对地形瓦片数据生成指定步长的规则矩形格网,分别进行无源淹没和有源淹没分析。无源淹没不考虑洪水流向的问题,选择矩形格网最左下角的网格作为开始判断的原始点,获得其高程值minH和洪水水位值waterH进行比较,当minwaterHH时,该格网状态定义为淹没,存入到淹没缓冲区(buffer),依次遍历所
16、有格网并判断其淹没状态,存入至淹没缓冲区中,直到最后一个格网。对于倾斜摄影三维模型,可以根据模型边缘点作为原始点,由原始点沿三角网判断,直到生成淹没点缓冲区(姜仁贵等,2011)。通过给定不同洪水水位值waterH来选择缓存区中满足淹没条件的网格点,使洪水淹没过程具有时间演变特性,更加形象生动地表达模拟仿真效果,如图 4 所示。图 4 无源淹没原理图 Fig.4 Schematic diagram of passive submergence 有源淹没需要考虑格网之间的连通性,采用种子点扩散算法进行计算。考虑洪水淹没发生的实际情况,需要指定一个源点作为算法计算的第一个原始点,提取其高程值判断是
17、否淹没,若未被淹没,则按照网格顺序选择下一个网格,若满足淹没条件,则与此网格相邻的 8 个方向网格进行连通性分析,将满足淹没条件或具备连通性的格网标记下来并加入到缓冲区中,标记的网格作为下一轮的原始点继续进行 8 邻域扩散计算,直到所有满足淹没条件的网格皆存入缓冲区中(邢华桥等,2015)。为了体现淹没分析的时空演变过程,在算法中添加Level变量来记录每个淹没点的淹没层级,规定源点的Level为1,源点周围淹没点的Level为2,再一次扩散的淹没点的Level为3,以此类推,直到最后一个Level并确保Level值大于0,Level的不同值代表不同时间新增加的淹没区域。对于倾斜摄影三维模型,
18、需先指定一个源点,沿三角网判断相邻三维点,满足条件的存入缓冲区并标记Level值。原始点,P x y标记为Level 1,其8邻域网格有三个满足淹没条件和连通性,标记为Level 2,作为下一轮判断的原始点,如图5所示。图 5 有源淹没原理图 Fig.5 Schematic diagram of active submergence 洪水演进关注的参数变量主要是淹没面积、洪水体积和流量。淹没面积计算方法为,判断每个格网高程iH与T 时刻洪水水位高程TH 的大小关系,若iTHH,则为淹没格网;若iTHH,则为未淹没格网。然后对淹没格网逐一面积计算并求和得到淹没面积:1=niiSS淹没 (1)式中
19、,S淹没为此时刻洪水淹没总面积,m2;iS 为第i 个淹没网格的面积,m2;n为淹没网格的个数。张涛 等:基于 WebGL 的洪水演进三维可视化时空仿真方法 299 淹没体积的计算方法为,计算淹没网格高程iH与T时刻洪水水位高程TH之差iH;然后对淹没网格依次求取洪水体积并求和:iiiVHS (2)1=niiVV淹没 (3)式中,iV为第i个淹没网格的洪水体积,m3;V淹没为洪水淹没总体积,m3。洪水流量v计算方法为,计算洪水淹没总体积V淹没与T时刻之商:/vVT淹没 (4)2.3 Web 端洪水淹没三维时空仿真实现 WebGL是一种3D绘图标准,其渲染机制是将相关数据提交给渲染队列,再调用G
20、PU资源来实现三维可视化渲染(邢峰等,2018)。将地形数据、影像数据和倾斜摄影三维模型发布到Web服务器,提供数据服务、地图服务和三维服务,利用URL访问数据地址实现数据的加载和展示,金字塔结构和低层级节点遍历保证了数据的 加载、渲染与调度。场景中加载地形数据和倾斜摄影三维模型,其数据的每个像素自身带有高程值,利用分层设色法对不同高程范围进行颜色赋值,在Web端图形绘制时每个像素相关信息被保存在内存里。通过洪水淹没算法的计算,将不同时刻或不同水位值淹没范围进行渲染为帧缓存,为保证渲染效果的平滑流畅需要对不同帧进行插值,通过对帧缓存逐条渲染显示,从而达到对淹没过程的模拟仿真(王旭等,2010)
21、。用户通过浏览器输入网址就可进入洪水淹没模拟仿真界面,了解洪水淹没过程和三维模拟仿真效果,从而在洪灾前进行宏观决策。3 实验分析 3.1 实验场景与数据 基于WebGL技术在浏览器端开发洪水演进三维可视化时空仿真平台,提供三维实验场景,如图6所示。地形和影像数据选取某河流流域区域,用来模拟河流有源洪水淹没过程;倾斜摄影三维模型主要是某城市实景模型,主要用来表达城市无源淹没发展过程的仿真。图 6 Web 端洪水演进三维可视化时空仿真平台 Fig.6 Web-based spatio-temporal simulation platform for 3D flood evolution visua
22、lization 3.2 实验结果与分析 实验中给定初始的最大高程、最小高程和淹没速度,根据洪水淹没算法原理,结合本文提出的WebGL三维模型可视化渲染技术,动态模拟洪水的演进过程,将其与周围大场景相融合,直观地展示洪水在三维虚拟环境中的动态变化过程,并精确定量计算洪水淹没面积、体积和流量。地形叠加影像数据用于洪水有源淹没计算仿真,结果如图7所示。倾斜摄影三维模型用于洪水无源淹没计算仿真,结果如图8所示。传统GIS软件中基于地形、影像和研究区域范围Shapefile文件模拟洪水淹没效果图,其原理是在伪三维效果下通过设置Shapefile文件海拔和颜色来模拟不同海拔下研究区域淹没结果,如图9所示
23、。300 Journal of Spatio-temporal Information 时空信息学报 2023,30(2)图 7 不同时刻地形洪水淹没时空模拟结果 Fig.7 Spatio-temporal simulation results of terrain flood submergence at different time points 图 8 不同时刻倾斜模型淹没时空模拟结果 Fig.8 Spatio-temporal simulation results of oblique model submergence at different time points 三维场景数据在
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 基于 WebGL 洪水 演进 三维 可视化 时空 仿真 方法
1、咨信平台为文档C2C交易模式,即用户上传的文档直接被用户下载,收益归上传人(含作者)所有;本站仅是提供信息存储空间和展示预览,仅对用户上传内容的表现方式做保护处理,对上载内容不做任何修改或编辑。所展示的作品文档包括内容和图片全部来源于网络用户和作者上传投稿,我们不确定上传用户享有完全著作权,根据《信息网络传播权保护条例》,如果侵犯了您的版权、权益或隐私,请联系我们,核实后会尽快下架及时删除,并可随时和客服了解处理情况,尊重保护知识产权我们共同努力。
2、文档的总页数、文档格式和文档大小以系统显示为准(内容中显示的页数不一定正确),网站客服只以系统显示的页数、文件格式、文档大小作为仲裁依据,平台无法对文档的真实性、完整性、权威性、准确性、专业性及其观点立场做任何保证或承诺,下载前须认真查看,确认无误后再购买,务必慎重购买;若有违法违纪将进行移交司法处理,若涉侵权平台将进行基本处罚并下架。
3、本站所有内容均由用户上传,付费前请自行鉴别,如您付费,意味着您已接受本站规则且自行承担风险,本站不进行额外附加服务,虚拟产品一经售出概不退款(未进行购买下载可退充值款),文档一经付费(服务费)、不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
4、如你看到网页展示的文档有www.zixin.com.cn水印,是因预览和防盗链等技术需要对页面进行转换压缩成图而已,我们并不对上传的文档进行任何编辑或修改,文档下载后都不会有水印标识(原文档上传前个别存留的除外),下载后原文更清晰;试题试卷类文档,如果标题没有明确说明有答案则都视为没有答案,请知晓;PPT和DOC文档可被视为“模板”,允许上传人保留章节、目录结构的情况下删减部份的内容;PDF文档不管是原文档转换或图片扫描而得,本站不作要求视为允许,下载前自行私信或留言给上传者【自信****多点】。
5、本文档所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用;网站提供的党政主题相关内容(国旗、国徽、党徽--等)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。
6、文档遇到问题,请及时私信或留言给本站上传会员【自信****多点】,需本站解决可联系【 微信客服】、【 QQ客服】,若有其他问题请点击或扫码反馈【 服务填表】;文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“【 版权申诉】”(推荐),意见反馈和侵权处理邮箱:1219186828@qq.com;也可以拔打客服电话:4008-655-100;投诉/维权电话:4009-655-100。