地理信息系统中动态目标及标签的高性能渲染方法技术方案

本发明专利技术公开了一种地理信息系统中动态目标及标签的高性能渲染方法，步骤为：S1：通过canvas方法创建一个canvas画布；S2：在canvas画布上制作自定义标签；S3：制作svg格式矢量图片；S4：通过自定义标签进行重新编码，制作svg格式矢量图片；S5：在场景中插入svg格式矢量图片；S6：在地理信息系统的业务层获取生成的svg矢量图片，并放入地图中；S7：清空canvas画布的所有元素，完成一个动态目标的自定义标签；S8：重复步骤S1～步骤S7直至绘入与动态目标数量相对应的自定义标签。该方法实现了在不丢失任何样式、展示完全相同的前提下，用矢量图片大幅度提高了二三维地理信息系统的展示性能。幅度提高了二三维地理信息系统的展示性能。幅度提高了二三维地理信息系统的展示性能。

【技术实现步骤摘要】
地理信息系统中动态目标及标签的高性能渲染方法


[0001]本专利技术涉及地理信息系统
，具体涉及一种地理信息系统中动态目标及标签的高性能渲染方法。

技术介绍

[0002]随着时代发展，二维地理信息系统中枯燥、简单的地理标签已经满足不了用户的要求，三维地理信息系统已经运用到生活中的方方面面。
[0003]特别是借助于三维展示技术和B/S架构相关技术的发展，在浏览器中进行三维地理信息系统展示的需求已经十分广泛，但是当需要在三维信息系统、整屏展示千级动态目标、并且每个动态目标均需对应展示目标标签的场景下，如动态航班场景、人口迁移场景、卫星轨迹场景、航天态势等场景下，已调研百度bmap地图开放平台、高德amap地图开放平台、Cesium三维地球引擎、MapBox地图开发平台等主流WebGIS框架中，使用框架自带的方法添加自定义标签时，普通的台式电脑中页面的渲染帧数低于5FPS，卡顿感十分明显、甚至出现页面崩溃等情况，用户体验极差。
[0004]中国专利申请(公开号：CN112269575A)公开了一种canvas绘制动态二维场景的方法，该方法具体包括下述步骤；步骤1：确定绘制原点center，设定center.X和center.Y；步骤2：利用JavaScript获取当前浏览器的文档宽度和高度所占像素大小，即宽度winWidth和高度winHeight，然后根据需要设置画布的宽高canvasWidth和canvasHeight；步骤3：将div作为canvas的父容器，通过动态的方式将canvas元素添加到div中；步骤4：设置多个画布，其中一个画布设置为可视画布_realCanvas，其他画布设置为不可视画布_notVisibleCanvas1、_notVisibleCanvas2,
……
_notVisibleCanvasN。但该技术方案侧重的是多个画布集中到一个画布中，做动画的2d运行动画，不能在gis上运用。
[0005]中国专利申请(公开号：CN112991508A)公开了一种基于WebGL的3D渲染系统及方法，包括场景对象库、特效库、动画框架库、矩形计算库、图形用户界面库和辅助模块库，其中，场景对象库包括场景对象模块、灯光对象模块、相机对象模块、材质对象模块、粒子对象模块、模型对象模块和纹理对象模块；动画框架库包括蒙皮动画模块和骨骼动画模块；矩形计算库包括向量计算模块和模型包围盒计算模块。但该技术方案侧重的是3d模型重新优化，给于webgl本身，优化模型的材质、色彩、纹理等3d模型的基本属性；和优化动态目标性能，无任何关系。
[0006]中国专利申请(公开号：CN113313799A)公开了一种动态图像处理方法、动态图像处理装置、终端应用及电子设备，该动态图像处理方法应用于终端，包括：将获取的初始动态图像进行拆帧以得到所述初始动态图像的每一帧初始图像的元数据；响应于针对所述初始图像的图像编辑操作，基于所述初始图像的元数据及所述图像编辑操作指示的图像渲染信息，在画布上对所述初始图像进行渲染以获得所述初始图像的目标图像；以及，按照每一帧初始图像在所述初始动态图像中的顺序，保存每一帧初始图像对应的目标图像，或者无图像编辑操作的初始图像和有图像编辑操作的初始图像对应的目标图像。这样，用户能够
在终端基于自身的需求调整动态图像，提高了图像的处理速度和质量，并改善了用户便利。但该技术方案侧重gif这里动态图片进行拆帧，获取每一帧的图片，然后对每一张图片做处理。主要作用对动态图片的修改。
[0007]中国专利申请(公开号：CN114549720A)公开了一种实时渲染管线多目标优化方法，将功耗目标改为帧延时目标，从帧延时产生的负载原因着手，基于绘制命令、顶点着色器、片段着色器的相关数据，对实时渲染程序的帧延时及图形质量用线性模型、神经网络模型进行更准确的数值预测，并在原方法的基础上，针对帧延时对时间敏感的特性对线性模型做了必要的改进，引入着色器的相关参数对神经网络模型进行了优化。但该技术方案是应用在游戏引擎中，环境光贴图，阴影算法、抗锯齿等都是目前gis中不支持的功能。
[0008]因此，为了能顺利渲染千级的动态目标及其标签，保证三维地理信息系统背景正常使用，并且渲染帧数可以达到肉眼无法察觉到卡顿的25FPS以上，本专利技术提供了一种地理信息系统中动态目标及标签的高性能渲染方法。

