High-performance three-dimensional scene real-time building and rendering method based on Web end

Abstract

The invention discloses a high-performance three-dimensional scene real-time building and rendering method based on a Web end. The method comprises the following steps: step 1, quadtree block division; 2, browser embedded rendering is carried out; step 3, scene tree node rendering; step 4, interactive optimization and integration; according to the method, rapid construction and real-time rendering of a large-scale three-dimensional scene at a Web end are realized, the frame rate is stabilized at a relatively high level, and the display requirements of high definition and low delay are met.

Description

Technical Field

[0001] The present invention relates to the technical field of real-time construction and rendering of three-dimensional scenes, and in particular to a high-performance real-time construction and rendering method of three-dimensional scenes based on a Web terminal. Background Art

[0002] At present, when realizing the ability of high-performance real-time construction and rendering of 3D scenes in the Web environment, although each has its own emphasis on 3D scene construction and rendering, what they lack in common is optimization measures for specific needs of the Web end, especially in dynamic data processing, cross-platform compatibility and global accessibility. Specifically, the existing technologies and their shortcomings are as follows:

[0003] CN115272553A is a real-time rendering method and system for building a three-dimensional scene based on metadata sharing. It has outstanding performance in improving rendering efficiency, but is mainly limited to optimizing the existing rendering process and does not involve how to directly achieve efficient three-dimensional scene rendering in a Web environment. In addition, the rendering merging technology that relies on GPU does not provide sufficient support for the scalability and interoperability of the Web side, which limits its flexibility in cloud and cross-platform applications.

[0004] CN114170393A is a method for building a three-dimensional map scene based on multiple data. Although it provides an efficient method for building a geographic scene, its technology is mainly applicable to specific types of geographic data and scenes, and lacks support for efficient rendering technology on the Web side, especially in cross-platform and remote access applications. In addition, the method may face performance bottlenecks in dynamic scene rendering and large-scale data processing.

[0005] CN116030198A is a method, device and apparatus for quickly and conveniently building a three-dimensional scene based on a three-dimensional engine. Although it improves the convenience of building a three-dimensional scene, it may not be as efficient as the method proposed in the invention document of this application in terms of real-time rendering and large-scale data processing. Especially in the application in the Web environment, there is a lack of detailed discussion on how to optimize the rendering of the three-dimensional scene on the Web side, which may limit its practicality and efficiency in online and cloud environments. Summary of the invention

[0006] The purpose of the present invention is to overcome the above-mentioned shortcomings and provide a high-performance real-time construction and rendering method of three-dimensional scenes based on the Web to solve the problems raised in the background technology.

[0007] In order to solve the above technical problems, the technical solution adopted by the present invention is: a high-performance real-time construction and rendering method of three-dimensional scenes based on the Web, which comprises the following steps:

[0008] Step 1: Quadtree block division: Based on the quadtree structure, the 3D scene data is divided into multiple blocks according to differentiated accuracy, the distance parameter of the viewpoint of the monitor is called, sorted according to the distance, the rendering details of multiple blocks are dynamically adjusted, and multiple blocks are traversed to verify the accuracy requirements to generate hierarchical block data;

[0009] Step 2: Browser embedded rendering: Use NPAPI plug-in technology to embed the OpenSceneGraph rendering engine into the Web browser, call the browser interface for global initialization, load the hierarchical block data, call the model of corresponding accuracy according to the viewpoint position, gradually load each model node, and establish an embedded rendering model;

[0010] Step 3: Rendering of scene tree nodes: During the rendering process of each frame, traverse the scene tree nodes, remove nodes outside the viewport, render the cropped nodes, call the paging database function to load the model nodes, traverse and render multiple nodes in sequence, use the embedded rendering model to complete the rendering, and generate real-time rendering data;

[0011] Step 4: Interaction optimization and integration: Optimize the interaction mechanism between UI and 3D scenes, call the rendering level and interaction logic parameters of UI elements, combine real-time rendering data with UI interaction data, build and render batch 3D scenes in real time, and generate interactive integration data.

[0012] Furthermore, step 1 includes the following sub-steps: quadtree segmentation of the three-dimensional scene; assigning three-dimensional coordinates to nodes; calculating the distance from the node to the viewpoint; generating a distance list; sorting the distance list and adjusting the sorting weight; generating a sorted block list; calculating the rendering details of each block and generating specific rendering details; dynamically adjusting the rendering detail list.

[0013] Furthermore, the step 1 specifically includes the following process:

[0014] The quadtree data structure is used to recursively segment the three-dimensional scene, assign three-dimensional coordinates to each node, and calculate the Euclidean distance d from each block node to the monitor's viewpoint. i , using the formula:

[0015]

[0016] Generate distance list D list ;

[0017] Among them, x i ,y i , z i Represents the coordinates of the block, x v ,y v , z v represents the coordinates of the viewpoint of the monitor, d iis the distance from the node to the viewpoint, D list is the distance list of all blocks;

[0018] Right D list Sort the distance data in, adjust the sorting weight and distance factor, and use the formula:

[0019]

[0020] Generate a sorted block list S sorted ;

[0021] Among them, k a is the attenuation coefficient, adjusts the distance sensitivity, d0 is the reference distance, c is the offset constant, R i is the rendering priority of the block, S sorted is the sorted block list;

[0022] According to S sorted and R i Calculate the rendering detail level of each block using the formula:

[0023]

[0024] Generate rendering details D for each block details , where: D i The rendering detail level for each block, D details is the list of dynamically adjusted block rendering details, α is the scale factor, which amplifies the influence of sorting weight, β g is the normalization constant, avoiding R i Too low D i Close to zero, γ a Adjust R i The nonlinear effect of

