CN116740298A - 一种基于三维引擎的场景实时地图的构建方法 - Google Patents
一种基于三维引擎的场景实时地图的构建方法 Download PDFInfo
- Publication number
- CN116740298A CN116740298A CN202310979843.XA CN202310979843A CN116740298A CN 116740298 A CN116740298 A CN 116740298A CN 202310979843 A CN202310979843 A CN 202310979843A CN 116740298 A CN116740298 A CN 116740298A
- Authority
- CN
- China
- Prior art keywords
- scene
- map
- cursor
- camera
- size
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 38
- 238000009877 rendering Methods 0.000 claims abstract description 11
- 230000001131 transforming effect Effects 0.000 claims abstract description 4
- 230000000007 visual effect Effects 0.000 claims description 24
- 230000000694 effects Effects 0.000 claims description 10
- 230000009466 transformation Effects 0.000 claims description 3
- 230000003631 expected effect Effects 0.000 claims description 2
- 238000012800 visualization Methods 0.000 abstract description 2
- 238000010276 construction Methods 0.000 description 8
- 230000009286 beneficial effect Effects 0.000 description 1
- 239000003086 colorant Substances 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000001105 regulatory effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T17/00—Three dimensional [3D] modelling, e.g. data description of 3D objects
- G06T17/05—Geographic models
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T15/00—3D [Three Dimensional] image rendering
- G06T15/005—General purpose rendering architectures
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- Geometry (AREA)
- Software Systems (AREA)
- Computer Graphics (AREA)
- General Physics & Mathematics (AREA)
- Theoretical Computer Science (AREA)
- Remote Sensing (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种基于三维引擎的场景实时地图的构建方法，属于三维可视化技术领域。特征包括：步骤1：获取场景尺寸；步骤2：配置底图；步骤3：创建场景实时地图数据模板；步骤4：创建DOM元素展示地图；步骤5：构建场景实时地图，计算相机数据信息并实时更新地图位置；步骤5.1：求出场景缩放因子M；步骤5.2：计算游标位置及其旋转角度；步骤5.3：计算并变换底图位置；步骤5.4：将实时获取的相机位置、旋转角度经步骤5.1‑5.3计算的结果设置给底图和游标DOM元素属性，实现地图动态实时更新。本发明无需对场景的三维模型多次渲染，对CPU和GPU都相对友好，模型复杂度不会加倍，也不会导致渲染帧率下降。
Description
技术领域
本发明涉及一种基于三维引擎的场景实时地图的构建方法，属于三维可视化技术领域。
背景技术
场景实时地图是一种在运行时动态生成和更新的地图，它能够随着时间的推移实时更新，并实时持续地反映环境的状态及变化，直观地表达用户在场景中的实时位置，保持地图的最新状态。
公开号为CN114882188A的中国发明专利申请披露了一种基于数字孪生的小地图的实现方法，该方法的技术路线是：先创建小地图上的标识样式（即小地图的DOM元素容器的样式），用自定义设置或构建专门的点位模型来标识；再获取三维模型底面与存储小地图的DOM元素容器，并创建三维模型场景正交相机并设置三维模型场景正交相机的位置，使得底面上的模型完整展示在小地图的DOM元素容器；将小地图上不需要展示的模型添加至所述不可见图层，隐藏部分不必要的模型。
上述的实现方法对同一三维模型渲染两次，都需要对模型进行单独的渲染计算，会导致CPU和GPU负担增加；当模型复杂度越高，渲染帧率下降的越快。上述过程需要有专业理论知识和强大的动手能力支撑才能做到，需本行业的专业人员才能完成，操作体验差，效率低。
发明内容
本专利旨在解决现有技术中存在的不足，提出一种基于三维引擎的场景实时地图的构建方法，该方法与背景技术中所引证的专利文献相比，无需对场景的三维模型多次渲染，对CPU和GPU都相对友好，模型复杂度不会加倍，也不会导致渲染帧率下降。
本发明解决其技术问题采取的技术方案是：
一种基于三维引擎的场景实时地图的构建方法，其特殊之处在于，包括以下步骤：
步骤1：获取场景尺寸；
步骤2：配置底图；
步骤3：创建场景实时地图数据模板；
步骤4：创建DOM元素展示地图；
步骤5：构建场景实时地图，计算相机数据信息并实时更新地图位置；
步骤5.1：由场景尺寸高除以底图尺寸高求出场景缩放因子M；
步骤5.2：基于游标位置与相机位置之间的对应关系，计算游标位置及其旋转角度；
计算游标的纵向偏移量：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量；再加上底图高度mapSize.height的一半，减去游标高度cursorSize.height的一半，得到游标纵向偏移量，计算公式为：
(Camera.position.x-center.position.x)/M+mapSize.height/2-cursorSize.height/2；
计算游标的横向偏移量：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量；再加上底图宽度mapSize.width的一半，减去游标宽度cursorSize.width的一半，得到游标横向偏移量，计算公式为：
(Camera.position.z-center.position.z)/M+mapSize.width/2-cursorSize.width/2；
设置游标样式top属性值为纵向值偏移量，游标样式left属性为横向偏移量；
设置游标DOM元素的旋转transform属性值为rotate(相机旋转角度y单位为rad)。
步骤5.3：基于游标位置与相机位置之间的对应关系，计算并变换底图位置，以保证游标移动时其位置始终实时显示于可视区域viewSize的正中心；
计算底图向下偏移距离值：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域高度viewSize.height一半减去偏移量得纵向偏移量，向下偏移距离值计算方式为-50%加纵向偏移量，-50%是将底图的纵向中心点对准可视区域的左上角二维坐标(0,0)，加纵向偏移量后游标纵向中心点显示于可视区域viewSize的正中心，即：
计算底图向右偏移距离值：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域宽度viewSize.width的一半减去偏移量得出横向偏移量，向右偏移距离值计算方式为-50%加横向x轴方向偏移量，-50%是将底图的横向中心点对准可视区域的左上角二维坐标(0,0)，加横向偏移量后游标横向中心点显示于可视区域viewSize的正中心，即：
设置底图变换属性transform的值，将向右向下偏移距离值设置到底图，设置方式如下：
transform:translate(calc(向下偏移距离值),calc(向右偏移距离值))。
步骤5.4：在每帧渲染开始，将实时获取的相机位置、旋转角度经过步骤5.1-5.3计算的结果设置给底图和游标DOM元素属性，以实现底图和游标在地图中的动态实时更新。
进一步地，所述步骤1具体为：
基于场景内所有模型的包围盒信息求出场景的最大点max和最小点min，并借由该两点确定场景包围盒boundingBox及场景中心点center，进而得到场景尺寸configSize：场景尺寸宽configSize.Height为最大点max与最小点min的z值差，场景尺寸高configSize.Height为最大点max与最小点min的x值差，场景尺寸的宽高比aRatio为场景尺寸宽除以场景尺寸高。
进一步地，所述步骤2的配置底图，方式之一为：
创建相机，设置相机的视野缩放比aspect及上下左右限制，使相机看向场景中心点ceter，对正对准场景所有模型进行截图，获取底图图片image；
其中，相机的视野缩放比aspect为绘制场景的DOM元素的宽高比除以场景尺寸宽高比；相机右限制为场景尺寸宽除以2乘以视野缩放比aspect，相机左限制为相机右限制乘以-1，相机上限制为场景高除以2，相机下限制为相机上限制乘以-1。
进一步地，所述步骤2的配置底图，方式之二为：
上传预设比例的底图图片image。
进一步地，所述步骤3的模板数据内容包括：可视区域viewSize、底图尺寸mapSize、底图图片image、游标尺寸cursorSize、扇形游标图片cursor和配置美化样式；其中，可视区域viewSize、底图尺寸mapSize和游标尺寸cursorSize为自定义项，游标尺寸cursorSize小于可视区域viewSize；扇形游标图片cursor朝向设置为向上。
进一步地，所述步骤4共创建3层DOM元素：最外层是地图容器，大小与可视区域viewSize一致；第二层是底图容器，宽高为底图尺寸mapSize，其背景图效果为底图图片image；最里层是游标，宽高为游标尺寸cursorSize，其背景图效果为扇形游标图片cursor；游标代表相机位置与朝向。
进一步地，当步骤5的地图配置与预期的效果有差异时，修改步骤3中的场景实时地图数据，对地图进行重新构建。
本发明的一种基于三维引擎的场景实时地图的构建方法，与现有技术相比，有益效果在于：
1、本发明的方法不需要对模型进行多次加载和渲染，对CPU和GPU都相对友好，模型复杂度不会加倍，渲染帧率不会下降，对硬件设备要求较低；
2、本发明的方法可以自动计算地图尺寸并截取准确底图，而对比专利需要了解模型的结构，对不可见图层要有深入理解，才能进行相关操作。
3、本发明的方法在操作过程中不需要关注模型或图层，只需关注地图展示形式的美观度，实时地图的构建过程，用户关注重点在构建过程，可随时修改参数进行重新构建，实时获得满意的效果。
4、传统的场景实时地图的构建方法需要有专业理论知识和强大的动手能力支撑，而本方法在实践时不要求专业人员操作，会基本的电脑使用人群也可完成炫酷的场景实时地图的构建过程。
附图说明
图1是实施例一的实时地图构建的总流程框图；
图2是实施例一的步骤5具体拆解、渲染过程中检测每一帧渲染更新DOM元素样式所述的流程图；
具体实施方式
为能清楚说明本发明方案的技术特点，下面将通过具体实施方式，并结合其附图，对本发明的技术方案作进一步详细阐述，以下实施例用于说明本发明，但不能用来限制本发明的范围。
下文的公开提供了许多不同的实施例用来实现本发明的不同结构。为了简化本发明的公开，下文中对特定例子的部件和设置进行描述。此外，本发明可以在不同例子中重复参考数字和/或字母。这种重复是为了简化和清楚的目的，其本身不指示所讨论各种实施例和/或设置之间的关系。应当注意，在附图中所图示的部件不一定按比例绘制。本发明省略了对公知组件和处理技术及工艺的描述以避免不必要地限制本发明。
实施例一
一种基于三维引擎的场景实时地图的构建方法，包括以下步骤：
步骤1：获取场景尺寸
假设场景中的模型是一间厂房，通过计算场景内的所有模型的包围盒信息，求出场景的最大点max{x:536.4840087890625,y:62.657749176025455,z:579.0009765625}、场景的最小点min{x:-671.6409912109375,y:-0.16026687622070312,z:-305.1238098144531}；
基于场景的最大点max和最小点min，求出场景包围盒boundingBox的信息：
{center:{x:-67.5784912109375,y:31.248741149902376,z:136.93858337402344},maximum:{x:536.4840087890625,y:62.657749176025455,z:579.0009765625},minimum:{x:-671.6409912109375,y:-0.16026687622070312,z:-305.1238098144531}}；
进而得出场景尺寸configSize的宽和高，场景尺寸宽configSize.width为场景最大点max与最小点min的z值差，即：
boundingBox.maximum.z-boundingBox.minimum.z
=579.0009765625-（-305.1238098144531）
=884.1247863769531；
场景尺寸高configSize.height为场景最大点max与最小点min的x值差，即：
boundingBox.maximum.x-boundingBox.minimum.x
=536.4840087890625-（-671.6409912109375）
=1208.125；
进一步，可求出场景尺寸的宽高比aRatio为场景尺寸宽除以场景尺寸高，即：
configSize.width/configSize.height
=884.1247863769531/1208.125
=0.731815653493598。
步骤2：配置底图
有两种底图配置方法，一种是通过相机截取底图图片，另一种是直接上传同比例的美化图片。
本实施例采用的是相机截取底图的方式，具体做法如下：
创建一个通用相机（第一人称）；
设置相机的视野缩放比aspect和相机的上下左右限制：
相机的视野缩放比aspect可由绘制场景的DOM元素宽高比sRatio除以场景尺寸的宽高比aRatio求出，即:
sRatio/aRatio
=1.471461187214612/0.731815653493598
=2.0106992521819356；
相机右限制由场景尺寸宽除以2乘以视野缩放比求出，即：
configSize.width/2*aspect
=884.1247863769531/2*2.0106992521819356
=888.8545234018266；
相机左限制为相机右限制乘以-1，即：
888.8545234018266*-1
=-888.8545234018266；
相机上限制为场景尺寸高除以2，即：
configSize.height/2
=1208.125/2
=604.0625；
相机下限制为相机上限制乘以-1，即：
604.0625*-1
=-604.0625；
将相机看向场景中心点ceter，对正对准场景所有模型进行截图，截取png类型的底图图片image，截图时默认的图片宽度为512像素，图片高度为图片宽度512像素除以场景尺寸宽高比0.731815653493598，计算得到的图片高度为699.6297463108024约699.63像素。在此需要说明的是：不按照1024像素或2048像素为宽进行截取的做法是为了优化图片大小，节约性能。
当然，如果对截取的底图不满意，用户也可直接上传宽为512像素、高为699.63像素的同比例美化图片作为底图。
步骤3：创建场景实时地图数据模板
模板数据内容包括：可视区域viewSize，底图尺寸mapSize，底图图片image，游标尺寸cursorSize，扇形游标图片cursor和配置美化样式；
本实施中，所述可视区域viewSize的宽、高为200像素*200像素，底图图片通过截取或上传获得，本实施例底图尺寸mapSize的宽、高由所述步骤2所得为512像素*699.63像素，游标尺寸cursorSize的宽、高为60像素*60像素；当游标尺寸cursorSize大于可视区域viewSize时会遮挡地图影响视野，故游标尺寸cursorSize应小于可视区域viewSize；扇形游标图片cursor为自定义图片且默认方向朝上，扇形游标图片cursor的朝向会影响到相机旋转时，朝向是否准确直接决定了地图组件的准确性，例如扇形游标图片朝向朝下时，原本相机是向左移动会看到图标朝向背向向左移动。
步骤4：创建DOM元素展示地图
本实施例共创建有3层DOM元素，最外层是地图容器，大小与可视区域viewSize一致，即宽为200像素、高为200像素；第二层是底图容器，宽高为底图尺寸mapSize，即宽为512像素、高为699.63像素，底图容器的背景图效果为底图图片；最里层是游标，宽高为游标尺寸cursorSize，即宽为60像素、高为60像素；游标的背景图效果为扇形游标图片；对地图容器、游标元素可以进行美化样式，可以为圆角、方角等多种形状；设置地图容器、游标元素边框颜色为透明色，边框圆角，游标代表相机位置与朝向，如果DOM元素已创建则重新绘制DOM元素。
步骤5：构建场景实时地图，计算相机数据信息并实时更新地图位置
步骤5.1：计算场景缩放因子
由场景尺寸高除以底图尺寸高求出场景缩放因子M，即：
configSize.Height/mapSize.height
=1208.125/699.63
=1.7268055972442578；
步骤5.2：基于游标位置与相机位置之间的对应关系，计算游标位置及其旋转角度
计算游标的纵向偏移量：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量，因游标是以场景中心点center为原点进行变换，相机位于场景中心点center则对应于底图左上角的二维坐标(0,0)，故所述偏移量为0；在偏移量的基础上加上底图高度mapSize.height的一半，中心点会偏移到底图纵向的中心点；由于游标是有高度的，所以需要再减去游标高度cursorSize.height的一半，得到游标纵向偏移量，计算公式为：
(Camera.position.x-center.position.x)/M+mapSize.height/2-cursorSize.height/2
=0/1.7268055972442578+699.63/2-60/2
=0+349.815-30
=319.815
计算游标的横向偏移量：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量，因游标是以场景中心点center为原点进行变换，相机位于场景中心点center则对应于游标位于底图左上角的二维坐标(0,0)，故所述偏移量为0；在偏移量的基础上加上底图宽度mapSize.width的一半，中心点偏移到底图横向的中心点；由于游标是有宽度的，所以需要再减去游标宽度cursorSize.width的一半，得到游标横向偏移量，计算公式为：
(Camera.position.z-center.position.z)/M+mapSize.width/2-cursorSize.width/2；
=0/1.7268055972442578+512/2-60/2
=0+256-30
=226
设置游标样式top属性值为纵向偏移量，单位是像素，设置游标样式left属性为横向偏移量，单位是像素，即top:319.815px，left:226px。
因游标旋转角度y与DOM元素旋转角度均为角度制，二者不需要转换，故游标旋转角度y也即场景相机的旋转角度；设置游标DOM元素的旋转transform属性值为rotate(相机旋转角度y单位为rad),即设置游标DOM元素的旋转为transform：“rotate(0.6013873979430928rad)”。
步骤5.3：基于游标位置与相机位置之间的对应关系，计算并变换底图位置，以保证游标移动时其位置始终实时显示于可视区域viewSize的正中心；
计算底图向下偏移距离值：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域高度viewSize.height一半减去偏移量得纵向偏移量（单位是像素），向下偏移距离值计算方式为-50%加纵向偏移量，-50%是将底图的纵向中心点对准可视区域的左上角二维坐标(0,0)，加纵向偏移量后游标纵向中心点显示于可视区域viewSize的正中心，即：
计算底图向右偏移距离值：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域宽度viewSize.width的一半减去偏移量得出横向偏移量（单位是像素），向右偏移距离值计算方式为-50%加横向偏移量，-50%是将底图的纵向中心点对准可视区域的左上角二维坐标(0,0)，加纵向偏移量后游标纵向中心点显示于可视区域viewSize的正中心，即：
设置底图变换属性transform的值，将向右向下偏移距离值设置到底图，设置方式如下：
transform:translate(calc(向下偏移距离值),calc(向右偏移距离值))scale(1))。
即设置为：
。
步骤5.4：在每帧渲染开始，将实时获取的相机位置、旋转角度经过步骤5.1-5.3计算的结果设置给底图和游标DOM元素属性，以实现底图和游标在地图中的动态实时更新。
本发明解决的问题是避免模型二次渲染增加硬件性能负担，快捷准确的描述构建过程和成果，在构建准备时不需要关注模型结构，了解模型含义，添加新图层等复杂专业性强等操作；与现有技术相比，本发明关注点更少，实现自定义实时可见的地图构建过程，用户操作更简易，减少用户学习、使用及操作成本，提高用户使用效率。
本发明通过自动截取底图，根据相机位置准确的描述游标位置，展示场景全貌供二次编辑美化，可直接编辑地图样式效果、游标尺寸效果等多项参数，完全是用户自定义的，所见即所得，直接调整地图实时构建过程的表现效果，实时利用构建过程，直观地表达用户在场景中的实时位置。
最后应当说明的是：以上实施例仅用以说明本发明的技术方案而非对其限制，尽管参照上述实施例对本发明进行了详细的说明，所属领域的普通技术人员应当理解：依然可以对本发明的具体实施方式进行修改或者等同替换，而未脱离本发明精神和范围的任何修改或者等同替换，其均应涵盖在本发明的权利要求保护范围之内。
Claims (7)
1.一种基于三维引擎的场景实时地图的构建方法，其特征在于，包括以下步骤：
步骤1：获取场景尺寸；
步骤2：配置底图；
步骤3：创建场景实时地图数据模板；
步骤4：创建DOM元素展示地图；
步骤5：构建场景实时地图，计算相机数据信息并实时更新地图位置；
步骤5.1：由场景尺寸高除以底图尺寸高求出场景缩放因子M；
步骤5.2：基于游标位置与相机位置之间的对应关系，计算游标位置及其旋转角度；
计算游标的纵向偏移量：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量；再加上底图高度mapSize.height的一半，减去游标高度cursorSize.height的一半，得到游标纵向偏移量，计算公式为：
(Camera.position.x-center.position.x)/M+mapSize.height/2-cursorSize.height/2；
计算游标的横向偏移量：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出游标DOM元素以底图左上角二维坐标(0,0)的偏移量；再加上底图宽度mapSize.width的一半，减去游标宽度cursorSize.width的一半，得到游标横向偏移量，计算公式为：
(Camera.position.z-center.position.z)/M+mapSize.width/2-cursorSize.width/2；
设置游标样式top属性值为纵向偏移量，游标样式left属性为横向偏移量；
设置游标DOM元素的旋转transform属性值为rotate 相机旋转角度y，单位为rad，
步骤5.3：基于游标位置与相机位置之间的对应关系，计算并变换底图位置，以保证游标移动时其位置始终实时显示于可视区域viewSize的正中心；
计算底图向下偏移距离值：相机位置的x值Camera.position.x减去场景中心点的x值center.position.x再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域高度viewSize.height一半减去偏移量得纵向偏移量，向下偏移距离值计算方式为-50%加纵向偏移量，-50%是将底图的纵向中心点对准可视区域左上角二维坐标(0,0)，加纵向偏移量后游标纵向中心点显示于可视区域viewSize的正中心，即：
计算底图向右偏移距离值：相机位置的z值Camera.position.z减去场景中心点的z值center.position.z再除以缩放因子M得出底图以可视区域viewSize左上角二维坐标(0,0)进行偏移的偏移量，若相机在场景中心点时，可视区域宽度viewSize.width的一半减去偏移量得出横向x轴方向偏移量，向右偏移距离值计算方式为-50%加横向偏移量，-50%是将底图的横向中心点对准可视区域左上角二维坐标(0,0)，加横向偏移量后游标横向中心点显示于可视区域viewSize的正中心，即：
设置底图变换属性transform的值，将向右向下偏移距离值设置到底图，设置方式如下：
transform:translate(calc(向下偏移距离值),calc(向右偏移距离值))，
步骤5.4：在每帧渲染开始，将实时获取的相机位置、旋转角度经过步骤5.1-5.3计算的结果设置给底图和游标DOM元素属性，以实现底图和游标在地图中的动态实时更新。
2.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，所述步骤1具体包括：
基于场景内所有模型的包围盒信息求出场景的最大点max和最小点min，并借由该两点确定场景包围盒boundingBox及场景中心点center，进而得到场景尺寸configSize：场景尺寸宽configSize. Width为最大点max与最小点min的z值差，场景尺寸高configSize.Height为最大点max与最小点min的x值差，场景尺寸的宽高比aRatio为场景尺寸宽除以场景尺寸高。
3.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，所述步骤2的配置底图，方式之一为：
创建相机，设置相机的视野缩放比aspect及上下左右限制，使相机看向场景中心点ceter，对正对准场景所有模型进行截图，获取底图图片image；
其中，相机的视野缩放比aspect为绘制场景的DOM元素的宽高比除以场景尺寸宽高比；相机右限制为场景尺寸宽除以2乘以视野缩放比aspect，相机左限制为相机右限制乘以-1，相机上限制为场景高除以2，相机下限制为相机上限制乘以-1。
4.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，所述步骤2的配置底图，方式之二为：
上传预设比例的底图图片image。
5.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，
所述步骤3的模板数据内容包括：可视区域viewSize、底图尺寸mapSize、底图图片image、游标尺寸cursorSize、扇形游标图片cursor和配置美化样式；其中，可视区域viewSize、底图尺寸mapSize和游标尺寸cursorSize为自定义项，游标尺寸cursorSize小于可视区域viewSize；扇形游标图片cursor朝向设置为向上。
6.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，
所述步骤4共创建3层DOM元素：最外层是地图容器，大小与可视区域viewSize一致；第二层是底图容器，宽高为底图尺寸mapSize，其背景图效果为底图图片image；最里层是游标，宽高为游标尺寸cursorSize，其背景图效果为扇形游标图片cursor；游标代表相机位置与朝向。
7.如权利要求1所述的一种三维引擎的场景实时地图的构建方法，其特征在于，
当步骤5的地图配置与预期的效果有差异时，修改步骤3中的场景实时地图数据，对地图进行重新构建。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202310979843.XA CN116740298B (zh) | 2023-08-07 | 2023-08-07 | 一种基于三维引擎的场景实时地图的构建方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202310979843.XA CN116740298B (zh) | 2023-08-07 | 2023-08-07 | 一种基于三维引擎的场景实时地图的构建方法 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN116740298A true CN116740298A (zh) | 2023-09-12 |
| CN116740298B CN116740298B (zh) | 2024-04-26 |
Family
ID=87915341
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202310979843.XA Active CN116740298B (zh) | 2023-08-07 | 2023-08-07 | 一种基于三维引擎的场景实时地图的构建方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN116740298B (zh) |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US5550959A (en) * | 1993-05-27 | 1996-08-27 | Novalogic, Inc. | Technique and system for the real-time generation of perspective images |
| JP2002023905A (ja) * | 2000-07-03 | 2002-01-25 | Matsushita Electric Ind Co Ltd | 対話式シーンのユーザアクションを不変変換処理する方法と装置 |
| CN113781628A (zh) * | 2020-11-26 | 2021-12-10 | 北京沃东天骏信息技术有限公司 | 一种三维场景搭建方法和装置 |
| CN113963100A (zh) * | 2021-10-25 | 2022-01-21 | 广东工业大学 | 一种数字孪生仿真场景的三维模型渲染方法及系统 |
| US20220044474A1 (en) * | 2019-11-21 | 2022-02-10 | Dalian University Of Technology | Method for constructing grid map by using binocular stereo camera |
| CN114882188A (zh) * | 2022-05-12 | 2022-08-09 | 西安塔力科技有限公司 | 一种基于数字孪生的小地图的实现方法 |
-
2023
- 2023-08-07 CN CN202310979843.XA patent/CN116740298B/zh active Active
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US5550959A (en) * | 1993-05-27 | 1996-08-27 | Novalogic, Inc. | Technique and system for the real-time generation of perspective images |
| JP2002023905A (ja) * | 2000-07-03 | 2002-01-25 | Matsushita Electric Ind Co Ltd | 対話式シーンのユーザアクションを不変変換処理する方法と装置 |
| US20220044474A1 (en) * | 2019-11-21 | 2022-02-10 | Dalian University Of Technology | Method for constructing grid map by using binocular stereo camera |
| CN113781628A (zh) * | 2020-11-26 | 2021-12-10 | 北京沃东天骏信息技术有限公司 | 一种三维场景搭建方法和装置 |
| CN113963100A (zh) * | 2021-10-25 | 2022-01-21 | 广东工业大学 | 一种数字孪生仿真场景的三维模型渲染方法及系统 |
| CN114882188A (zh) * | 2022-05-12 | 2022-08-09 | 西安塔力科技有限公司 | 一种基于数字孪生的小地图的实现方法 |
Non-Patent Citations (4)
| Title |
|---|
| NOKIA, NOKIA SHANGHAI-BELL: "S2-1907401 "UDR service for mapping IMS Public Identity to HSS Group ID for HSS selection"", 3GPP TSG_SA\\WG2_ARCH, no. 2 * |
| S. JIANG;HUAWEI TECHNOLOGIES CO., LTD; Y. FU; CNNIC;B. LIU;HUAWEI TECHNOLOGIES CO., LTD; P. DEACON;IEA SOFTWARE, INC.;: "RADIUS Attribute for MAP draft-ietf-softwire-map-radius-05", IETF * |
| 陈彤;邓钟;: "osg环境下虚拟地理场景系统设计与实现", 福建电脑, no. 03 * |
| 黄奎;: "Web三维电子地图可视化技术的研究与实现", 黑龙江科技信息, no. 08 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN116740298B (zh) | 2024-04-26 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN104794758B (zh) | 一种三维图像的裁剪方法 | |
| US20130300740A1 (en) | System and Method for Displaying Data Having Spatial Coordinates | |
| US8436852B2 (en) | Image editing consistent with scene geometry | |
| US8269767B2 (en) | Multiscale three-dimensional reference grid | |
| US8259103B2 (en) | Position pegs for a three-dimensional reference grid | |
| CN109448137B (zh) | 交互方法、交互装置、电子设备及存储介质 | |
| CN104183016B (zh) | 一种快速的2.5维建筑物模型的构建方法 | |
| US10878599B2 (en) | Soft-occlusion for computer graphics rendering | |
| CN111325824A (zh) | 图像数据展示方法、装置、电子设备及存储介质 | |
| US20080076556A1 (en) | Simulated 3D View of 2D Background Images and Game Objects | |
| CN110349261B (zh) | 基于gis生成三维热力图的方法 | |
| WO2023066121A1 (zh) | 三维模型的渲染 | |
| CN117292079B (zh) | 应用于数字孪生的多维度场景坐标点位转换及映射方法 | |
| US10909752B2 (en) | All-around spherical light field rendering method | |
| CN116740298B (zh) | 一种基于三维引擎的场景实时地图的构建方法 | |
| JP2019121238A (ja) | プログラム、画像処理方法、及び画像処理装置 | |
| JP2003331313A (ja) | 画像処理プログラム | |
| CN110910482B (zh) | 视频数据组织调度的方法、系统及可读存储介质 | |
| CN107481194B (zh) | 基于相册应用的相框内照片旋转自适应缩放的方法 | |
| Brosz et al. | Shape defined panoramas | |
| CN112002019A (zh) | 一种基于mr混合现实的模拟人物阴影的方法 | |
| JP2000011208A (ja) | 画像表示装置及び方法 | |
| Liu | A novel Mesa-based OpenGL implementation on an FPGA-based embedded system | |
| JP2005208867A (ja) | ３次元コンピュータ・グラフィックス・モデリング・システム | |
| CN111506680B (zh) | 地形数据生成、渲染方法及装置、介质、服务器、终端 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |