A Web3D model loading method, device and storage device

Abstract

The present invention discloses a Web3D model loading method, device and storage device, the method comprising the following steps: in the Web3D model loading stage, a material tree is established to store model materials; in the texture loading stage, a texture tree is established; in the Web3D model running stage, a rendering optimization unit is used to reduce the number of triggering renders and complete the model fast rendering; the device and storage device are used to implement the method. The invention has the beneficial effects of improving the Web3D model loading speed and running fluency.

Description

Technical Field

[0001] The present invention relates to the field of 3D model rendering, and in particular to a Web3D model loading method, device and storage device. Background Art

[0002] In web3D projects, with the development of webgl technology, browsers are increasingly supporting 3D projects. Many fields will use 3D projects to display products, such as clothing customization platforms, car shopping platforms, smart cities, VR systems, and so on.

[0003] However, since 3D models are generally more detailed and resource-intensive, they load slowly, and each time a 3D model scene is switched, the scene and 3D model need to be reloaded, which will call on the device's GPU resources. However, most office equipment or mobile devices have relatively low GPU performance, which can lead to a series of problems such as low frame rate and slow model loading, giving users a bad browsing experience when browsing products.

[0004] There are mainly two loading methods in the prior art.

[0005] Solution 1: Use the server to preload model data;

[0006] By preloading and caching the server, the model is constructed in advance for preprocessing to provide loading acceleration for the 3D model, so as to achieve rendering optimization. The existing technology is more dependent on network bandwidth. When loading for the first time, the 3D model needs to be downloaded and saved to the local cache.

[0007] The advantage of this solution is that the client is not subject to performance constraints and has low resource consumption.

[0008] The disadvantages are:

[0009] (1) Server configuration and performance requirements are higher, resulting in additional server resource burden;

[0010] (2) Problems caused by concurrency need to be solved. Currently, the maximum number of clients supported by cloud rendering platforms on the market does not exceed 5;

[0011] (3) The server-side loading 3D model system requires maintenance personnel;

[0012] (4) Due to the great influence of the network environment, the actual total loading time changes from the model rendering time burden to the model download burden, and the problem of long total rendering time still exists.

[0013] Solution 2: Optimize model loading method;

[0014] The specific plan is as follows:

[0015] (1) Reduce draw calls and process objects of the same material together. If they are of different materials, the textures can be merged into a large texture and then extracted using different coordinates. In the case of minor differences, vertex data can be used for storage.

[0016] (2) Use model LOD technology, that is, as the object gradually moves away from the camera, reduce the number of faces on the model to improve performance.

[0017] This solution is highly targeted and flexible, and can be processed according to specific scenarios. The disadvantage is that it is not universal, and it is difficult to control a single model object that needs to be manipulated. The texture itself is huge, and multiple textures can reach a size of several hundred MB after being merged. When loading for the first time, it will make the loading speed of the merged texture slower. Summary of the invention

[0018] In order to improve the rendering speed and fluency of Web3D models, the present invention proposes a Web3D model loading method, device and storage device, wherein the method specifically includes the following steps:

[0019] S101: During the Web3D model loading phase, a material tree is established to store model materials;

[0020] S102: In the texture loading stage, a texture tree is established;

[0021] S103: During the Web3D model running phase, a rendering optimization unit is used to reduce the number of render triggers and complete fast model rendering.

[0022] A storage device stores instructions and data for implementing a Web3D model loading method.

[0023] A Web3D model loading device comprises: a processor and the storage device; the processor loads and executes instructions and data in the storage device to implement a Web3D model loading method.

[0024] The beneficial effect provided by the present invention is: improving the loading speed and running fluency of the Web3D model. BRIEF DESCRIPTION OF THE DRAWINGS

[0025] Figure 1 It is a schematic flow chart of the method of the present invention;

[0026] Figure 2 It is a detailed flow chart of the model loading phase;

[0027] Figure 3 This is a detailed flow chart of the texture loading phase;

[0028] Figure 4 It is a schematic diagram of the working of the hardware device of an embodiment of the present invention. DETAILED DESCRIPTION

[0029] To make the objectives, technical solutions and advantages of the present invention more clear, the embodiments of the present invention will be further described below with reference to the accompanying drawings.