[0025] Traverse the adjusted multi-block rendering detail list D details , verify whether the rendering details of each block meet the accuracy requirements and generate hierarchical block data.

[0026] Furthermore, the step 2 includes the following sub-steps: configuring the plug-in; setting basic parameters; calculating the configuration sum and generating a parameter set; performing logical verification; calculating the verification value and generating a verification result; global initialization; determining the execution level; completion status; loading hierarchical block data; selecting the model progress and directly building a low-precision model; viewpoint position verification; modifying the model accuracy; calculating the loading sequence; gradually loading the model nodes; and building a rendering model.

[0027] Furthermore, in step 2, the steps of calling the browser interface to perform global initialization are specifically as follows:

[0028] Configure the NPAPI plug-in to interface with the Web browser and set basic parameters using the formula:

[0029] C=β·(ω1·P1+ω2·P2+ω3·P3+ω4·P4)

[0030] Generate initialization configuration set P set ;

[0031] Among them, C represents the total configuration, β represents the adjustment coefficient, ω1, ω2, ω3, ω4 are the weights of multiple parameters, P1, P2, P3, P4 represent the initialization parameters, P set Represents a parameter configuration set;

[0032] Initialize the configuration set P set Perform logic check using the formula:

[0033]

[0034] Calculate the check value V and generate the logic check result R;

[0035] Among them, V represents the check value, k b represents the sensitivity coefficient, T represents the threshold value, and R represents the verification result;

[0036] Based on the logic check result R, perform global initialization using the formula:

[0037] I=α b ·V 2 / (γ+V)

[0038] Determine the initialization execution level I and obtain the global initialization completion status S init ;

[0039] Among them, I represents the initialization execution level, α b represents the execution weight, γ represents the regularization constant, S init Represents the initialization state.

[0040] Furthermore, in step 2, the step of acquiring the embedded rendering model is specifically as follows:

[0041] Load the hierarchical block data and integrate the data using the weighted sum formula:

[0042]

[0043] Generate the integrated block dataset D total ;

[0044] Among them, D represents integrated data, L i Presentation layer data, ω i Representation layer weights;

[0045] Select a model with appropriate accuracy according to the viewpoint position, and use the formula to calculate the model loading sequence:

[0046]

[0047] Get the model loading sequence M seq ;

[0048] Among them, M represents the model sequence, S j is the model accuracy, φ j is the position weight, σ is a constant;

[0049] Load each model node step by step, using the cascade loading formula:

[0050]

[0051] Building an embedded rendering model model ;

[0052] Where N represents the total node load, which is the weighted sum of all model nodes, the adjusted total load, δ represents the loading rate, which is an adjustment factor used to control the loading speed or the overall intensity of the loading, and ψ k Represents the node weight, each model node M k There is a corresponding weight, which determines the contribution ratio of the node in the total load. k Represents a model node, which is a single node in the embedded rendering model. b Represents model node k c The total number of Indicates the sum of all model nodes.

[0053] Furthermore, the step 3 includes the following sub-steps: traversing the scene tree nodes; identifying valid nodes in the viewport; rendering and cropping; loading model nodes and calling the embedded rendering model; generating loaded model data; performing final rendering; and generating real-time rendering data.

[0054] Furthermore, the specific process of step 3 is as follows:

[0055] Traverse the scene tree nodes and identify the valid nodes in the viewport using the formula:

[0056]

[0057] Generate a valid node list R activei ;

[0058] Among them, R active Represents a valid node list, v iIndicates the visibility of the node, a i Indicates the activation state of the node;

[0059] Using the valid node list R active To perform node pruning, use the formula:

[0060]

[0061] Generate pruned node set C rendered ;

[0062] Among them, C rendered represents the pruned node set, r j Indicates the importance of the node, γ j Indicates the node clipping coefficient;

[0063] Using the pruned node set C rendered Calling embedded rendering model N model To load the model nodes, use the formula:

[0064]

[0065] Generate loaded model data L loaded ;

[0066] Among them, L loaded represents the loaded model data, that is, the final loading result of the calculated model after clipping and weight adjustment, δ represents the loading rate, which is used as a coefficient to adjust the speed or total amount of the entire loading process, ξ k Represents the node loading weight, which determines the relative importance of each node in the pruned node set during the loading process. model (C rendered (k d )) represents the embedded rendering model N model In the example, according to the pruning node set C rendered The kth d nodes to load, p d Represents the pruning node set C rendered The total number of nodes;

[0067] Using the loaded model data L loaded To render the scene, use the formula:

[0068]

[0069] Generate real-time rendering data F realtime ;

[0070] Among them, F realtime represents real-time rendering data, θ represents rendering efficiency, and ψ qRepresents the rendering weight.

[0071] Furthermore, step 4 includes the following sub-steps: optimizing the UI interaction mechanism; generating UI rendering layer data; combining real-time rendering data to batch build three-dimensional scenes; generating three-dimensional scene data; rendering three-dimensional scenes in real time; generating real-time rendering results; combining UI interaction data; generating interaction integration data.

[0072] Furthermore, the step 4 specifically includes the following process:

[0073] Optimize the interaction mechanism between UI and 3D scene, call the rendering level and interaction logic parameters of UI elements, and use the formula:

[0074]

[0075] Generate optimized UI rendering level data U;

[0076] Among them, U represents the optimized UI rendering level data, μ i Represents the interactive logic parameters of UI elements, L i Represents the rendering level of the UI element;

