CN113487718A - 一种Web端三维地质模型动态剖切与剖面填充方法 - Google Patents
一种Web端三维地质模型动态剖切与剖面填充方法 Download PDFInfo
- Publication number
- CN113487718A CN113487718A CN202110758395.1A CN202110758395A CN113487718A CN 113487718 A CN113487718 A CN 113487718A CN 202110758395 A CN202110758395 A CN 202110758395A CN 113487718 A CN113487718 A CN 113487718A
- Authority
- CN
- China
- Prior art keywords
- section
- dimensional geological
- geological model
- sectioning
- model
- 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
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T15/00—3D [Three Dimensional] image rendering
- G06T15/08—Volume rendering
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T15/00—3D [Three Dimensional] image rendering
- G06T15/50—Lighting effects
Landscapes
- Engineering & Computer Science (AREA)
- Computer Graphics (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Theoretical Computer Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种Web端三维地质模型动态剖切与剖面填充方法，包括步骤：通过Three.js加载并展示三维地质模型；通过Three.js中模型材质的clippingPlans属性设定剖面；采用设定的剖面对三维地质模型进行剖切；确认剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面，通过模板测试实现剖面填充；移动或点选新的剖面，实时对三维地质模型的所有地层完成动态剖切与剖面填充。其显著效果是：灵活方便的实现了三维地质模型的动态剖切和剖面填充，渲染模型剖面时的快速和有效，结合剖切盒以及点选确定剖面等操作，极大地提高了用户进行三维地质模型剖切时的体验。
Description
技术领域
本发明涉及到地质模型三维展示技术领域，具体涉及一种Web端三维地质模型动态剖切与剖面填充方法。
背景技术
现今三维技术得到了长足发展，三维模型的展示和分析和应用日渐普及，但是在各专业行业领域中，例如地质行业，使用的三维模型程序任然是传统的桌面客户端程序，使用环境受限于特定操作系统，不具备跨平台访问能力。随着WebGL技术发展，在Web进行三维展示和分析的能力越来越强大，使得Web端程序可以不受跨平台影响、无需安装复杂软件，就可以更便捷的提供三维模型展示分析功能。当今众多行业系统、软件都朝着移动、Web的方向进行发展，讲传统桌面客户端的三维功能迁移到Web端，在Web端展示和处理三维地质模型越来越重要。
然而，三维地质模型与其他3D模型不同点在于三维地质模型是由不同地层的模型组合而成，在现有技术中，一是缺乏对三维地质模型的剖切处理，常常是对单个3D模型的处理。另一方面，三维地质模型的剖切大多基于桌面端应用的预处理，比如提前制作好剖切后的三维地质模型剖面，然后在Web端进行展示，这样用户无法动态地进行三维地质模型的剖切，比如选择剖切的方向和角度等，缺乏灵活性。而部分可以进行动态剖切的方式中，由于三维地质模型本身是空心的，得到的是没有进行填充的剖面或者只能支持单层剖面，未进行空心的模型的剖面填充，无法很好的观察三维地质模型剖面的情况，同时由于多层地质模型的缘故，性能上偏低。基于以上的情况，实现在Web端进行三维地质模型的动态剖切与剖面填充显得格为重要。
发明内容
针对现有技术的不足，本发明的目的是提供一种Web端三维地质模型动态剖切与剖面填充方法，基于Web端开源的WebGL 3D引擎Three.js进行三维地质模型的展示和处理，并通过WebGL的模板缓冲与模板测试等进行剖面填充，能够灵活方便的实现渲染模型剖面时的快速和有效，并极大地优化用户进行三维地质模型剖切时的体验。
为达到上述目的，本发明采用的技术方案如下：
一种Web端三维地质模型动态剖切与剖面填充方法，其关键在于，包括如下步骤：
步骤1、通过Three.js加载并展示三维地质模型；
步骤2、通过Three.js中模型材质的clippingPlans属性设定剖面；
步骤3、采用设定的剖面对三维地质模型进行剖切；
步骤4、确认剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面，通过模板测试实现剖面填充；
步骤5、移动或点选新的剖面，并返回步骤3循环进行，直至对三维地质模型的所有地层完成剖切与剖面填充。
进一步的，步骤1中在加载三维地质模型时，需通过Three.js提前创建必须的场景、相机与渲染器。
进一步的，步骤1中通过Three.js内置的GLTFLoader加载三维地质模型。
进一步的，步骤3中采用剖切盒或剖切线对三维地质模型进行剖切。
进一步的，步骤4中所述剖面所在的片元的确定步骤为：
通过Three.js中模型材质的side属性进行控制，分别只渲染三维地质模型的背面和正面；
当渲染三维地质模型的背面时，通过模板测试，将背面的所有片元的模板缓冲值加1；
当渲染三维地质模型的正面时，通过模板测试，将正面的所有片元的模板缓冲值减1；
得到的所有模板缓冲值为1的片元即为剖面所在的片元。
进一步的，步骤4中通过模板测试实现剖面填充的具体步骤为：
基于确定的剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面；
通过模板测试，保留模板缓冲值为1的片元，丢弃其余片元，实现剖面的填充。
进一步的，步骤5中对三维地质模型的所有地层进行剖面填充时，需要为每个地层所在的片元指定默认值，在默认值上进行加1和减1操作，当片元的模板缓冲值为默认值加1时，保留相应的片元，否则丢弃相应的片元。
本发明的显著效果是：相较于传统方法中三维剖切缺乏灵活性、未对空心的木星进行剖面填充以及缺乏定制化处理等缺陷，本发明基于Three.js实现了三维地质模型的动态剖切和剖面填充，用户可以手动操作剖切的方向和角度以及距离等，更为灵活和方便；在首次加载后，可以离线使用，无需网络请求；通过充分利用原生的WebGL的模板缓冲和模板测试，以及片元着色器等，实现了渲染模型剖面时的快速和有效，结合剖切盒以及点选确定剖面等操作，极大地提高了用户进行三维地质模型剖切时的体验。
附图说明
图1是本发明的方法流程图；
图2是采用剖切盒对模型进行剖切的示意图；
图3是采用剖切线对模型进行剖切的示意图；
图4是模板缓冲与模板测试的示意图。
具体实施方式
下面结合附图对本发明的具体实施方式以及工作原理作进一步详细说明。
首先，本实施例基于Three.js这一Web端开源的WebGL 3D引擎进行三维地质模型的展示和处理，并通过WebGL的模板缓冲等原理进行剖面填充。所使用的三维地质模型的格式是支持跨平台的GLTF格式，同时也支持Three.js所提供的模型加载器能支持的所有模型格式。
一种Web端三维地质模型动态剖切与剖面填充方法，如图1所示，具体步骤如下：
步骤1、通过Three.js加载并展示三维地质模型；
Three.js对WebGL 进行了很好的封装，使得开发者能更为方便的进行三维处理，通过其内置的模型加载器方法可以加载指定格式的模型。
加载模型前，首先通过Three.js创建好必须的场景、相机、渲染器后，再用内置的GLTFLoader加载三维地质模型。为了方便控制三维地质模型的旋转和移动，可以通过内置的OrbitControls进行场景和相机的处理。
三维地质模型加载好后，为了方便展示，可以设置其中心点的位置，以及缩放其大小到默认大小。此时三维地质模型的加载和展示等准备工作已经就绪，接下来就是三维地质模型的动态剖切以及剖面的填充过程。
步骤2、通过Three.js中模型材质的clippingPlans属性设定剖面；
步骤3、采用设定的剖面对三维地质模型进行剖切；
本实施例中进行三维地质模型的动态剖切主要分为两种方式，一是建立和模型大小一致的剖切盒，可同时从x、y、z轴的正负方向进行模型的剖切，如图2所示。另一种方式是用户通过点击模型确定一个个点位，形成一条条剖切线，每条剖切线平行于y轴形成一个个用于剖切的平面，对模型进行剖切，形成剖切面，如图3所示。
由于三维地质模型本身是空心的，所以这时需要进行剖面的填充。虽然动态剖切的操作方式有两种，但其中剖切以及剖面填充的基本原理是一致的。
剖面填充的基本原理是通过WebGL的模板缓冲和模板测试，在WebGL的片元着色器处理完一个片元时，会执行模板测试，这时可以进行片元的丢弃或保留。模板测试是根据模板缓冲来的，每个模板缓冲中的模板值是8位的，所以一共有256种不同的取值，通过将模板值设为我们想要的值，然后当某一片元的模板值为指定的值时，就可以选择丢弃或保留这一片元，如图4所示。
了解模板缓冲和模板测试后，当进行三维地质模型剖切时，只要确认剖切后，剖面所在的片元，再用一个对应颜色的平面在指定位置进行渲染，就可以得到填充后的剖面。具体过程参见逐步后4。
步骤4、确认剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面，通过模板测试实现剖面填充；
剖面所在的片元的确定步骤为：
通过Three.js中模型材质的side属性进行控制，分别只渲染三维地质模型的背面和正面；
当渲染三维地质模型的背面时，通过模板测试，将背面的所有片元的模板缓冲值加1；
当渲染三维地质模型的正面时，通过模板测试，将正面的所有片元的模板缓冲值减1；
这样下来，由于模型被剖切，那么正面会缺少被剖切的部分片元，而背面没有缺少，于是得到的所有模板缓冲值为1的片元即为剖面所在的片元。
进一步的，基于确定的剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面；通过模板测试，保留模板缓冲值为1的片元，丢弃其余片元，这样就实现了用一个平面填充一个剖面。
上述实现了一个剖面的填充，可对于三维地质模型这种由多个地层所构成的模型，单用一个平面去填充剖面是不行的，所以需要对三维地质模型中的每个地层进行同样的操作，只是在进行模板测试时，需要为每个地层所在的片元指定默认值，在默认值上进行加1和减1操作，当片元的模板缓冲值为默认值加1时，保留相应的片元，则能实现三维地质模型的多层地质的剖切以及剖面的填充。
步骤5、结合鼠标操作剖面的移动或者点选确定剖面，并返回步骤3循环进行，实时对三维地质模型的每个地层进行模板测试，确认剖切后的缺口位置，用指定的平面进行填充，直至对三维地质模型的所有地层完成剖切与剖面填充。
已有的方案中，有的通过桌面软件对三维地质模型进行预处理，提前制作好三维地质模型的剖面，然后在Web端进行展示，这样的方案缺乏灵活性。另外有的方案仅仅实现了三维地质模型的动态剖切，却未进行空心的模型的剖面填充，同时由于多层地质模型的缘故，性能上偏低。还有的方案虽然实现了对3D模型的剖切处理和剖面生成，但未对三维地质模型这一特殊的3D模型进行定制化处理。
本发明基于Three.js实现了三维地质模型的动态剖切和剖面填充，用户可以手动操作剖切的方向和角度以及距离等，更为灵活和方便；在首次加载后，可以离线使用，无需网络请求；通过充分利用原生的WebGL的模板缓冲和模板测试，以及片元着色器等，实现了渲染模型剖面时的快速和有效，结合剖切盒以及点选确定剖面等操作，极大地提高了用户进行三维地质模型剖切时的体验。
以上对本发明所提供的技术方案进行了详细介绍。本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想。应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以对本发明进行若干改进和修饰，这些改进和修饰也落入本发明权利要求的保护范围内。
Claims (7)
1.一种Web端三维地质模型动态剖切与剖面填充方法，其特征在于，包括如下步骤：
步骤1、通过Three.js加载并展示三维地质模型；
步骤2、通过Three.js中模型材质的clippingPlans属性设定剖面；
步骤3、采用设定的剖面对三维地质模型进行剖切；
步骤4、确认剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面，通过模板测试实现剖面填充；
步骤5、移动或点选新的剖面，并返回步骤3循环进行，直至对三维地质模型的所有地层完成剖切与剖面填充。
2.根据权利要求1所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤1中在加载三维地质模型时，需通过Three.js提前创建必须的场景、相机与渲染器。
3.根据权利要求2所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤1中通过Three.js内置的GLTFLoader加载三维地质模型。
4.根据权利要求1所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤3中采用剖切盒或剖切线对三维地质模型进行剖切。
5.根据权利要求1所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤4中所述剖面所在的片元的确定步骤为：
通过Three.js中模型材质的side属性进行控制，分别只渲染三维地质模型的背面和正面；
当渲染三维地质模型的背面时，通过模板测试，将背面的所有片元的模板缓冲值加1；
当渲染三维地质模型的正面时，通过模板测试，将正面的所有片元的模板缓冲值减1；
得到的所有模板缓冲值为1的片元即为剖面所在的片元。
6.根据权利要求1或5所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤4中通过模板测试实现剖面填充的具体步骤为：
基于确定的剖面所在的片元，渲染一个与剖面重合且颜色与对应三维地质模型的地层颜色一致的平面；
通过模板测试，保留模板缓冲值为1的片元，丢弃其余片元，实现剖面的填充。
7.根据权利要求1所述的Web端三维地质模型动态剖切与剖面填充方法，其特征在于：步骤5中对三维地质模型的所有地层进行剖面填充时，需要为每个地层所在的片元指定默认值，在默认值上进行加1和减1操作，当片元的模板缓冲值为默认值加1时，保留相应的片元，否则丢弃相应的片元。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110758395.1A CN113487718B (zh) | 2021-07-05 | 2021-07-05 | 一种Web端三维地质模型动态剖切与剖面填充方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202110758395.1A CN113487718B (zh) | 2021-07-05 | 2021-07-05 | 一种Web端三维地质模型动态剖切与剖面填充方法 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN113487718A true CN113487718A (zh) | 2021-10-08 |
| CN113487718B CN113487718B (zh) | 2022-07-26 |
Family
ID=77940890
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202110758395.1A Active CN113487718B (zh) | 2021-07-05 | 2021-07-05 | 一种Web端三维地质模型动态剖切与剖面填充方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN113487718B (zh) |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20100207943A1 (en) * | 2009-02-18 | 2010-08-19 | Justin Novosad | Modular shader architecture and method for computerized image rendering |
| CN102013113B (zh) * | 2010-12-07 | 2012-04-25 | 中国地质大学（武汉） | 基于模板缓冲的多对象模型动态剖切方法 |
| CN104299269A (zh) * | 2014-09-30 | 2015-01-21 | 长江岩土工程总公司（武汉） | 一种三维地质模型的地质剖面输出方法 |
| CN106447773A (zh) * | 2016-09-13 | 2017-02-22 | 中国地质大学（武汉） | 一种三维地质体模型的序贯剖面动态显示方法 |
| CN108171804A (zh) * | 2017-12-14 | 2018-06-15 | 深圳市毕美科技有限公司 | 三维模型剖切平面的确定方法及装置 |
| CN110706342A (zh) * | 2019-10-12 | 2020-01-17 | 上海勘察设计研究院(集团)有限公司 | 一种基于BIM模型Web端轻量化展示地质模型剖面的方法 |
| CN110796732A (zh) * | 2019-10-21 | 2020-02-14 | 天津大学 | 基于WebGL与C#的矿山三维展示方法 |
| CN112802169A (zh) * | 2021-01-29 | 2021-05-14 | 中国地质大学（武汉） | 一种三维地质模型实时剖切渲染方法 |
-
2021
- 2021-07-05 CN CN202110758395.1A patent/CN113487718B/zh active Active
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20100207943A1 (en) * | 2009-02-18 | 2010-08-19 | Justin Novosad | Modular shader architecture and method for computerized image rendering |
| CN102013113B (zh) * | 2010-12-07 | 2012-04-25 | 中国地质大学（武汉） | 基于模板缓冲的多对象模型动态剖切方法 |
| CN104299269A (zh) * | 2014-09-30 | 2015-01-21 | 长江岩土工程总公司（武汉） | 一种三维地质模型的地质剖面输出方法 |
| CN106447773A (zh) * | 2016-09-13 | 2017-02-22 | 中国地质大学（武汉） | 一种三维地质体模型的序贯剖面动态显示方法 |
| CN108171804A (zh) * | 2017-12-14 | 2018-06-15 | 深圳市毕美科技有限公司 | 三维模型剖切平面的确定方法及装置 |
| CN110706342A (zh) * | 2019-10-12 | 2020-01-17 | 上海勘察设计研究院(集团)有限公司 | 一种基于BIM模型Web端轻量化展示地质模型剖面的方法 |
| CN110796732A (zh) * | 2019-10-21 | 2020-02-14 | 天津大学 | 基于WebGL与C#的矿山三维展示方法 |
| CN112802169A (zh) * | 2021-01-29 | 2021-05-14 | 中国地质大学（武汉） | 一种三维地质模型实时剖切渲染方法 |
Also Published As
| Publication number | Publication date |
|---|---|
| CN113487718B (zh) | 2022-07-26 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10755473B2 (en) | Graphics processing system | |
| US6734873B1 (en) | Method and system for displaying a composited image | |
| US6891533B1 (en) | Compositing separately-generated three-dimensional images | |
| US9792718B2 (en) | Mapping graphics instructions to associated graphics data during performance analysis | |
| CN105701852B (zh) | 用于渲染的设备和方法 | |
| CN108876887B (zh) | 渲染方法和装置 | |
| US9536333B2 (en) | Method and apparatus for improved processing of graphics primitives | |
| US20150243257A1 (en) | Cross-Platform Rendering Engine | |
| CN105528756B (zh) | 基于片的图形处理器及在其中执行图形处理的方法 | |
| US10853994B1 (en) | Rendering scenes using a combination of raytracing and rasterization | |
| CN108304239B (zh) | 用于远程操作的快速界面交互方法及装置 | |
| JP5986261B1 (ja) | 画面制御のための効率的なインタフェースを提供するシステムおよび方法 | |
| US10497150B2 (en) | Graphics processing fragment shading by plural processing passes | |
| KR20180023856A (ko) | 그래픽 처리 시스템 및 그래픽 프로세서 | |
| CN113487718B (zh) | 一种Web端三维地质模型动态剖切与剖面填充方法 | |
| US20140375637A1 (en) | Apparatus and method for processing graphics primitives | |
| CN102136128B (zh) | 增进绘图处理单元的总处理量的方法与系统 | |
| JP2001060275A (ja) | 三次元モデルの表示方法と、これを実現するプログラムが記憶されたコンピュータにより読み取り可能な記憶媒体 | |
| CN112102450B (zh) | 一种基于WebGL三维地图的跑马灯特效通用方法 | |
| US20230334737A1 (en) | Partial depth ordering with vector interlacing | |
| US11908069B2 (en) | Graphics processing | |
| US11657552B2 (en) | Generating illuminated two-dimensional vector graphics using path tracing | |
| US9741156B2 (en) | Material trouble shooter | |
| GB2624425A (en) | Graphics processors | |
| WO2024105396A1 (en) | Graphics processors |
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 |