[0030] Please refer to Figure 1 , Figure 1 It is a schematic flow chart of the method of the present invention.

[0031] The present invention provides a Web3D model loading method, device and storage device, the method comprising the following steps:

[0032] S1: During the Web3D model loading phase, a material tree is created to store model materials;

[0033] Please refer to Figure 2 , Figure 2 It is a detailed flow chart of the model loading phase;

[0034] Step S1 is specifically as follows:

[0035] S11, in the Web3D model loading stage, after being parsed by the corresponding model type loader, the model information with material is obtained;

[0036] S12, combining the materials into a material tree, and establishing an index of the materials in the corresponding model and the material tree;

[0037] S13. Store the index of the model and the corresponding material in the local cache.

[0038] Before loading a model each time, check whether the model has been loaded from the local cache. If the model already exists, get the corresponding material from the local cache using the corresponding material index and combine them into a model containing material information; otherwise, complete the storage of the new model through steps S11 to S13.

[0039] S2: In the texture loading stage, a texture tree is established;

[0040] Please refer to Figure 3 , Figure 3 This is a detailed flow chart of the texture loading phase;

[0041] Step S2 is specifically as follows:

[0042] S21. For a Web3D model that needs to load texture, use a TextureLoader texture loader object to load the texture;

[0043] S22. Store the texture information in a local cache to form a texture tree.

[0044] Before the Web3D model loads an additional texture each time, the corresponding texture information is searched in the texture tree. If the texture exists, it is directly called. Otherwise, the corresponding texture information is loaded and stored in the texture tree through steps S21 to S22.

[0045] S3: During the Web3D model running phase, the rendering optimization unit is used to reduce the number of render triggers and complete the model rendering quickly.

[0046] Step S3 is as follows:

[0047] S31, during the Web3D model running phase, determine whether the rendering optimization conditions are met, if so, proceed to step S34; otherwise, proceed to step S32;

[0048] The rendering optimization conditions are as follows:

[0049] Collect device performance data and model rendering frame rate history data. If the device performance data reaches the preset value or the model rendering history data reaches the preset value, the device performance or model itself is considered good and no optimization is needed. For example, if the model rendering frame rate is below 20, the optimization method is enabled to avoid additional performance consumption. Of course, other corresponding optimization conditions can also be set.

[0050] S32, determine whether the scene loaded by the model is customized, if so, select the corresponding scene and go to step S33; otherwise, go to step S34; the scenes loaded by the model include: model operation, model movement and model display;

[0051] S33, Web3D model actions trigger render, and render optimization is completed through the renderChangeListen function;

[0052] In step S33, the renderChangeListen function is used to transmit the names of actions that need to be blocked in different model loading scenarios, so that the operation that originally triggered the render is no longer triggered, and multiple render operations triggered in a short period of time are shielded through the anti-shake module.

[0053] As an embodiment, in the present application, in the model operation scene, camera calls such as camera, OrbitControls, etc. are disabled; in the model motion scene, mouse operations such as mousedown, mouseup, mouseon, mousemove, etc. are disabled.

[0054] In the model display scene, disable scene.add / remove, camera, OrbitControls, w / a / s / d / up / down / left / right arrow and other related operations.

[0055] The above scenarios include but are not limited to specific actions. In principle, the action list includes all actions that can trigger render. The action list is expandable and the scenarios can be maintained, added and modified.

[0056] It should also be noted that the present invention uses an anti-shake function method to control the transmission action to avoid a large number of renderings in a short period of time, which may cause a drop in the frame rate and a freeze in the 3D model loading.

[0057] S34. Complete rendering.

[0058] As an embodiment, the rendering optimization unit calling method in the present invention is as follows:

[0059] Import "renderChangeListen" from "threeChangeProject"

[0060] renderListen({scene:””,renShow:[]});

[0061] The operation data is as follows: ['mousedown',.......]

[0062] The operation method array is as follows: [

[0064] {

[0065] Name:'mousedown',

[0066] Fucn:'mousedown'

[0067] }, ...... ]

[0070] Scene: string type, you can pass parameters when you need to use the built-in scene, the default value is "3", which are "1" for scene one, "2" for scene one, and "3" for scene one

[0071] renShow: array type, you need to pass the array of names that need to be optimized. For example, if you need to listen for mouse clicks, use ['mousedown'];