[0077] Combine the real-time rendering data R with the optimized UI rendering level data U to build batch 3D scenes using the formula:

[0078]

[0079] Generate batch-built 3D scene data S;

[0080] Among them, S represents the batch-built 3D scene data, R j Represents real-time rendering data, I j Represents UI interaction data, and U represents optimized UI rendering level data;

[0081] The batch-built 3D scene data S is rendered in real time using the formula:

[0082]

[0083] Generate real-time rendering result F;

[0084] Among them, F represents the real-time rendering result, which is the sum of all batch-built 3D scene data, S k Represents the kth of the batch-built 3D scene data g scenes, these scene data are accumulated to generate the overall rendering output, p g Represents the total number of scene data, that is, the sum in the formula is for all k g From 1 to p gAccumulate the three-dimensional scene data;

[0085] Combine the real-time rendering result F with the UI interaction data I, using the formula:

[0086]

[0087] Generate interactive integrated data XM;

[0088] Among them, ψ l represents the integration weight, F represents the real-time rendering result, I l Represents UI interaction data.

[0089] Beneficial effects of the present invention:

[0090] 1. The present invention processes dynamic scene data and adjusts rendering details; it optimizes the accuracy and performance of scene rendering by dividing the three-dimensional scene data based on a quadtree structure and dynamically adjusting the rendering details of multiple blocks according to the distance of the observer's viewpoint; this method generates layered block data through distance sorting and accuracy verification, which can effectively improve the data processing efficiency and visual experience in the rendering process, and ensure that a smooth user experience can be provided under different network and hardware conditions.

[0091] 2. The present invention integrates Web technology and scene rendering engine; it uses NPAPI plug-in technology to integrate OpenSceneGraph rendering engine into Web browser, which enables the construction and rendering of 3D scenes to be performed directly in Web environment without the need for additional software installation; this integration method not only simplifies the user's operation process, but also expands the accessibility and popularity of 3D scene applications, allowing a wider user group to experience high-quality 3D rendering effects.

[0092] 3. The present invention optimizes the integration of user interface interaction and real-time data rendering; it optimizes the interaction mechanism between UI and three-dimensional scenes, combines real-time rendering data with UI interaction data to perform batch construction and real-time rendering of three-dimensional scenes, thereby achieving the effect of improving user interaction efficiency and reducing response time; this interaction optimization not only enhances the user's operation intuitiveness, but also ensures the real-time performance of data rendering, so that users can receive scene updates instantly, thereby enhancing the dynamic expressiveness and practicality of the overall application.

[0093] 4. The technical solution of the present invention is very likely to be widely used in engineering simulation, virtual reality and other Web applications that require highly interactive three-dimensional scenes due to its in-depth analysis and prediction of user behavior, as well as its ability to dynamically configure resources and optimize rendering. It has broad application prospects in the engineering field. The application of this technology can significantly improve user experience and meet the demand for high-quality, highly interactive digital content in simulation application development; it can achieve rapid construction and real-time rendering of large-scale three-dimensional scenes on the Web side, with the frame rate stabilized at a high level to meet high-definition, low-latency display requirements. BRIEF DESCRIPTION OF THE DRAWINGS

[0094] Figure 1 It is a flowchart of a high-performance real-time construction and rendering method of three-dimensional scenes based on the Web;

[0095] Figure 2 This is a schematic diagram of the step-by-step process of step 1 of the present invention;

[0096] Figure 3 This is a schematic diagram of the process of calling the browser interface to perform global initialization in step 2 of the present invention;

[0097] Figure 4 This is a flow chart of the steps of acquiring the embedded rendering model in step 2 of the present invention;

[0098] Figure 5 This is a schematic diagram of the step-by-step process of step 3 of the present invention;

[0099] Figure 6 Schematic diagram of the step-by-step process of step 4 of the present invention. DETAILED DESCRIPTION

[0100] The present invention is further described in detail below in conjunction with the accompanying drawings and specific embodiments.

[0101] like Figure 1-6 As shown, a high-performance real-time construction and rendering method of a three-dimensional scene based on a Web terminal includes the following steps:

[0102] (1) Quadtree block division: Based on the quadtree structure, the 3D scene data is divided into multiple blocks according to differentiated accuracy. The distance parameter of the viewpoint of the monitor is called, and the rendering details of multiple blocks are dynamically adjusted according to the distance. Multiple blocks are traversed to verify the accuracy requirements and generate hierarchical block data.

[0103] The specific steps for obtaining hierarchical block data are as follows:

[0104] The quadtree data structure is used to recursively segment the three-dimensional scene, assign three-dimensional coordinates to each node, and calculate the Euclidean distance d from each block node to the monitor's viewpoint. i , using the formula:

[0105]

[0106] Generate distance list D list ;

[0107] Among them, x i ,y i , z i Represents the coordinates of the block, x v ,y v , z v represents the coordinates of the viewpoint of the monitor, d i is the distance from the node to the viewpoint, D list is the distance list of all blocks;

[0108] Right D list Sort the distance data in, adjust the sorting weight and distance factor, and use the formula:

[0109]

[0110] Generate a sorted block list S sorted ;

[0111] Among them, k a is the attenuation coefficient, adjusts the distance sensitivity, d0 is the reference distance, c is the offset constant, R i is the rendering priority of the block, S sorted is the sorted block list;

[0112] According to S sorted and R i Calculate the rendering detail level of each block using the formula:

[0113]

[0114] Generate rendering details D for each block details , where: D i The rendering detail level for each block, D details is the list of dynamically adjusted block rendering details, α is the scale factor, which amplifies the influence of sorting weight, β g is the normalization constant, avoiding R i Too low D i Close to zero, γ a Adjust R i The nonlinear effect of

[0115] Traverse the adjusted multi-block rendering detail list D details , verify whether the rendering details of each block meet the accuracy requirements and generate hierarchical block data.

[0116] 1. 3D scene segmentation and distance calculation formula:

[0117]

[0118] in:

[0119] x i ,y i , z i : The three-dimensional coordinates of the block node;

[0120] x v ,y v , z v : The three-dimensional coordinates of the monitor's viewpoint;

[0121] d i : Euclidean distance from the block node to the monitor's viewpoint;

[0122] Calculation process:

[0123] Each block node coordinate (x i ,y i , z i ) and viewpoint coordinates (x v ,y v , z v ) are obtained through 3D modeling software or 3D data acquisition system. i You need to subtract the coordinates of each block from the viewpoint coordinates, then square them, and finally take the square root of the sum.

[0124] Example calculation:

[0125] Set a block coordinate to (100, 200, 150) and the viewpoint coordinate to (50, 150, 100), then:

[0126]

[0127] d i The values ​​are used for sorting and iterative calculations.

[0128] 2. Sorting weight and distance factor calculation formula:

[0129]

[0130] in:

[0131] k a : Attenuation coefficient, adjust distance sensitivity;

[0132] d0: reference distance;

[0133] c: offset constant;

[0134] R i: The rendering priority of the block;

[0135] Calculation process:

[0136] k a , d0 and c need to be set according to actual visual needs and scene characteristics and can be recommended by experts.

[0137] R i is calculated by inserting d i The value is fed into the formula to calculate the rendering priority of each block.

[0138] Example calculation:

[0139] Setting k a =0.1, d0=75, c=5, using the d calculated above i =86.60:

[0140]

[0141] 3. Rendering detail level calculation formula:

[0142]

[0143] Among them: α, β g , γ a : Need to be obtained through experiments and adjustments based on rendering quality and performance requirements.

[0144] Calculation process:

[0145] Using the R calculated from above i Perform iterative calculations.

[0146] Example calculation:

[0147] Set α = 100, β g =1,γ a = 0.1, insert R i =0.02:

[0148] D i =100 0.02 2 / (1+0.1·0.02)=0.04 / 1.002=0.03992

[0149] (2) Browser embedded rendering: Using NPAPI plug-in technology, the OpenSceneGraph rendering engine is embedded in the Web browser, the browser interface is called for global initialization, the hierarchical block data is loaded, the model of corresponding accuracy is called according to the viewpoint position, each model node is loaded step by step, and an embedded rendering model is established;

[0150] The specific steps for calling the browser interface for global initialization are:

[0151] Configure the NPAPI plug-in to interface with the Web browser and set basic parameters using the formula:

[0152] C=β·(ω1·P1+ω2·P2+ω3·P3+ω4·P4)

[0153] Generate initialization configuration set P set ;

[0154] Among them, C represents the total configuration, β represents the adjustment coefficient, ω1, ω2, ω3, ω4 are the weights of multiple parameters, P1, P2, P3, P4 represent the initialization parameters, P set Represents a parameter configuration set;

[0155] Initialize the configuration set P set Perform logic check using the formula:

[0156]

[0157] Calculate the check value V and generate the logic check result R;

[0158] Among them, V represents the check value, k b represents the sensitivity coefficient, T represents the threshold value, and R represents the verification result;

[0159] Based on the logic check result R, perform global initialization using the formula:

[0160] I=α b ·V 2 / (γ+V)

[0161] Determine the initialization execution level I and obtain the global initialization completion status S init ;

[0162] Among them, I represents the initialization execution level, α b represents the execution weight, γ represents the regularization constant, S init Represents the initialization state.

[0163] Initialization configuration set calculation formula:

[0164] C=β·(ω1·P1+ω2·P2+ω3·P3+ω4·P4)

[0165] Parameter explanation and calculation process:

[0166] C: Configuration sum, which is the result of the weighted sum of multiple parameters after adjustment.

[0167] β: Adjustment coefficient, which is a coefficient used to adjust the weight impact of the overall configuration.

[0168] ω1, ω2, ω3, ω4: are the weights corresponding to each initialization parameter P1, P2, P3, P4, which are used to adjust the influence of each parameter in the overall configuration.

[0169] P1, P2, P3, P4: are initialization parameters, and their specific values ​​are set according to system requirements and performance indicators.

[0170] P set : Parameter configuration set, which is all P i A collection of parameters.

[0171] Specific numerical examples:

[0172] Set β = 1.5

[0173] Weights ω1 = 0.4, ω2 = 0.3, ω3 = 0.2, ω4 = 0.1

[0174] Parameters P1 = 10, P2 = 20, P3 = 30, P4 = 40

[0175] Calculation process:

[0176] C=1.5·(0.4·10+0.3·20+0.2·30+0.1·40)

[0177] C = 1.5·(4+6+6+4)

[0178] C=1.5·20=30

[0179] Initialize the logical verification formula of the configuration set:

[0180]

[0181] Parameter explanation and calculation process:

[0182] V: Check value, indicating the validity or rationality of parameter configuration.

[0183] k b : Sensitivity coefficient, used to adjust the effect of the difference between C and T on the output.

[0184] T: Threshold, used as a reference value and set according to system requirements.

[0185] R: Verification result, indicating whether the parameter configuration is valid.

[0186] Numerical example:

[0187] Setting k b =0.05, T=25

[0188] Calculation process:

[0189]

