WO2021174659A1 - 一种基于WebGL可编辑大场景渐进式实时渲染方法 - Google Patents
一种基于WebGL可编辑大场景渐进式实时渲染方法 Download PDFInfo
- Publication number
- WO2021174659A1 WO2021174659A1 PCT/CN2020/088161 CN2020088161W WO2021174659A1 WO 2021174659 A1 WO2021174659 A1 WO 2021174659A1 CN 2020088161 W CN2020088161 W CN 2020088161W WO 2021174659 A1 WO2021174659 A1 WO 2021174659A1
- Authority
- WO
- WIPO (PCT)
- Prior art keywords
- scene
- bvh
- rendering
- progressive
- editable
- Prior art date
Links
- 238000009877 rendering Methods 0.000 title claims abstract description 55
- 238000000034 method Methods 0.000 title claims abstract description 24
- 230000000750 progressive effect Effects 0.000 title claims abstract description 19
- 230000008569 process Effects 0.000 claims description 7
- 238000005457 optimization Methods 0.000 claims description 6
- 230000008859 change Effects 0.000 claims description 3
- 238000006243 chemical reaction Methods 0.000 claims description 3
- 238000013461 design Methods 0.000 abstract description 18
- 230000003993 interaction Effects 0.000 abstract description 3
- 230000009286 beneficial effect Effects 0.000 abstract description 2
- 238000010586 diagram Methods 0.000 description 4
- 230000008030 elimination Effects 0.000 description 4
- 238000003379 elimination reaction Methods 0.000 description 4
- 230000006872 improvement Effects 0.000 description 3
- 238000007781 pre-processing Methods 0.000 description 3
- 230000002776 aggregation Effects 0.000 description 2
- 238000004220 aggregation Methods 0.000 description 2
- 238000005034 decoration Methods 0.000 description 2
- 230000002452 interceptive effect Effects 0.000 description 2
- 238000012545 processing Methods 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 230000000903 blocking effect Effects 0.000 description 1
- 230000007812 deficiency Effects 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 230000035772 mutation Effects 0.000 description 1
- 230000010076 replication Effects 0.000 description 1
- 238000012360 testing method Methods 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
- 238000012800 visualization Methods 0.000 description 1
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/005—General purpose rendering architectures
Definitions
- the present invention relates to the field of 3D real-time rendering, in particular to a real-time rendering technology of 3D large scenes based on browser operation.
- Three-dimensional scenes are the basis of graphical visualization applications. With the deepening of business and more detailed design, the amount of three-dimensional data and scenes are getting larger and larger. For design software, data update requirements make the data need to exist independently, and it is also not conducive to optimization such as data merging to reduce the demand for the number of hardware DrawCalls. On the other hand, especially the browser-based WebGL three-dimensional display technology, which can give full play to the limited capabilities of the hardware and the underlying graphics interface. For example, the low-level graphics interface features such as advanced OpenGL/DirectX/Valken cannot be used yet, and the use of multi-core/multi-thread is limited, and the runtime consumption is relatively high compared to the local software Javascript/browser. As an ordinary industry user, the computer equipment usually used is relatively popular. While the software is convenient to use, real-time rendering of three-dimensional scenes poses a great challenge. Graphical application scenarios that cannot be interacted normally with insufficient speed and fluency, especially design and editing application scenarios.
- the scene data is static and unchanging.
- the traditional method is to reduce the amount of data and grade LOD data through preprocessing to reduce the amount of data, reduce the number of DrawCalls to improve the optimization of drawing efficiency to achieve efficient three-dimensional Large scene rendering.
- the data is merged for each model in the scene, the texture is merged, the data is extracted for instance drawing, and the model is LOD multi-level data.
- Some use the server or local for offline preprocessing. Some perform data preprocessing when the software loads the data.
- Kujiale home decoration design software is a web-based three-dimensional graphic design editing software. Real-time rendering of home decoration design schemes in a three-dimensional graphics system based on WebGL running in the browser, providing users with design editing operations.
- the data of the plan includes geometric figures of various shapes and Mesh geometric shapes of a large number of models.
- the home improvement plan usually requires wall and floor paving, various patterned furnishings and furniture, so the plan also contains a large number of texture maps.
- it is necessary to edit and modify the geometry, position, texture map, etc., and these operations are all real-time interactive operations, which can be operated in a three-dimensional environment and obtain real-time scene update feedback.
- data is dynamic, generated and updated during the editing process.
- the data objects of the three-dimensional scene correspond to the individual business entity objects and need to perform independent operations in the software, such as highlighting, showing/hiding, etc.
- the timing cannot be pre-processed.
- the amount of data is large, and frequent data updates are not suitable for data processing and replication at runtime to generate merge-optimized data.
- the types of geometric objects in the 3D scene are relatively rich, and there are a lot of textures that need to be displayed and rendered.
- the purpose of the present invention is to overcome the deficiencies of the prior art, and provide a WebGL-based editable progressive real-time rendering method of large scenes, retain the original scene design model, support editable update operations, and perform progressive rendering of large three-dimensional scenes , Under different abilities of equipment, under different scales and sizes of scenes, so that the three-dimensional interactive real-time rendering environment remains smooth.
- using this technology allows users to design and edit large scenes in a browser environment.
- This WebGL-based editable large-scene progressive real-time rendering method includes the following steps:
- Step 1 Hierarchical spatial relationship management based on BVH spatial structure, including the following steps:
- step D Determine whether the scene has changed; if there is a change, go to step E; otherwise, go to step 2;
- step E Determine whether the current Worker is building BVH; if it is building, go to step 2; otherwise, go to step F;
- Step 2 Progressive scene drawing, including the following steps:
- step 2 Using the BVH information generated in step 1, with a BVH culling strategy, a certain number of rendering descriptions sorted by the culling strategy are obtained from the intermediate data structure of step b and stored in the rendering queue;
- next frame if the objects in the BVH have not acquired all the objects, or the scene has no observable changes, or the camera has not changed, the next frame will be drawn from step c; otherwise, the next frame , Complete the corresponding scene update, reset the current acquisition position of the BVH, and continue this process from step a.
- the data combination described in step a in step 2 includes completing the drawcall, required shader, uniform, attribute buffer, and necessary state settings.
- an optimized hierarchical cone removal strategy is used in step c in the step 2.
- Figure 1 is a schematic diagram of the process of step 1 of the present invention.
- Figure 2 is a schematic diagram of the process of step 2 of the present invention.
- Fig. 3 is a schematic diagram of application scenario 1 of the present invention.
- Fig. 4 is a schematic diagram of application scenario 2 of the present invention.
- this WebGL-based editable large-scene progressive real-time rendering method includes:
- Step 1 Hierarchical spatial relationship management based on the BVH spatial structure (in order to reduce the canvas drawing mutations of progressive rendering under different camera perspectives, and to improve the rendering performance of progressive rendering, it is necessary to carry out effective space for the scene before performing progressive rendering Division, the BVH-based space scene division is used in this solution, including the following steps:
- the BVH in order to be compatible with editable scenes, and to maximize the effectiveness of the current BVH, the BVH is constructed by evenly distributing child nodes.
- the BVH constructed in this way can strictly guarantee that the constructed BVH is similar to Complete binary tree structure; this structure can greatly guarantee the impact on the grouping of sub-nodes when the scene is updated, and at the same time, it is the tree-shaped data structure with the highest traversal efficiency;
- step D Determine whether the scene has changed; if there is a change, go to step E; otherwise, go to step 2;
- step E Determine whether the current Worker is building BVH; if it is building, go to step 2; otherwise, go to step F;
- Step 2 Progressive scene drawing, including the following steps:
- each data combination that is, rendering description
- These data include the required shader, uniform, attributebuffer, and the necessary state settings to complete the drawcall;
- BVH elimination strategy Using the BVH information generated in step 1, using a BVH elimination strategy, a certain number of rendering descriptions sorted according to the elimination strategy are obtained from the intermediate data structure of step b and stored in the rendering queue. Due to the spatial division characteristics of BVH, Elimination strategies such as optimized hierarchical frustum elimination can be used here;
- next frame if the objects in the BVH have not acquired all the objects, or the scene has no observable changes, or the camera has not changed, the next frame will be drawn from step c; otherwise, the next frame , Complete the corresponding scene update, reset the current acquisition position of the BVH, and continue this process from step a.
- the technical solution of the present invention consists of two main steps.
- the first is a hierarchical spatial relationship management based on the BVH spatial structure that is suitable for dynamic editing scenes. It builds and maintains spatial-level information with low computational overhead and extremely low runtime delay impact. This information is discrete, and a large number of scene objects are organized by spatial scope aggregation, and its level information provides the function of grouping and grading information of the level of detail. According to the aggregation of information, the degree of detail and importance of the object, combined with the second step, the scene uses multiple frames for progressive overlay rendering, so as to achieve a stable high frame rate and minimal visual impact of the rendered picture, for 1 to N frames Gradually complete the rendering and rendering of the full amount of 3D scene content.
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
Description
Claims (3)
- 一种基于WebGL可编辑大场景渐进式实时渲染方法,其特征在于,所述方法包括:步骤1:基于BVH空间结构的层级空间关系管理,包括以下步骤:A.平衡BVH,采用平均分配子节点的方式构建BVH;B.基于WebWorker的BVH生成,采用的WebWorker技术,将BVH空间结构的生成逻辑迁移到Worker中去执行;C.检查Worker是否为完成状态;若为完成状态,则取出Worker生成的BVH结果并执行步骤D;反之,直接执行步骤D;D.判断场景是否发生变化;若发生变化,则执行步骤E;反之,则进入步骤2;E.判断当前Worker是否正在构建BVH;若正在构建,则进入步骤2;反之,则执行步骤F;F.收集场景信息,请求Worker生成BVH,并进入步骤2;步骤2:渐进式场景绘制,包括以下步骤:a.用户场景描述层面,整理出每一份完成webgldrawcall所需渲染信息的数据组合,即渲染描述;b.维护一份线性的关于渲染描述的中间数据结构,提升用户的非线性场景描述到线性渲染数据的转化性能;c.使用步骤1中生成的BVH信息,以BVH的一种剔除策略,从步骤b的中间数据结构中获得一定数量按该剔除策略排序的渲染描述存在渲染队列中;d.对于渲染队列中的物体,计算更多的额外信息,进行额外的优化排序;e.渲染处于渲染队列中的物体;f.检查帧耗时预算是否超标,若没有则重复步骤c;g.在下一帧时,若BVH中的物体没有获取完成所有的物体,或者场景没有任何可观测变化,或者相机没有变化;则会从步骤c开始继续进行下一帧绘制;否则,下一帧,完成相应的场景更新,并重置BVH的当前获取位置,并从步骤a开始继续执行此流程。
- 根据权利要求1所述的基于WebGL可编辑大场景渐进式实时渲染方法,其特征在于:所述步骤2中步骤a所述的数据组合包括完成这个drawcall,所需的shader,uniform,attributebuffer,以及必要的状态设置。
- 根据权利要求1所述的基于WebGL可编辑大场景渐进式实时渲染方法,其特征在于:所述步骤2中步骤c中使用优化的层次视锥剔除策略。
Applications Claiming Priority (2)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010141839.2A CN111369656B (zh) | 2020-03-04 | 2020-03-04 | 一种基于WebGL可编辑大场景渐进式实时渲染方法 |
CN202010141839.2 | 2020-03-04 |
Publications (1)
Publication Number | Publication Date |
---|---|
WO2021174659A1 true WO2021174659A1 (zh) | 2021-09-10 |
Family
ID=71210240
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
PCT/CN2020/088161 WO2021174659A1 (zh) | 2020-03-04 | 2020-04-30 | 一种基于WebGL可编辑大场景渐进式实时渲染方法 |
Country Status (2)
Country | Link |
---|---|
CN (1) | CN111369656B (zh) |
WO (1) | WO2021174659A1 (zh) |
Cited By (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113793415A (zh) * | 2021-09-15 | 2021-12-14 | 云南建投第一勘察设计有限公司 | 一种2d图纸转3d效果的处理系统及方法 |
CN114202634A (zh) * | 2022-02-17 | 2022-03-18 | 深圳消安科技有限公司 | 一种应用于城市三维模型数据的轻量化方法 |
CN114332322A (zh) * | 2021-11-30 | 2022-04-12 | 合肥火星科技有限公司 | 一种三维场景下单体模型的大数据渲染方法 |
CN114494553A (zh) * | 2022-01-21 | 2022-05-13 | 杭州游聚信息技术有限公司 | 基于渲染时间估计和lod选择的实时渲染方法、系统及设备 |
CN115578498A (zh) * | 2022-10-28 | 2023-01-06 | 齐丰科技股份有限公司 | 一种用于Unity3D中的高亮描边方法 |
CN115631293A (zh) * | 2022-08-18 | 2023-01-20 | 中通服慧展科技有限公司 | 一种3d大场景可视化编辑方法、装置、电子设备及介质 |
CN115983047A (zh) * | 2023-03-14 | 2023-04-18 | 北京科技大学 | 一种适用于多图形接口的跨平台的仿真系统 |
CN116366827A (zh) * | 2023-01-13 | 2023-06-30 | 北京航空航天大学云南创新研究院 | 面向web端的高精度大场景图像处理传输方法及其装置 |
CN116972913A (zh) * | 2023-09-22 | 2023-10-31 | 南通百源制冷设备有限公司 | 一种冷链设备运行状态在线监测方法及系统 |
Families Citing this family (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111599011B (zh) * | 2020-07-15 | 2023-08-04 | 杭州电力设备制造有限公司 | 基于WebGL技术的电力系统场景快速构建方法及系统 |
CN114513520B (zh) * | 2021-12-27 | 2023-06-30 | 浙江中测新图地理信息技术有限公司 | 基于客户端和服务器同步渲染的Web三维可视化方法 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20180203706A1 (en) * | 2017-01-13 | 2018-07-19 | Zspace, Inc. | Transitioning Between 2D and Stereoscopic 3D Webpage Presentation |
CN109448089A (zh) * | 2018-10-22 | 2019-03-08 | 美宅科技(北京)有限公司 | 一种渲染方法及装置 |
CN110309458A (zh) * | 2018-03-30 | 2019-10-08 | 北京东晨工元科技发展有限公司 | 基于WebGL的BIM模型显示及渲染方法 |
Family Cites Families (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107330962B (zh) * | 2017-06-19 | 2020-08-11 | 杭州群核信息技术有限公司 | 一种交互式虚拟现实场景自动生成方法、装置和设备 |
CN110443893B (zh) * | 2019-08-02 | 2023-04-25 | 广联达科技股份有限公司 | 大规模建筑场景渲染加速方法、系统、装置和存储介质 |
-
2020
- 2020-03-04 CN CN202010141839.2A patent/CN111369656B/zh active Active
- 2020-04-30 WO PCT/CN2020/088161 patent/WO2021174659A1/zh active Application Filing
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20180203706A1 (en) * | 2017-01-13 | 2018-07-19 | Zspace, Inc. | Transitioning Between 2D and Stereoscopic 3D Webpage Presentation |
CN110309458A (zh) * | 2018-03-30 | 2019-10-08 | 北京东晨工元科技发展有限公司 | 基于WebGL的BIM模型显示及渲染方法 |
CN109448089A (zh) * | 2018-10-22 | 2019-03-08 | 美宅科技(北京)有限公司 | 一种渲染方法及装置 |
Cited By (14)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN113793415B (zh) * | 2021-09-15 | 2023-10-31 | 云南建投第一勘察设计有限公司 | 一种2d图纸转3d效果的处理系统及方法 |
CN113793415A (zh) * | 2021-09-15 | 2021-12-14 | 云南建投第一勘察设计有限公司 | 一种2d图纸转3d效果的处理系统及方法 |
CN114332322A (zh) * | 2021-11-30 | 2022-04-12 | 合肥火星科技有限公司 | 一种三维场景下单体模型的大数据渲染方法 |
CN114494553A (zh) * | 2022-01-21 | 2022-05-13 | 杭州游聚信息技术有限公司 | 基于渲染时间估计和lod选择的实时渲染方法、系统及设备 |
CN114494553B (zh) * | 2022-01-21 | 2022-08-23 | 杭州游聚信息技术有限公司 | 基于渲染时间估计和lod选择的实时渲染方法、系统及设备 |
CN114202634A (zh) * | 2022-02-17 | 2022-03-18 | 深圳消安科技有限公司 | 一种应用于城市三维模型数据的轻量化方法 |
CN114202634B (zh) * | 2022-02-17 | 2022-06-14 | 深圳消安科技有限公司 | 一种应用于城市三维模型数据的轻量化方法 |
CN115631293A (zh) * | 2022-08-18 | 2023-01-20 | 中通服慧展科技有限公司 | 一种3d大场景可视化编辑方法、装置、电子设备及介质 |
CN115578498A (zh) * | 2022-10-28 | 2023-01-06 | 齐丰科技股份有限公司 | 一种用于Unity3D中的高亮描边方法 |
CN116366827A (zh) * | 2023-01-13 | 2023-06-30 | 北京航空航天大学云南创新研究院 | 面向web端的高精度大场景图像处理传输方法及其装置 |
CN116366827B (zh) * | 2023-01-13 | 2024-02-06 | 北京航空航天大学云南创新研究院 | 面向web端的高精度大场景图像处理传输方法及其装置 |
CN115983047A (zh) * | 2023-03-14 | 2023-04-18 | 北京科技大学 | 一种适用于多图形接口的跨平台的仿真系统 |
CN116972913A (zh) * | 2023-09-22 | 2023-10-31 | 南通百源制冷设备有限公司 | 一种冷链设备运行状态在线监测方法及系统 |
CN116972913B (zh) * | 2023-09-22 | 2023-12-01 | 南通百源制冷设备有限公司 | 一种冷链设备运行状态在线监测方法及系统 |
Also Published As
Publication number | Publication date |
---|---|
CN111369656A (zh) | 2020-07-03 |
CN111369656B (zh) | 2021-08-27 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
WO2021174659A1 (zh) | 一种基于WebGL可编辑大场景渐进式实时渲染方法 | |
CN107193911B (zh) | 一种基于bim模型的三维可视化引擎及web应用程序调用方法 | |
CN110309458B (zh) | 基于WebGL的BIM模型显示及渲染方法 | |
CN105261066A (zh) | 一种三维地理信息系统实时绘制多线程分配与控制方法 | |
KR101281157B1 (ko) | 레이 트레이싱 코어 및 레이 트레이싱 처리 방법 | |
CN108305208A (zh) | 一种模型动态分析优化及三维交互处理方法 | |
Yuan et al. | Simplified and tessellated mesh for realtime high quality rendering | |
Scholz et al. | Real‐time isosurface extraction with view‐dependent level of detail and applications | |
Yao et al. | 2D/3D Visualization of large-scale wind field based on WebGL | |
Wang et al. | LVDIF: a framework for real-time interaction with large volume data | |
CN106803231A (zh) | 一种基于sort‑first负载平衡的图形并行绘制方法 | |
Chai et al. | Cultural heritage assets optimization workflow for interactive system development | |
KR101281156B1 (ko) | 레이 트레이싱 코어 및 레이 트레이싱 처리 방법 | |
Yin et al. | Multi-screen Tiled Displayed, Parallel Rendering System for a Large Terrain Dataset. | |
CN113076574B (zh) | 一种轻量化跨平台的在线参数化建模方法 | |
Yang et al. | Dynamic Load Balancing Algorithm Based on Per-pixel Rendering Cost Estimation for Parallel Ray Tracing on PC Clusters | |
Yu et al. | A level of detail selection method for multi-type objects based on the span of level changed | |
CN116912395B (zh) | 基于OpenGL的图形混合渲染方法、装置及存储介质 | |
Li et al. | Movie Data Visualization Based on WebGL | |
Shakaev et al. | View-Dependent Level of Detail for Real-Time Rendering of Large Isosurfaces | |
Yan et al. | 3D visual design for mobile search result on 3G mobile phone | |
Wang et al. | 3D Scene Management Method Combined with Scene Graphs. | |
US11954802B2 (en) | Method and system for generating polygon meshes approximating surfaces using iteration for mesh vertex positions | |
Xiong et al. | Study of LOD terrain rendering algorithm based on GPU | |
Liu | Flash MX-Based “Computer Graphics” Straight-Line Generation Algorithm Demonstrates the Design of the System |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
121 | Ep: the epo has been informed by wipo that ep was designated in this application |
Ref document number: 20922634 Country of ref document: EP Kind code of ref document: A1 |
|
NENP | Non-entry into the national phase |
Ref country code: DE |
|
122 | Ep: pct application non-entry in european phase |
Ref document number: 20922634 Country of ref document: EP Kind code of ref document: A1 |
|
32PN | Ep: public notification in the ep bulletin as address of the adressee cannot be established |
Free format text: NOTING OF LOSS OF RIGHTS PURSUANT TO RULE 112(1) EPC (EPO FORM 1205A DATED 13.07.2023) |
|
122 | Ep: pct application non-entry in european phase |
Ref document number: 20922634 Country of ref document: EP Kind code of ref document: A1 |