A browser-side complex assembly scene real-time rendering method, system and medium
Patent Information
- Application Number
- CN202610922155.3
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2026-06-25
- Publication Date
- 2026-11-03
- Estimated Expiration
- 2046-06-25
AI Technical Summary
[0004]本发明实施例提供了一种浏览器端复杂装配场景实时渲染方法、系统及介质,用于解决如下技术问题:浏览器环境内存与算力受限条件下,大规模CAD装配模型全量加载易崩溃、DrawCall开销高、无效渲染负载大,导致无法实现模型高效加载、稳定驻留与高帧率实时渲染
本发明采用流式分块传输与IndexedDB虚拟化几何体管理,实现了模型数据按需加载、动态卸载与按需还原,突破了浏览器堆内存上限,可稳定加载1.5GB原始数据、10万零部件、1亿面片的超大规模装配模型,避免内存溢出与网页崩溃。
Smart Images

Figure CN122454005B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of 3D assembly model rendering technology, and in particular to a method, system and medium for real-time rendering of complex assembly scenes on a browser. Background Technology
[0002] In high-end manufacturing sectors such as aerospace, automotive, and construction machinery, product assembly structures are becoming increasingly complex. 3D assembly models often contain tens to hundreds of thousands of parts, resulting in large-scale assembly scenarios with massive geometric data, complex hierarchical relationships, and dynamically changing visibility. Browser-based web-based 3D visualization technology, due to its lightweight, cross-platform, and collaborative advantages, is gradually becoming the mainstream method for displaying and interacting with industrial 3D models.
[0003] However, browser environments have inherent constraints such as limited JavaScript heap memory, restricted allocation of video memory and underlying buffers, and long network transmission and rendering scheduling links, making it difficult to directly migrate traditional desktop CAD rendering strategies. Current technologies generally employ a full-load, full-rendering mode when handling large-scale assembly models, but loading all model data into memory at once can easily lead to memory overflows and webpage crashes. Furthermore, the scattered geometry causes a surge in CPU-side DrawCalls and increased rendering organization overhead. Coupled with the current lack of efficient visibility culling and dynamic detail adaptation mechanisms, the GPU experiences high levels of ineffective rendering load, ultimately resulting in slow model loading, high memory consumption, low frame rates, and stuttering interactions, failing to meet the real-time rendering and smooth interaction requirements of complex, large-scale assembly scenarios in browsers. Summary of the Invention
[0004] This invention provides a method, system, and medium for real-time rendering of complex assembly scenes on a browser, which addresses the following technical problems: Under the conditions of limited memory and computing power in the browser environment, full loading of large-scale CAD assembly models is prone to crashes, DrawCall overhead is high, and invalid rendering load is large, making it impossible to achieve efficient model loading, stable dwell, and high frame rate real-time rendering.
[0005] The embodiments of the present invention adopt the following technical solutions: On the one hand, embodiments of the present invention provide a real-time rendering method for complex assembly scenes on the browser side, the method including: performing offline preprocessing on the original assembly model to generate a multi-level detail model; The model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming transmission channel; In the browser, scene initialization and construction are performed based on the model data to obtain a batch mesh rendering structure; The batch mesh rendering structure is subjected to multiple culling processes frame by frame to output a set of visible components, and each component in the set of visible components is assigned a corresponding level of detail; wherein, the multiple culling processes include at least frustum culling and occlusion culling. Based on the level of detail, batch Draw Call rendering is performed on the set of visible components. During the rendering process, component unloading or component restoration is dynamically executed based on memory thresholds.
[0006] In one feasible implementation, the original assembly model is preprocessed offline to generate a multi-level detail model, specifically including: Input the complete original assembly model data into the server or preprocessing engine; wherein the original assembly model data includes at least all component geometric data, topological relationships and material information; The error cost generated by the edge folding operation of the original assembly model is calculated using a quadratic error metric algorithm. Based on the error cost and different preset simplification ratios, the original assembly model is geometrically simplified to different degrees to obtain multi-level detail data; wherein, key geometric features of the model parts are preserved while performing geometric simplification. Based on the multi-level detail data, detail levels are constructed and spatially organized to obtain a multi-level detail model.
[0007] In one feasible implementation, the model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming channel, specifically including: Establish a streaming channel between the browser frontend and the server; The model data of the multi-level detail model is encapsulated in blocks and sent to the browser front end through the streaming transmission channel; the model data includes the component geometry data corresponding to the multi-level detail data, as well as model metadata used to describe the node hierarchy relationship, material information and detail hierarchy association relationship.
[0008] In one feasible implementation, scene initialization and construction are performed on the browser based on the model data to obtain a batch mesh rendering structure, specifically including: When the browser front-end receives the first model data block, it immediately starts the incremental parsing program to perform incremental parsing on the arrived model data blocks and registers the scene node corresponding to the model data block based on the parsing results. Based on the registered scene nodes, a detailed hierarchical spatial tree structure is constructed; wherein, a node in the detailed hierarchical spatial tree structure corresponds to a component, part group, or spatial region; Record the node information of each node in the detailed hierarchy spatial tree structure; wherein, the node information includes at least: the node's hierarchical relationship, enclosing range, associated detailed hierarchy set, and current dwell state information; Data of parts of the same material in the detail hierarchy spatial tree structure are aggregated, and the aggregated part data is meshed using a batch mesh generation tool to obtain the batch mesh rendering structure for preliminary display of the assembly model in the browser front end.
[0009] In one feasible implementation, the batch mesh rendering structure undergoes multiple culling processes frame-by-frame to output a set of visible components, specifically including: The batch mesh rendering structure is traversed frame by frame; By using a hierarchical spatial acceleration structure, redundant nodes outside the viewport in the current frame are identified and skipped, and view frustum culling is performed. Based on hardware-level hierarchical Z-buffering technology, the depth distribution of the current frame is compared with that of the previous frame. Based on the comparison results, internal parts that are completely occluded by large structures in front of the current frame are removed, and occlusion removal is performed. The remaining components after visual cone removal and occlusion removal are summarized into the visible component set.
[0010] In one feasible implementation, assigning a corresponding level of detail to each component in the set of visible components specifically includes: Calculate the projected visual proportion of each visible component in the set of visible components in the screen space; Based on the projected visual proportion, assign a corresponding level of detail to each visible component; Store each visible component and its corresponding level of detail in a visibility list.
[0011] In one feasible implementation, batch Draw Call rendering of the set of visible components is performed according to the level of detail, specifically including: Based on the level of detail in the visibility list, bind the corresponding rendering material and rendering state to each visible component; Based on the rendering material and rendering state, a Draw Call rendering command is sequentially initiated for each visible component; While initiating the rendering command, an asynchronous state feedback closed-loop mechanism is started. Based on the latest camera pose parameters and viewport state of the current frame, a depth traversal of the detail level spatial tree structure of the entire scene is performed to evaluate and extract the expected set of resident nodes for the next frame.
[0012] In one feasible implementation, during the rendering process, component unloading or component restoration is dynamically performed based on a memory threshold, specifically including: During the rendering process, if the system detects that the memory usage is close to the preset threshold, it will identify the components that have completed the construction of display data and the uploading of GPU resources, but are not currently participating in display or interaction, as candidate unloading objects. Release the original geometric data of the candidate unloaded object in memory and parse the intermediate object, and write its binary data, data block index and other recovery information into IndexedDB; During the component restoration process, when an unloaded component is selected, measured, sectioned, or depended on by other interactive logic, the corresponding data is read from IndexedDB according to the index relationship in the detail hierarchy spatial tree structure, and the corresponding full model information is restored.
[0013] On the other hand, embodiments of the present invention also provide a real-time rendering system for complex assembly scenes on a browser side, the system comprising: The pre-processing module is used to perform offline preprocessing on the original assembly model to generate a multi-level detail model; the model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming transmission channel; the browser initializes and constructs the scene based on the model data to obtain a batch mesh rendering structure. The loop rendering module is used to perform multiple culling processing on the batch mesh rendering structure frame by frame, output a set of visible parts, and assign a corresponding level of detail to each part in the set of visible parts; wherein, the multiple culling processing includes at least frustum culling and occlusion culling. The part unloading and restoration scheduling module is used to perform batch Draw Call rendering on the set of visible parts according to the level of detail. During the rendering process, the part unloading or restoration is dynamically executed based on the memory threshold.
[0014] Finally, this embodiment of the invention also provides a storage medium, which is a non-volatile computer-readable storage medium storing at least one program, each program including instructions, which, when executed by a terminal, cause the terminal to execute the browser-side complex assembly scene real-time rendering method.
[0015] Compared with the prior art, the real-time rendering method, system and medium for complex assembly scenes on the browser side provided by the embodiments of the present invention have the following beneficial effects: This invention employs streaming chunked transmission and IndexedDB virtualized geometry management to achieve on-demand loading, dynamic unloading, and on-demand restoration of model data. It breaks through the browser heap memory limit and can stably load ultra-large-scale assembly models with 1.5GB of original data, 100,000 parts, and 100 million faces, avoiding memory overflow and webpage crashes.
[0016] This invention also utilizes the BatchMesh tool to batch aggregate parts of the same material, significantly reducing the number of draw calls and GPU state switching overhead, lowering rendering organization time, and significantly reducing interactive response latency. Simultaneously, by combining view frustum culling and hardware-level occlusion culling, over 70% of invisible internal parts can be removed, drastically reducing invalid rendering load. While simplifying the model, key geometric features are preserved, achieving an optimal balance between rendering performance and display quality.
[0017] It fully supports incremental data parsing and streaming loading, enabling initial display without waiting for the full data transmission to complete, significantly improving model loading speed. It meets the real-time visualization needs of large-scale assembly models in high-end manufacturing sectors such as aerospace and automotive for online browsing, process review, and assembly verification. Attached Figure Description
[0018] To more clearly illustrate the technical solutions in the embodiments of the present invention or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments recorded in the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort. In the drawings: Figure 1 A flowchart of a real-time rendering method for complex assembly scenes on a browser side provided in an embodiment of the present invention; Figure 2 A flowchart of pre-processing and loading data is provided for an embodiment of the present invention; Figure 3 A frame scheduling and rendering loop flowchart provided in an embodiment of the present invention; Figure 4 This is a schematic diagram of occlusion removal provided in an embodiment of the present invention; Figure 5 This invention provides a flowchart for a parts unloading and restoration scheduling process. Figure 6 This is a schematic diagram of the structure of a browser-based real-time rendering device for complex assembly scenes, provided in an embodiment of the present invention. Detailed Implementation
[0019] To enable those skilled in the art to better understand the technical solutions of this invention, the technical solutions of the embodiments of this invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this invention, and not all embodiments. Based on the embodiments of this specification, all other embodiments obtained by those skilled in the art without creative effort should fall within the scope of protection of this invention.
[0020] This invention provides a real-time rendering method for complex assembly scenes on a browser-side, such as... Figure 1 As shown, the real-time rendering method for complex assembly scenes on the browser side specifically includes steps S101-S104: S101. Perform offline preprocessing on the original assembly model to generate a multi-level detail model; divide and encapsulate the model data of the multi-level detail model into blocks, and transmit the block-encapsulated model data from the server to the browser through a pre-built streaming transmission channel.
[0021] Specifically, the complete original assembly model data is first input into the server or preprocessing engine; the original assembly model data includes at least all component geometry data, topological relationships, and material information.
[0022] Furthermore, the error cost generated by the edge folding operation of the original assembly model is calculated using a quadratic error metric algorithm. Based on the error cost and different preset simplification ratios, the original assembly model is geometrically simplified to varying degrees, resulting in multi-level detail data; while performing geometric simplification, key geometric features of the model components are preserved. Based on the multi-level detail data, detail hierarchy construction and spatial organization are performed to obtain a multi-level detail model.
[0023] Furthermore, a streaming transmission channel is established between the browser frontend and the server. The model data of the multi-level detail model is encapsulated in blocks and sent to the browser frontend through the streaming transmission channel; the model data includes the geometric data of the parts corresponding to the multi-level detail data, as well as model metadata used to describe the node hierarchy relationship, material information, and detail hierarchy association relationship.
[0024] As a feasible implementation method, Figure 2 A flowchart of pre-processing and loading data is provided for an embodiment of the present invention, as follows: Figure 2 As shown, the pre-processing and loading of data mainly includes assembly model preprocessing and scene initialization construction. This process involves generating Levels of Detail (LOD) geometry data on the server side and loading initial scene data, constructing the spatial tree, and building batch meshes (BatchMesh) on the browser side based on streaming transmission.
[0025] Among them, such as Figure 2 As shown, the assembly model preprocessing stage is completed offline on the server or in the preprocessing engine. It is used to perform geometric simplification, level-of-detail (LOD) construction, and spatial organization on the original large-scale assembly model. First, geometric simplification is performed on the original model using a quadratic error metric algorithm. By evaluating the error cost of edge folding operations, the mesh is downsampled, reducing the amount of geometric data while preserving the key geometric features of the components, generating multiple levels of detail (LOD) models. After generating multi-level LOD data, the component data is further encapsulated in blocks to prepare for the subsequent establishment of a streaming transmission channel for model data.
[0026] S102. Initialize and construct the scene based on the model data in the browser to obtain the batch mesh rendering structure.
[0027] Specifically, when the browser frontend receives the first model data block, it immediately starts the incremental parsing program to perform incremental parsing on the arrived model data blocks and register the scene node corresponding to the model data block based on the parsing results.
[0028] Furthermore, a detailed hierarchical spatial tree structure is constructed based on the registered scene nodes; where each node in the detailed hierarchical spatial tree structure corresponds to a component, part group, or spatial region.
[0029] Furthermore, record the node information of each node in the detailed hierarchical spatial tree structure; wherein, the node information includes at least: the node's hierarchical relationship, enclosing range, associated detailed hierarchical set, and current dwelling state information.
[0030] The data of parts of the same material in the detail hierarchy spatial tree structure are aggregated, and the aggregated part data is meshed using a batch mesh generation tool to obtain a batch mesh rendering structure for the initial display of the assembly model in the browser front end.
[0031] As a possible implementation method, such as Figure 2As shown, the scene initialization and construction phase is executed in the browser frontend. First, the browser frontend establishes a data streaming channel between the browser frontend and the server. Then, the frontend continuously receives model data in chunks. This model data includes not only the geometric data of the components corresponding to the multi-level LOD model, but also model metadata describing node hierarchy relationships, material information, and relationships with the LOD model. After receiving a data chunk, the browser frontend does not wait for all model data transmission to complete; it immediately performs incremental parsing on the arrived data chunks and registers the corresponding scene nodes accordingly. Based on the scene node registration, the browser frontend further constructs a local LOD space tree structure. Each node in the LOD space tree corresponds to a component, part group, or spatial region, and records information such as the node's hierarchy, enclosing range, associated LOD set, and current dwell state. Finally, components of the same material are aggregated to construct an initial batch mesh rendering structure, BatchMesh, for model display.
[0032] S103. Perform multiple culling processing on the batch mesh rendering structure frame by frame, output a set of visible parts, and assign a corresponding level of detail to each part in the set of visible parts; wherein, the multiple culling processing includes at least frustum culling and occlusion culling.
[0033] Specifically, the batch mesh rendering structure is traversed frame by frame. A hierarchical spatial acceleration structure is used to identify and skip redundant nodes outside the viewport in the current frame, performing view frustum culling. Based on hardware-level hierarchical Z-buffering technology, the depth distribution of the current frame is compared with the previous frame, and occlusion culling is performed by removing internal parts in the current frame that are completely occluded by large structures in front.
[0034] Furthermore, the remaining components after frustum culling and occlusion culling are grouped into a visible component set. The projected visual proportion of each visible component in the visible component set in the screen space is calculated, and a corresponding level of detail is assigned to each visible component based on the projected visual proportion. Each visible component and its corresponding level of detail are then stored in a visibility list.
[0035] As a feasible implementation method, Figure 3 A frame scheduling and rendering loop flowchart provided in an embodiment of the present invention, such as Figure 3 As shown, the frame scheduling and rendering loop mainly includes multiple culling, LOD switching, rendering execution, and dynamic scheduling feedback. This process includes the definition of the real-time rendering pipeline, and based on the multiple culling and LOD mechanisms, it effectively reduces the rendering load and enables efficient rendering of large-scale assembly scenes.
[0036] like Figure 3As shown, during the multiple culling and LOD scheduling stages, multi-dimensional spatial and depth filtering minimizes the invalid geometric load fed into the GPU rendering pipeline. The system first performs efficient frustum culling, using hierarchical spatial acceleration to quickly identify and skip redundant nodes outside the viewport. Subsequently, based on hardware-level Hierarchical Z-Buffer (HZB) technology, precise depth occlusion queries are implemented, culling hidden internal parts completely occluded by large structures in front by comparing the depth distribution of the previous frame. For the visible set that finally passes the culling test, the system dynamically evaluates the projected visual proportion of each node in screen space and adaptively allocates the most suitable Level of Detail (LOD). This process, through layer-by-layer filtering of the rendering load, achieves extreme optimization of memory bandwidth and vertex computation throughput while ensuring the visual fidelity of ultra-large assemblies.
[0037] In a further implementation, Figure 4 This is a schematic diagram of occlusion culling provided in an embodiment of the present invention, such as... Figure 4 As shown, a precise depth occlusion query is performed on the model. By comparing the component depth distribution with that of the previous frame, hidden internal components completely obscured by large structures in front are removed. For example... Figure 5 If the topmost cube is completely obscured by the wall in front and is out of sight, then the data of that cube can be removed to reduce the amount of rendering.
[0038] S104. Based on the level of detail, perform batch Draw Call rendering on the collection of visible parts. During the rendering process, dynamically execute part unloading or part restoration based on the memory threshold.
[0039] Specifically, based on the level of detail in the visibility list, a corresponding rendering material and rendering state are bound to each visible component. Then, based on the rendering material and rendering state, a Draw Call rendering instruction is sequentially issued for each visible component.
[0040] Furthermore, while initiating the rendering command, an asynchronous state feedback closed-loop mechanism is started. Based on the latest camera pose parameters and viewport state of the current frame, a depth traversal of the detail level spatial tree structure of the entire scene is performed to evaluate and extract the expected set of resident nodes for the next frame.
[0041] As a possible implementation method, such as Figure 3 As shown, during the rendering execution phase, the system receives the final set of visible components and their matching LOD levels from the previous stage's filtered output. Based on this visibility list, the corresponding materials and rendering states are bound, and Draw Calls are sequentially initiated for the components culled by occlusion, achieving efficient rendering of the current frame with minimal overhead.
[0042] During the dynamic scheduling feedback phase, while submitting rendering instructions, the system asynchronously starts the state feedback closed loop: based on the latest camera pose parameters and viewport state of the current frame, it performs a depth traversal of the LOD space tree of the entire scene, evaluates and extracts the expected set of resident nodes for the next frame.
[0043] Furthermore, during the rendering process, if the system detects that memory usage is approaching a preset threshold, components that have completed display data construction and GPU resource uploading but are not currently participating in display or interaction are identified as candidate unloading objects. The original geometric data of the candidate unloading objects in memory, as well as the parsed intermediate objects, are released, and their binary data, data block indexes, and other recovery information are written to IndexedDB.
[0044] During the component restoration process, when an unloaded component is selected, measured, sectioned, or depended on by other interactive logic, the corresponding data is read from IndexedDB based on the index relationship in the detail hierarchy spatial tree structure, and the corresponding full model information is restored.
[0045] As a feasible implementation method, Figure 5 A flowchart of a parts unloading and restoration scheduling method is provided for an embodiment of the present invention, such as... Figure 5 As shown, when opening a large-scale assembly model, the front-end parses part data in a streaming, chunked manner. When the system detects that memory usage is approaching a preset threshold, parts that have completed display data construction and GPU resource upload but are not currently involved in display or interaction are selected as candidate unloading objects. The system releases the raw geometric data and intermediate parsing objects in its JavaScript heap memory and writes the necessary binary data, data block indexes, and other recovery information to IndexedDB. During part restoration, when an unloaded part is selected, measured, sectioned, or depended upon by other interactive logic, the system reads the corresponding data from IndexedDB based on the index relationship in the spatial tree and constructs the corresponding full model information. If memory is insufficient, parts that are used infrequently and do not currently affect display and interaction are prioritized for unloading. This achieves virtualized residency and on-demand recovery of large-scale assembly model data, preventing the browser from crashing due to excessive memory pressure.
[0046] The following example illustrates the execution process of the real-time rendering method for complex, large-scale assembly scenes on the browser side, as described in this invention, using a large industrial assembly model as an example: a. Data Preparation and Preprocessing: The input is a complete assembly model, with raw geometric data approximately 1.5GB in size, containing about 100,000 individual parts and a total of 100 million facets. During the preprocessing stage, the system performs offline processing on the model data, generating multiple levels of detail (LOD) models based on geometric simplification algorithms. These include a LOD0 original accuracy model, a LOD1 model simplified by 50%, a LOD2 model simplified by 80%, and a LOD3 model simplified by 90%. Subsequently, the model data is segmented and packaged according to the parts, preparing for the establishment of a streaming loading channel.
[0047] b. Scene Initialization and First Screen Display: When a user opens the assembly model through a browser, the browser frontend first establishes a data streaming channel between the browser frontend and the server. After receiving the first batch of data blocks, the browser frontend immediately performs incremental parsing on the arrived data, registers the main scene nodes, and constructs a spatial tree based on the processed multi-level LOD data. It then indexes each component to its corresponding spatial node, providing a data foundation for the frontend's rapid retrieval, visibility determination, and on-demand scheduling. The browser frontend aggregates components with the same material or similar rendering states, such as the external skin and wing shell, into an initial BatchMesh and completes the model's first screen display.
[0048] c. Multiple culling and LOD scheduling: Enable occlusion culling based on the depth map of the previous frame. Since the assembly skin has been rendered to the depth buffer, the system automatically determines that thousands of parts inside the skin are in an occluded state, thereby canceling their rendering command submission, reducing the memory usage and computing load of this area by more than 70%.
[0049] For nodes that pass the culling test, the system selects an appropriate LOD level based on the node's distance from the camera, the screen space projection area, and the current rendering load. When viewing the appearance from a distance, distant components can use low-precision LOD; when the user zooms, the system switches to high-precision LOD data for the corresponding area, ensuring that the browser heap memory remains at a stable level of around 3GB.
[0050] d. Part Unloading and Restoration: When the system detects that the browser's memory usage is approaching a preset threshold, it selects parts from the unloading queue that are not currently being displayed or interacted with and have a low probability of being accessed in the short term as candidate unloading objects. For parts that no longer require specific editing, the system releases their original geometric data and parsing intermediate objects in the JavaScript heap memory, and writes the necessary binary data, data block indexes, and recovery information to IndexedDB.
[0051] When a user selects an unloaded part for measurement, sectioning, or other operations, the system reads the corresponding data from IndexedDB based on the index relationship in the spatial tree, restores the runtime object of the part, and updates the node status.
[0052] e. Performance Verification and Results: On an NVIDIA RTX 409 graphics card, the system achieved real-time rendering at 60 FPS at 1920×1080 resolution. In a massive assembly scene with 100 million polygons, there was no noticeable stuttering when users rotated or translated the scene, and there were no obvious jumps when switching LODs.
[0053] In addition, embodiments of the present invention also provide a real-time rendering system for complex assembly scenes on a browser side, such as... Figure 6 As shown, the browser-side complex assembly scene real-time rendering system 600 specifically includes: The pre-data preparation module 610 is used to perform offline preprocessing on the original assembly model to generate a multi-level detail model; to divide and encapsulate the model data of the multi-level detail model into blocks, and to transmit the block-encapsulated model data from the server to the browser through a pre-built streaming transmission channel; and to perform scene initialization and construction on the browser based on the model data to obtain a batch mesh rendering structure. The loop rendering module 620 is used to perform multiple culling processing on the batch mesh rendering structure frame by frame, output a set of visible parts, and assign a corresponding level of detail to each part in the set of visible parts; wherein, the multiple culling processing includes at least frustum culling and occlusion culling. The part unloading and restoration scheduling module 630 is used to perform batch Draw Call rendering on the set of visible parts according to the level of detail. During the rendering process, the part unloading or restoration is dynamically executed based on the memory threshold.
[0054] The various embodiments in this invention are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the embodiments of apparatus, devices, and non-volatile computer storage media are basically similar to the method embodiments, so the descriptions are relatively simple; relevant parts can be referred to the descriptions of the method embodiments.
[0055] The foregoing has described specific embodiments of the present invention. Furthermore, the processes depicted in the drawings do not necessarily require a specific or sequential order to achieve the desired results. In some embodiments, multitasking and parallel processing are possible or may be advantageous.
[0056] The above description is merely an embodiment of the present invention and is not intended to limit the present invention. For those skilled in the art, various modifications and variations can be made to the embodiments of the present invention. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principle of the embodiments of the present invention should be included within the protection scope of the present invention.
Claims
1. A method for real-time rendering of complex assembly scenes on a browser-side platform, characterized in that, The method includes: The original assembly model is preprocessed offline to generate a multi-level detail model; The model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming transmission channel; In the browser, scene initialization is performed based on the model data to obtain a batch mesh rendering structure, specifically including: When the browser receives the first model data block, it immediately starts the incremental parsing program to perform incremental parsing on the arrived model data blocks and registers the scene node corresponding to the model data block based on the parsing results. Based on the registered scene nodes, a detailed hierarchical spatial tree structure is constructed; wherein, a node in the detailed hierarchical spatial tree structure corresponds to a component, part group, or spatial region; Record the node information of each node in the detailed hierarchy spatial tree structure; wherein, the node information includes at least: the node's hierarchical relationship, enclosing range, associated detailed hierarchy set, and current dwell state information; Data of parts of the same material in the detail hierarchy space tree structure are aggregated, and the aggregated part data is meshed using a batch mesh generation tool to obtain the batch mesh rendering structure for the initial display of the assembly model in the browser front end. The batch mesh rendering structure undergoes multiple culling processes frame by frame to output a set of visible components, specifically including: The batch mesh rendering structure is traversed frame by frame; By using a hierarchical spatial acceleration structure, redundant nodes outside the viewport in the current frame are identified and skipped, and view frustum culling is performed. Based on hardware-level hierarchical Z-buffering technology, the depth distribution of the current frame is compared with that of the previous frame. Based on the comparison results, internal parts that are completely occluded by large structures in front of the current frame are removed, and occlusion removal is performed. The remaining components after visual cone removal and occlusion removal are summarized into the visible component set; Assign a corresponding level of detail to each component in the set of visible components; wherein, the multiple culling process includes at least frustum culling and occlusion culling; Based on the level of detail, batch Draw Call rendering is performed on the set of visible components. During the rendering process, component unloading or component restoration is dynamically executed based on memory thresholds.
2. The method for real-time rendering of complex assembly scenes on a browser side according to claim 1, characterized in that, Offline preprocessing is performed on the original assembly model to generate a multi-level detail model, specifically including: Input the complete original assembly model data into the server or preprocessing engine; wherein the original assembly model data includes at least all component geometric data, topological relationships and material information; The error cost generated by the edge folding operation of the original assembly model is calculated using a quadratic error metric algorithm. Based on the error cost and different preset simplification ratios, the original assembly model is geometrically simplified to different degrees to obtain multi-level detail data; wherein, key geometric features of the model parts are preserved while performing geometric simplification. Based on the multi-level detail data, detail levels are constructed and spatially organized to obtain a multi-level detail model.
3. The method for real-time rendering of complex assembly scenes on a browser side according to claim 1, characterized in that, The model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming channel, specifically including: Establish a streaming channel between the browser frontend and the server; The model data of the multi-level detail model is encapsulated in blocks and sent to the browser front end through the streaming transmission channel; the model data includes the component geometry data corresponding to the multi-level detail data, as well as model metadata used to describe the node hierarchy relationship, material information and detail hierarchy association relationship.
4. The method for real-time rendering of complex assembly scenes on a browser side according to claim 1, characterized in that, Assigning a corresponding level of detail to each component in the set of visible components, specifically including: Calculate the projected visual proportion of each visible component in the set of visible components in the screen space; Based on the projected visual proportion, assign a corresponding level of detail to each visible component; Store each visible component and its corresponding level of detail in a visibility list.
5. The method for real-time rendering of complex assembly scenes on a browser-side according to claim 4, characterized in that, Based on the level of detail, batch Draw Call rendering is performed on the set of visible components, specifically including: Based on the level of detail in the visibility list, bind the corresponding rendering material and rendering state to each visible component; Based on the rendering material and rendering state, a Draw Call rendering command is sequentially initiated for each visible component; While initiating the rendering command, an asynchronous state feedback closed-loop mechanism is started. Based on the latest camera pose parameters and viewport state of the current frame, a depth traversal of the detail level spatial tree structure of the entire scene is performed to evaluate and extract the expected set of resident nodes for the next frame.
6. The method for real-time rendering of complex assembly scenes on a browser side according to claim 1, characterized in that, During the rendering process, component unloading or restoration is dynamically performed based on memory thresholds, specifically including: During the rendering process, if the system detects that the memory usage is close to the preset threshold, it will identify the components that have completed the construction of display data and the uploading of GPU resources, but are not currently participating in display or interaction, as candidate unloading objects. Release the original geometric data of the candidate unloaded object in memory and parse the intermediate object, and write its binary data, data block index and other recovery information into IndexedDB; During the component restoration process, when an unloaded component is selected, measured, sectioned, or depended on by other interactive logic, the corresponding data is read from IndexedDB according to the index relationship in the detail hierarchy spatial tree structure, and the corresponding full model information is restored.
7. A browser-based real-time rendering system for complex assembly scenes, employing the browser-based real-time rendering method for complex assembly scenes as described in any one of claims 1-6, characterized in that, The system includes: The pre-processing module is used to perform offline preprocessing on the original assembly model to generate a multi-level detail model; the model data of the multi-level detail model is segmented and encapsulated, and the segmented and encapsulated model data is transmitted from the server to the browser through a pre-built streaming transmission channel; the browser initializes and constructs the scene based on the model data to obtain a batch mesh rendering structure. The loop rendering module is used to perform multiple culling processing on the batch mesh rendering structure frame by frame, output a set of visible parts, and assign a corresponding level of detail to each part in the set of visible parts; wherein, the multiple culling processing includes at least frustum culling and occlusion culling. The part unloading and restoration scheduling module is used to perform batch Draw Call rendering on the set of visible parts according to the level of detail. During the rendering process, the part unloading or restoration is dynamically executed based on the memory threshold.
8. A storage medium, characterized in that, The storage medium is a non-volatile computer-readable storage medium, which stores at least one program. Each program includes instructions, which, when executed by a terminal, cause the terminal to perform a real-time rendering method for complex assembly scenes on a browser-side according to any one of claims 1-6.
Citation Information
Patent Citations
WebGL-based large-scale scene rendering method
CN111415401A