[0190] The formula for determining the global initialization execution level is:

[0191] I=α b ·V 2 / (γ+V)

[0192] Parameter explanation and calculation process:

[0193] I: Initialization execution level, which determines the specific execution intensity or degree of initialization.

[0194] α b : Execute weight to enhance or weaken the influence of the check value V.

[0195] γ: Normalization constant, which prevents the denominator from being zero or too small and ensures the stability of the calculation.

[0196] S init Initialization completed state, the final global initialization state.

[0197] Numerical example:

[0198] Setting α b =100,γ=10

[0199] Calculation process:

[0200] I=100·11.24 2 / (10+11.24)

[0201] I=100·126.2976 / 21.24

[0202] I=100·5.944≈594.4

[0203] The specific steps for obtaining the embedded rendering model are:

[0204] Load the hierarchical block data and integrate the data using the weighted sum formula:

[0205]

[0206] Generate the integrated block dataset D total ;

[0207] Among them, D represents integrated data, L i Presentation layer data, ω i Representation layer weights;

[0208] Select a model with appropriate accuracy according to the viewpoint position, and use the formula to calculate the model loading sequence:

[0209]

[0210] Get the model loading sequence M seq ;

[0211] Among them, M represents the model sequence, S j is the model accuracy, φ j is the position weight, σ is a constant;

[0212] Load each model node step by step, using the cascade loading formula:

[0213]

[0214] Building an embedded rendering model model ;

[0215] Where N represents the total node load, which is the weighted sum of all model nodes, the adjusted total load, δ represents the loading rate, which is an adjustment factor used to control the loading speed or the overall intensity of the loading, and ψ k Represents the node weight, each model node M k There is a corresponding weight, which determines the contribution ratio of the node in the total load. k Represents a model node, the value is a single node in the embedded rendering model, p b Represents model node k c The total number of Indicates the sum of all model nodes.

[0216] formula:

[0217]

[0218] Parameter source and calculation process:

[0219] ω i : Layer weight. In practical applications, the weight is determined based on the visualization importance or data density of the layer. Refer to the setting of weights in a typical rendering system, for example, weights are assigned based on rendering priority or visual impact.

[0220] L i : Layer data. These data come from actual 3D scans of the scene or are generated through specific modeling software.

[0221] Specific values ​​and examples:

[0222] The setup scenario consists of three layers with weights ω1 = 0.2, ω2 = 0.3, and ω3 = 0.5.

[0223] The data of each layer is the number of voxels or point cloud density, using the setting values ​​L1=100, L2=200, L3=300.

[0224] Calculation process:

[0225] D=0.2·100+0.3·200+0.5·300=20+60+150=230

[0226] Select the model formula with appropriate accuracy according to the viewpoint position:

[0227]

[0228] Parameter source and calculation process:

[0229] σ: is a normalization constant used to ensure that the result is properly scaled. Its value can be determined based on the specific needs of the system, for example, to keep the range of M within a certain numerical range.

[0230] φ j : Location weights. These weights are set based on the geographic or logical importance of the model location relative to the observation point, and can be determined through scenario analysis or user interaction data.

[0231] S j : Model accuracy. This is determined by the level of detail and complexity of the model and is proportional to the detail and size of the model.

[0232] Specific values ​​and examples:

[0233] Setting σ=2, the model includes two elements, whose position weights are φ1=0.3 and φ2=0.7, and the precisions are S1=50 and S2=150 respectively.

[0234] Calculation process:

[0235]

[0236] Load each model node formula step by step:

[0237]

[0238] Parameter source and calculation process:

[0239] δ: Loading rate, which depends on system performance and resources. It can be set according to the processing power and bandwidth of the hardware.

[0240] φ k : Node weight, which is set based on the priority of the node during rendering, which may depend on the visual importance or computational requirements of the node.

[0241] M k : Model nodes, these are specific rendering or processing units, whose complexity and size can be derived through model analysis.

[0242] Specific values ​​and examples:

[0243] Set δ=0.8. There are two model nodes with weights φ1=0.6 and φ2=0.4, and node values ​​M1=120 and M2=280.

[0244] Calculation process:

[0245] N=0.8·(0.6·120+0.4·280)=0.8·(72+112)=147.2

[0246] (3) Scene tree node rendering: During the rendering process of each frame, the scene tree nodes are traversed, nodes outside the viewport are removed, the cropped nodes are rendered, the paging database function is called to load the model nodes, multiple nodes are traversed and rendered in sequence, and the embedded rendering model is used to complete the rendering and generate real-time rendering data;

[0247] The specific steps for obtaining real-time rendering data are as follows:

[0248] Traverse the scene tree nodes and identify the valid nodes in the viewport using the formula:

[0249]

[0250] Generate a valid node list R activei ;

[0251] Among them, R active Represents a valid node list, v i Indicates the visibility of the node, a i Indicates the activation state of the node;

[0252] Using the valid node list R active To perform node pruning, use the formula:

[0253]

[0254] Generate pruned node set C rendered ;

[0255] Among them, C rendered represents the pruned node set, r j Indicates the importance of the node, γ j Indicates the node clipping coefficient;

[0256] Using the pruned node set C rendered Calling embedded rendering model N model To load the model nodes, use the formula:

[0257]

[0258] Generate loaded model data L loaded ;

[0259] Among them, L loaded represents the loaded model data, that is, the final loading result of the calculated model after clipping and weight adjustment, δ represents the loading rate, which is used as a coefficient to adjust the speed or total amount of the entire loading process, ξ k Represents the node loading weight, which determines the relative importance of each node in the pruned node set during the loading process. model (C rendered (k d )) represents the embedded rendering model N model In the example, according to the pruning node set C rendered The kth d nodes to load, p d Represents the pruning node set C rendered The total number of nodes;