[0072] An anti-shake function is added to renderChangeListen to monitor the operations to be performed, avoiding excessive rendering caused by a large number of operations in a short period of time.

[0073] The debounce function is function debounce(fn, delay, isImmediate); fn represents the execution function, delay represents the set time interval, isImmediate is true, and debounce will call this function immediately at the beginning of the delay time interval.

[0074] See also Figure 4 , Figure 4 40 is a schematic diagram of the working of the hardware device of an embodiment of the present invention, wherein the hardware device specifically comprises: a Web3D model loading device 401, a processor 402 and a storage device 403.

[0075] A Web3D model loading device 401: The Web3D model loading device 401 implements the Web3D model loading method.

[0076] Processor 402: The processor 402 loads and executes the instructions and data in the storage device 403 to implement the Web3D model loading method.

[0077] Storage device 403: The storage device 403 stores instructions and data; the storage device 403 is used to implement the Web3D model loading method.

[0078] The beneficial effects of the present invention are:

[0079] 1. During the web3D loading stage, the loading speed is optimized, based on the time it takes for users to see the complete effect, to reduce waiting time.

[0080] 2. During the web3D model operation phase, the frame rate of the model displayed by the browser is increased, so that the problems of blurred images when used by users, freezes during movement, and other frame rate drops are improved to a certain extent. When users operate model objects, the frame rate is increased, and there is no obvious drop. The frame rate is stable, and the freeze problem is effectively improved.

[0081] The above description is only a preferred embodiment of the present invention and is not intended to limit the present invention. Any modifications, equivalent substitutions, improvements, etc. made within the spirit and principle of the present invention should be included in the protection scope of the present invention.

Claims

1. A Web3D model loading method, characterized by: The following steps are involved: S1: During the Web3D model loading phase, a material tree is created to store model materials. Step S1 is as follows: S11, in the Web3D model loading stage, after being parsed by the corresponding model type loader, the model information with material is obtained; S12, combining the materials into a material tree, and establishing an index of the materials in the corresponding model and the material tree; S13, storing the index of the model and the corresponding material in the local cache; Before loading a model each time, check whether the model has been cached in the local cache. If the model has been cached, search the corresponding material in the material tree according to the corresponding material index to combine into a model containing material information; otherwise, complete the storage of the new model through steps S11 to S13; S2: In the texture loading stage, a texture tree is established; the specific steps of step S2 are as follows: S21. For a Web3D model that needs to load texture, use a TextureLoader texture loader object to load the texture; S22, storing the texture information in a local cache to form a texture tree; Before each additional texture is loaded, the Web3D model searches for the corresponding texture information in the texture tree. If the texture exists, it is directly called. Otherwise, the corresponding texture information is loaded and stored in the texture tree through steps S21 to S22. S3: During the Web3D model running phase, the rendering optimization unit is used to reduce the number of render triggers and complete the model fast rendering; step S3 is as follows: S31, during the Web3D model running phase, determine whether the rendering optimization conditions are met, if so, proceed to step S34; otherwise, proceed to step S32; S32, determine whether the scene loaded by the model is customized, if so, select the corresponding scene and enter step S33; Otherwise, proceed to step S34; Model loading scenarios include: model operation, model movement and model display; S33, Web3D model actions trigger render, and render optimization is completed through the renderChangeListen function; In step S33, the renderChangeListen function is used to transmit the names of actions that need to be blocked in different model loading scenarios, so that the operation that originally triggered the render is no longer triggered, and the multiple render operations triggered in a short period of time are shielded by the anti-shake module; S34. Complete rendering.

2. A Web3D model loading method as claimed in claim 1, characterized in that: The rendering optimization conditions are as follows: Collect device performance data and historical data of model rendering frame numbers. If the device performance data reaches the preset value or the historical data of model rendering reaches the preset value, it is considered that the device performance or the model itself is good and does not need to be optimized.

3. A storage device, characterized in that: The storage device stores instructions and data for implementing a Web3D model loading method as described in any one of claims 1 to 2.

4. A Web3D model loading device, characterized in that: include: A processor and a storage device; the processor loads and executes instructions and data in the storage device to implement a Web3D model loading method as described in any one of claims 1 to 2.

Images