技术实现思路

[0009]本专利技术要解决的技术问题是，提出一种地理信息系统中动态目标及标签的高性能渲染方法，即使在3D GIS中渲染大量动目标，如目标数量较多(参考超过2000及以上)、目标对应的标签较复杂(参考图标、文字描述等)、并且显示所有动目标对应的移动轨迹时，浏览器不会出现肉眼可见的卡顿，页面帧数能保持在25FPS以上。
[0010]为了解决上述技术问题，本专利技术采用的技术方案是：该地理信息系统中动态目标及标签的高性能渲染方法，具体包括以下步骤：
[0011]S1：通过canvas方法创建一个canvas画布，将后续的操作限制在所述canvas画布中；
[0012]S2：在canvas画布上制作自定义标签；
[0013]S3：在canvas画布上制作svg格式矢量图片；
[0014]S4：通过步骤S2中自定义标签进行重新编码，在canvas画布上制作svg格式矢量图片；
[0015]S5：使用二、三维场景绘制工具，在场景中插入svg格式矢量图片；
[0016]S6：在地理信息系统的业务层获取生成的svg矢量图片，并放入地图中；
[0017]S7：清空canvas画布的所有元素，完成一个动态目标的自定义标签；
[0018]S8：重复步骤S1～步骤S7直至绘入与动态目标数量相对应的自定义标签。
[0019]采用上述技术方案，使用WebGL提供的基础API在地图中插入动态目标、并加上文字类型标签，本质上是在浏览器中插入与之对应的多个DOM元素用于展示，但当动目标数量达到千级及以上时，由于浏览器渲染DOM元素的特性，浏览器势必会出现卡顿、帧数会下降等情况；通过类似的展示方式替代DOM元素插入，从而减少插入DOM元素的次数；矢量由于其特性在地理信息系统中的应用已经很广泛，包括地图背景瓦片的渲染等，矢量图形是良好的替代方案；将文字和图标等进行自定义绘制、制作矢量图片、再通过常规的技术框架API插入矢量图片；实现了在不丢失任何样式、展示完全相同的前提下，用矢量图片大幅度提高了二、三维地理信息系统的展示性能。
[0020]优选地，在所述步骤S1中通过canvas中创建2D画布的方法创建一个2D的canvas画
布；创建2D画布的方法采用本领域技术人员常规现有的即可。
[0021]优选地，所述步骤S2中进行制作自定义标签，具体步骤为：
[0022]S21：使用canvas画布中用于填充属性颜色的方法fillStyle设置文字的大小和颜色属性；
[0023]S22：使用canvas画布中用于绘制一本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种地理信息系统中动态目标及标签的高性能渲染方法，其特征在于，具体包括以下步骤：S1：通过canvas方法创建一个canvas画布，将后续的操作限制在所述canvas画布中；S2：在canvas画布上制作自定义标签；S3：在canvas画布上制作svg格式矢量图片；S4：通过步骤S2中自定义标签进行重新编码，在canvas画布上制作svg格式矢量图片；S5：使用二、三维场景绘制工具，在场景中插入svg格式矢量图片；S6：在地理信息系统的业务层获取生成的svg矢量图片，并放入地图中；S7：清空canvas画布的所有元素，完成一个动态目标的自定义标签；S8：重复步骤S1～步骤S7直至绘入与动态目标数量相对应的自定义标签。2.根据权利要求1所述的地理信息系统中动态目标及标签的高性能渲染方法，其特征在于，在所述步骤S1中通过canvas中创建2D画布的方法创建一个2D的canvas画布。3.根据权利要求1所述的地理信息系统中动态目标及标签的高性能渲染方法，其特征在于，所述步骤S2中进行制作自定义标签，具体步骤为：S21：使用canvas画布中用于填充属性颜色的方法fillStyle设置文字的大小和颜色属性；S22：使用canvas画布中用于绘制一个矩形的方法fillReact设置文字的区域大小和位置；S23：使用canvas画布中用于填充文字的方法fillText设置文字内容将所需要的文字放入canvas画布中；S24：使用canvas画布中用于描绘矩形的边框的方法strokeRect设置文字区域的边框；S25：使用canvas画布中用于设置边框的颜色属性的方法strokeStyle设置文字区域的边框的颜色属性；S26：使用canvas画布中用于添加元素到固定容器的方法add方法将绘制好的自定义标签暂存在canvas画布中；S27：使用c...

【专利技术属性】
技术研发人员：沈易，黄海涛，
申请(专利权)人：南京红松信息技术有限公司，
类型：发明
国别省市：