[0260] Using the loaded model data L loaded To render the scene, use the formula:

[0261]

[0262] Generate real-time rendering data F realtime ;

[0263] Among them, F realtime represents real-time rendering data, θ represents rendering efficiency, and ψ q Represents the rendering weight.

[0264] The formula for generating the valid node list is:

[0265]

[0266] Parameter explanation and source:

[0267] R active： The total number of valid nodes, which indicates the number of all visible and activated nodes in the current scene.

[0268] v i : The visibility of the i-th node. This is usually done through geometric calculations or depth sensors to detect whether the node is visible within the current viewing angle.

[0269] a i : The activation state of the ith node. This is usually determined by the scene management system, based on the node's dynamics (such as animation state) or interactivity (user contact or response).

[0270] Calculation process:

[0271] Consider a real-world scenario where there are three nodes:

[0272] Node 1: Visible v1 = 1, Activated a1 = 1

[0273] Node 2: invisible v2=0, activated a2=1

[0274] Node 3: Visible v3 = 1, inactive a3 = 0

[0275] Calculate R active :

[0276] R active =1×1+0×1+1×0=1

[0277] Implementation formula of node pruning:

[0278]

[0279] Parameter explanation and source:

[0280] C rendered : The pruned node set reflects the sum of important nodes that are processed first.

[0281] γ j : Clipping factor, which may be set based on the optimization requirements or rendering complexity of the node.

[0282] r j : The importance of the node, which can be based on the priority of the node in the visual presentation, such as nodes in the central visual area get higher weights.

[0283] Calculation process:

[0284] There are two nodes that need to be pruned, and their pruned coefficients and importances are set as follows:

[0285] Node 1: γ1 = 0.5, r1 = 2

[0286] Node 2: γ2 = 0.7, r2 = 1

[0287] Calculate C rendered :

[0288] C rendered =0.5×2×1=1

[0289] Loading formula for model nodes:

[0290]

[0291] Parameter explanation and source:

[0292] L loaded: The sum of model data loaded, reflecting the aggregation of all loaded models.

[0293] δ: Loading rate, usually set according to the system's processing power and response time requirements.

[0294] ξ k : Node k d The loading weight of the node can be based on the data size or processing requirements of the node.

[0295] Calculation process:

[0296] Set only one node to be loaded, and set the loading rate and weight to:

[0297] δ=1,ξ1=1

[0298] Using the previous C rendered As a result, the model is loaded:

[0299] L loaded =1×1×1=1

[0300] Real-time rendering formula of the scene:

[0301]

[0302] Parameter explanation and source:

[0303] F realtime : The sum of real-time rendering data, showing the final output of the rendered scene.

[0304] θ: Rendering efficiency, which is usually related to the performance of the graphics processing unit (GPU).

[0305] Ψ q : Rendering weight, set based on the visual importance of the rendered content or the frequency of user interaction.

[0306] Calculation process:

[0307] There are a few things to consider when setting up the rendering scene. Set the efficiency and weights to:

[0308] θ=1,Ψ1=1

[0309] Using the previous L loaded The result is the final render:

[0310] F realtime =1×1×1=1(4) Interaction optimization and integration: Optimize the interaction mechanism between UI and 3D scenes, call the rendering level and interaction logic parameters of UI elements, combine real-time rendering data with UI interaction data, build and render batch 3D scenes in real time, and generate interaction integration data.

[0311] Optimize the interaction mechanism between UI and 3D scene, call the rendering level and interaction logic parameters of UI elements, and use the formula:

[0312]

[0313] Generate optimized UI rendering level data U;

[0314] Among them, U represents the optimized UI rendering level data, μ i Represents the interactive logic parameters of UI elements, L i Represents the rendering level of the UI element;

[0315] Combine the real-time rendering data R with the optimized UI rendering level data U to build batch 3D scenes using the formula:

[0316]

[0317] Generate batch-built 3D scene data S;

[0318] Among them, S represents the batch-built 3D scene data, R j Represents real-time rendering data, I j Represents UI interaction data, and U represents optimized UI rendering level data;

[0319] The batch-built 3D scene data S is rendered in real time using the formula:

[0320]

[0321] Generate real-time rendering result F;

[0322] Among them, F represents the real-time rendering result, which is the sum of all batch-built 3D scene data, S k Represents the kth of the batch-built 3D scene data g scenes, these scene data are accumulated to generate the overall rendering output, p g Represents the total number of scene data, that is, the sum in the formula is for all k g From 1 to p g Accumulate the three-dimensional scene data;

[0323] Combine the real-time rendering result F with the UI interaction data I, using the formula:

[0324]

[0325] Generate interactive integrated data XM;

[0326] Among them, ψ l represents the integration weight, F represents the real-time rendering result, I lRepresents UI interaction data.

[0327] Optimize the calculation formula of UI rendering level data:

[0328]

[0329] in:

[0330] U: Optimized UI rendering level data, indicating the UI level after integrating the interaction logic parameters.

[0331] μ i : The interactive logic parameters of UI elements determine the importance or response method of each UI element in user interaction.

[0332] L i : The rendering level of the UI element, which represents the visual hierarchical position of the UI element.

[0333] Calculation process:

[0334] There are three UI elements set up, and the interaction logic parameters and rendering levels of each element are as follows:

[0335] μ1=0.5,L1=100

[0336] μ2=1.0,L2=200

[0337] μ3=1.5,L3=300

[0338] Calculate U:

[0339] U=0.5·100+1.0·200+1.5·300=50+200+450=700

[0340] The calculation formula for batch-built 3D scene data is as follows:

[0341]

[0342] in:

[0343] S: Batch built 3D scene data, which means scene data that integrates real-time rendering data and UI interaction logic.

[0344] R j : Real-time rendering data, each data item represents the rendering result of a single part of the scene.

[0345] I j : UI interaction data, each data item represents the interaction performance or response data of the corresponding UI element. U: The optimized UI rendering level data obtained from the previous step.

[0346] Calculation process:

[0347] There are two parts of data, and the real-time rendering and interaction data of each part are as follows:

[0348] R1=100,I1=2

[0349] R2=150,I2=3

[0350] Using U=700 (calculated in the previous step), calculate:

[0351] S = 100·2·700+150·3·700=140000+315000=455000Calculation formula for real-time rendering results:

[0352]

[0353] in:

[0354] F: Real-time rendering result, which means the rendering output of all 3D scene data.

[0355] S k : Batch built 3D scene data, each data item represents a part of the scene.

[0356] Calculation process:

[0357] Set S to S=455000 from the previous step, and this is the only scene data:

[0358] F=455000

[0359] The calculation formula for interactive integrated data is:

[0360]

[0361] in:

[0362] XM: Interaction integration data, which represents the comprehensive response data after the combination of UI and real-time rendering results. ψ1: Integration weight, which adjusts the influence of real-time rendering results and UI interaction data in the integration process. F: Real-time rendering results.

[0363] I1: UI interaction data, setting only one key interaction data.

[0364] Calculation process:

[0365] Set the integration weights ψ1=1, I1=2:

[0366] XM = 1 455000 2 = 910000

[0367] The above embodiments are only preferred technical solutions of the present invention and should not be regarded as limiting the present invention. The protection scope of the present invention shall be the technical solutions recorded in the claims, including equivalent replacement solutions of the technical features in the technical solutions recorded in the claims. That is, equivalent replacement improvements within this scope are also within the protection scope of the present invention.

Claims

1. A high-performance real-time construction and rendering method of three-dimensional scenes based on a Web terminal, characterized in that: It includes the following steps: Step 1: Quadtree block division: Based on the quadtree structure, the 3D scene data is divided into multiple blocks according to differentiated accuracy, the distance parameter of the viewpoint of the monitor is called, sorted according to the distance, the rendering details of multiple blocks are dynamically adjusted, and multiple blocks are traversed to verify the accuracy requirements to generate hierarchical block data; Step 2: Browser embedded rendering: Use NPAPI plug-in technology to embed the OpenSceneGraph rendering engine into the Web browser, call the browser interface for global initialization, load the hierarchical block data, call the model of corresponding accuracy according to the viewpoint position, gradually load each model node, and establish an embedded rendering model; Step 3: Rendering of scene tree nodes: During the rendering process of each frame, traverse the scene tree nodes, remove nodes outside the viewport, render the cropped nodes, call the paging database function to load the model nodes, traverse and render multiple nodes in sequence, use the embedded rendering model to complete the rendering, and generate real-time rendering data; Step 4: Interaction optimization and integration: Optimize the interaction mechanism between UI and 3D scenes, call the rendering level and interaction logic parameters of UI elements, combine real-time rendering data with UI interaction data, build and render batch 3D scenes in real time, and generate interactive integration data.

2. According to claim 1, a high-performance real-time construction and rendering method of a three-dimensional scene based on a Web terminal is characterized in that: The step 1 includes the following sub-steps: quadtree segmentation of the three-dimensional scene; assigning three-dimensional coordinates to the nodes; Calculate the distance from the node to the viewpoint; generate a distance list; Sort the distance list and adjust the sorting weight; generate a sorted block list; calculate the rendering details of each block and generate specific rendering details; dynamically adjust the rendering detail list.

3. According to claim 2, a high-performance real-time construction and rendering method of a three-dimensional scene based on a Web terminal is characterized in that: The step 1 is specifically The process includes: The quadtree data structure is used to recursively segment the three-dimensional scene, assign three-dimensional coordinates to each node, and calculate the Euclidean distance d from each block node to the monitor's viewpoint. i , using the formula: Generate distance list D list ; Among them, x i ,y i , z i Represents the coordinates of the block, x v ,y v , z v represents the coordinates of the viewpoint of the monitor, d i is the distance from the node to the viewpoint, D list is the distance list of all blocks; Right D list Sort the distance data in, adjust the sorting weight and distance factor, and use the formula: Generate a sorted block list S sorted ; Among them, k a is the attenuation coefficient, adjusts the distance sensitivity, d0 is the reference distance, c is the offset constant, R i is the rendering priority of the block, S sorted is the sorted block list; According to S sorted and R i Calculate the rendering detail level of each block using the formula: Generate rendering details D for each block details , where: D i The rendering detail level for each block, D details is the list of dynamically adjusted block rendering details, α is the scale factor, which amplifies the influence of sorting weight, β g is the normalization constant, avoiding R i Too low D i Close to zero, γ a Adjust R i The nonlinear effect of Traverse the adjusted multi-block rendering detail list D details , verify whether the rendering details of each block meet the accuracy requirements and generate hierarchical block data.

4. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 1, characterized in that: The step 2 includes the following sub-steps: configuring the plug-in; Set basic parameters; Calculate the configuration sum and generate parameter sets; perform logic checks; Calculate the check value and generate the check result; Global initialization; Determine the level of execution; completion status; Load hierarchical block data; Select the model progress and directly build a low-precision model; verify the viewpoint position; modify the model accuracy; calculate the loading sequence; load the model nodes step by step; and build a rendering model.

5. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 4, characterized in that: In step 2, the steps of calling the browser interface to perform global initialization are specifically as follows: Configure the NPAPI plug-in to interface with the Web browser and set basic parameters using the formula: C=β·(ω1·P1+ω2·P2+ω3·P3+ω4·P4) Generate initialization configuration set P set ; Among them, C represents the total configuration, β represents the adjustment coefficient, ω1, ω2, ω3, ω4 are the weights of multiple parameters, P1, P2, P3, P4 represent the initialization parameters, P set Represents a parameter configuration set; Initialize the configuration set P set Perform logic check using the formula: Calculate the check value V and generate the logic check result R; Among them, V represents the check value, k b represents the sensitivity coefficient, T represents the threshold value, and R represents the verification result; Based on the logic check result R, perform global initialization using the formula: I=a b ·V 2 / (γ+V) Determine the initialization execution level I and obtain the global initialization completion status S init ; Among them, I represents the initialization execution level, α b represents the execution weight, γ represents the regularization constant, S init Represents the initialization state.

6. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 4, characterized in that: In step 2, the steps of acquiring the embedded rendering model are specifically as follows: Load the hierarchical block data and integrate the data using the weighted sum formula: Generate the integrated block dataset D total ; Among them, D represents integrated data, L i Presentation layer data, ω i Representation layer weights; Select a model with appropriate accuracy according to the viewpoint position, and use the formula to calculate the model loading sequence: Get the model loading sequence M seq ; Among them, M represents the model sequence, S j is the model accuracy, φ j is the position weight, σ is a constant; Load each model node step by step, using the cascade loading formula: Building an embedded rendering model model ; Where N represents the total node load, which is the weighted sum of all model nodes, the adjusted total load, δ represents the loading rate, which is an adjustment factor used to control the loading speed or the overall intensity of the loading, and ψ k Represents the node weight, each model node M k There is a corresponding weight, which determines the contribution ratio of the node in the total load. k Represents a model node, which is a single node in the embedded rendering model. b Represents model node k c The total number of Indicates the sum of all model nodes.

7. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 1, characterized in that: The step 3 comprises the following sub-steps: Traverse the scene tree nodes; identify the valid nodes in the viewport; Rendering and cropping; loading model nodes, calling embedded rendering models; generating loaded model data; performing final rendering; Generate real-time rendering data.

8. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 7, characterized in that: The specific process of step 3 is as follows: Traverse the scene tree nodes and identify the valid nodes in the viewport using the formula: Generate a valid node list R activei ; Among them, R active Represents a valid node list, v i Indicates the visibility of the node, a i Indicates the activation state of the node; Using the valid node list R active To perform node pruning, use the formula: Generate pruned node set C rendered ; Among them, C rendered represents the pruned node set, r j Indicates the importance of the node, γ j Indicates the node clipping coefficient; Using the pruned node set C rendered Calling embedded rendering model N model To load the model nodes, use the formula: Generate loaded model data L loaded ; Among them, L loaded represents the loaded model data, that is, the final loading result of the calculated model after clipping and weight adjustment, δ represents the loading rate, which is used as a coefficient to adjust the speed or total amount of the entire loading process, ξ k Represents the node loading weight, which determines the relative importance of each node in the pruned node set during the loading process. model (C rendered (k d )) represents the embedded rendering model N model In the example, according to the pruning node set C rendered The kth d nodes to load, p d Represents the pruning node set C rendered The total number of nodes; Using the loaded model data L loaded To render the scene, use the formula: Generate real-time rendering data F realtime ; Among them, F realtime represents real-time rendering data, θ represents rendering efficiency, and ψ q Represents the rendering weight.

9. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 1, characterized in that: The step 4 comprises the following sub-steps: Optimize UI interaction mechanism; Generate UI rendering layer data; combine with real-time rendering data to build 3D scenes in batches; Generate three-dimensional scene data; Real-time rendering of 3D scenes; Generate real-time rendering results; Combined with UI interaction data; Generate interactive integration data.

10. The method for real-time construction and rendering of a high-performance three-dimensional scene based on a Web terminal according to claim 9, characterized in that: The step 4 specifically includes the following process: Optimize the interaction mechanism between UI and 3D scene, call the rendering level and interaction logic parameters of UI elements, and use the formula: Generate optimized UI rendering level data U; Among them, U represents the optimized UI rendering level data, μ i Represents the interactive logic parameters of UI elements, L i Represents the rendering level of the UI element; Combine the real-time rendering data R with the optimized UI rendering level data U to build batch 3D scenes using the formula: Generate batch-built 3D scene data S; Among them, S represents the batch-built 3D scene data, R j Represents real-time rendering data, I j Represents UI interaction data, and U represents optimized UI rendering level data; The batch-built 3D scene data S is rendered in real time using the formula: Generate real-time rendering result F; Among them, F represents the real-time rendering result, which is the sum of all batch-built 3D scene data, S k Represents the kth of the batch-built 3D scene data g scenes, these scene data are accumulated to generate the overall rendering output, p g Represents the total number of scene data, that is, the sum in the formula is for all k g From 1 to p g Accumulate the three-dimensional scene data; Combine the real-time rendering result F with the UI interaction data I, using the formula: Generate interactive integrated data XM; Among them, ψ l represents the integration weight, F represents the real-time rendering result, I l Represents UI interaction data.

Images