A three-dimensional browser model navigation visualization method, device, equipment and medium

Abstract

The embodiments of this specification disclose a three-dimensional browser model navigation visualization method, device, equipment and medium, including: obtaining parameter information of a three-dimensional browser model; creating a cube model navigation box according to the parameter information, the cube model navigation box including six planes, each plane of the cube model navigation box corresponding to the view of the three-dimensional browser model; when the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box is moved synchronously; when the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to the corresponding view.

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a three-dimensional browser model navigation visualization method, device, equipment and medium. Background Art

[0002] The lack of a sense of direction in three-dimensional space in three-dimensional browser models has always been a problem that has plagued users of three-dimensional browser model visualization. Three-dimensional browser model users can change the observation angle of the center point of the three-dimensional browser model 360 degrees by dragging the cursor. However, after changing the observation angle, users often cannot know the posture of the current model in three-dimensional space and the angle from which they are observing the model.

[0003] Traditional 3D browser model space calibration technologies, such as the AxesHelper 3D coordinate system, are mainly aimed at the 3D scene construction process and developers, and are not suitable for being retained in the completed 3D browser model scene; and even if the 3D coordinate system is finally retained, it is difficult for users to intuitively understand the current 3D browser model's posture and perspective in space through the 3D coordinate system. Summary of the invention

[0004] One or more embodiments of the present specification provide a three-dimensional browser model navigation visualization method, device, equipment and medium for solving the technical problems raised by the background technology.

[0005] One or more embodiments of this specification adopt the following technical solutions:

[0006] One or more embodiments of this specification provide a three-dimensional browser model navigation visualization method, including:

[0007] Get parameter information of 3D browser model;

[0008] Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0009] When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously;

[0010] When the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to a corresponding view.

[0011] One or more embodiments of this specification provide a three-dimensional browser model navigation visualization device, the device comprising:

[0012] A parameter acquisition unit, which acquires parameter information of a three-dimensional browser model;

[0013] A navigation box creation unit is configured to create a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0014] A synchronous moving unit, which synchronously moves the observation angle of the cube model navigation box when the observation angle of the three-dimensional browser model moves;

[0015] The view switching unit switches the three-dimensional browser model to a corresponding view when converting the plane of the cube model navigation box.

[0016] One or more embodiments of this specification provide a 3D browser model navigation visualization device, including:

[0017] at least one processor; and,

[0018] a memory communicatively connected to the at least one processor; wherein,

[0019] The memory stores instructions executable by the at least one processor, the instructions being executed by the at least one processor to enable the at least one processor to:

[0020] Get parameter information of 3D browser model;

[0021] Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0022] When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously;

[0023] When the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to a corresponding view.

[0024] One or more embodiments of this specification provide a non-volatile computer storage medium storing computer executable instructions, wherein the computer executable instructions are configured to:

[0025] Get parameter information of 3D browser model;

[0026] Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0027] When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously;

[0028] When the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to a corresponding view.

[0029] At least one of the above technical solutions adopted in the embodiments of this specification can achieve the following beneficial effects:

[0030] The 3D browser model navigation visualization method of the embodiment of this specification fills the gap in the 3D browser model posture visualization navigation, enhances the model space sense of the 3D browser, improves the view usage efficiency of the 3D browser, and improves the user experience of the 3D browser. BRIEF DESCRIPTION OF THE DRAWINGS

[0031] In order to more clearly illustrate the technical solutions in the embodiments of this specification or the prior art, the following briefly introduces the drawings required for use in the embodiments or the prior art description. Obviously, the drawings described below are only some embodiments recorded in this specification. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative labor. In the drawings:

[0032] Figure 1 A flowchart of a three-dimensional browser model navigation visualization method provided for one or more embodiments of this specification;

[0033] Figure 2 A schematic diagram of the structure of a three-dimensional browser model navigation visualization device provided for one or more embodiments of this specification;

[0034] Figure 3 A schematic diagram of the structure of a three-dimensional browser model navigation visualization device provided in one or more embodiments of this specification. DETAILED DESCRIPTION

[0035] The embodiments of this specification provide a three-dimensional browser model navigation visualization method, device, equipment and medium.

[0036] In order to enable those skilled in the art to better understand the technical solutions in this specification, the technical solutions in the embodiments of this specification will be clearly and completely described below in conjunction with the drawings in the embodiments of this specification. Obviously, the described embodiments are only part of the embodiments of this specification, not all of the embodiments. Based on the embodiments of this specification, all other embodiments obtained by ordinary technicians in this field without creative work should fall within the scope of protection of this specification.

[0037] Figure 1A flowchart of a 3D browser model navigation visualization method provided in one or more embodiments of this specification, which can be executed by a 3D browser model navigation visualization system. Certain input parameters or intermediate results in the process allow manual intervention and adjustment to help improve accuracy.

[0038] The method steps of the embodiment of this specification are as follows:

[0039] S102: Obtain parameter information of the 3D browser model.

[0040] In the embodiment of the present specification, the parameter information of the three-dimensional browser model may be parameter information related to the three-dimensional browser model, and an associated cube model navigation box may be subsequently created according to the parameter information.

[0041] S104: Create a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model.

[0042] In an embodiment of the present specification, the visualization scene corresponding to the cube model navigation box can be determined according to the parameter information, and the visualization scene can be located at a specified position of the three-dimensional browser model. For example, the visualization scene can be located in the upper right corner of the three-dimensional browser model; then, six view surface material maps can be imported into the visualization scene, and a specified function can be called to generate six square planes; finally, the positions and rotation angles of the six square planes can be adjusted to generate the cube model navigation box.

[0043] In an embodiment of the present specification, when generating the cube model navigation box, the navigation box parameters of the visualization scene can be first created according to the parameter information of the three-dimensional browser model, and the navigation box parameters can include a three-dimensional scene, an orthographic projection camera, a camera track controller and a WebGL renderer; the cube model navigation box can be generated according to the navigation box parameters.

[0044] S106, when the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously.

[0045] In the embodiments of the present specification, in order to make the observation angle of the visualized scene change synchronously with the observation angle of the scene corresponding to the three-dimensional browser model, the domElement of the camera orbit controller (OrbitControls) in the navigation box parameters can be set to the domElement of the three-dimensional browser model, rather than the floating area of ​​the visualized scene itself, so as to achieve the effect of dragging the observation angle of the visualized scene to change synchronously with the observation angle of the scene corresponding to the three-dimensional browser model, and then the model posture in the three-dimensional browser model can be intuitively understood by directly observing the posture of the cube model navigation box.

[0046] Furthermore, the embodiments of this specification can disable the enablePan and enableZoom properties of the camera track controller in the cube model navigation box, prohibit the right-click dragging of the mouse to translate the cube model navigation box, and prohibit the mouse wheel from scrolling and zooming the cube model navigation box, so as to achieve a better model navigation effect.

[0047] S108, when converting the plane of the cube model navigation box, switching the three-dimensional browser model to a corresponding view.

[0048] In the embodiment of the present specification, when converting the plane of the cube model navigation box, newTHREE.Raycaster() may be called to create a ray for the visualization scene, so as to perform mouse picking to determine that the mouse clicks on the plane where the cube model navigation box is located.

[0049] In the embodiment of the present specification, new THREE.Raycaster() is called to create a ray for the visualization scene, so as to perform mouse picking to determine the plane where the mouse is clicked on the cube model navigation box. Specifically, the addEventListener function of the visualization scene domElement can be called to bind the left mouse button click event of the visualization scene; the intersectObjects method of Raycaster is called in the left mouse button click event, and if the result array returned by the intersectObjects method is not empty, the plane where the cube model navigation box that was clicked is located is determined by comparing the first element of the result array with the name of the view surface Mesh.

[0050] Furthermore, in the embodiment of the present specification, before calling the intersectObjects method of Raycaster in the left mouse button click event, the incoming mouse event can be set as event, the width and height of the visual scene domElement can be set as clientWidth and clientHeight respectively, the mouse coordinates passed in by the intersectObjects method can be set as mouse, and the camera instance of the visual scene can be set as camera.

[0051] mouse.x=(event.layerX / clientWidth)*2-1

[0052] mouse.y=-(event.layerY / clientHeight)*2+1

[0053] Convert the mouse position to a range of values ​​from left to right horizontally and from bottom to top vertically, normalized in the interval [-1,1], and call the setFromCamera(mouse,camera) method of Raycaster to direct the ray to the direction of the mouse click;

[0054] The length, width and height of the circumscribed cuboid of the three-dimensional browser model are set to dx, dy and dz respectively, and the size of the three-dimensional browser model is set to objectSize, where objectSize=Math.sqrt(Math.pow(dx, 2)+Math.pow(dy, 2)+Math.pow(dz, 2)).

[0055] In order to achieve the above-mentioned visualization navigation of the 3D browser model posture and basic view, the embodiment of this specification can establish a visualization scene in the upper right corner of the 3D browser model, generate a cube model navigation box in the visualization scene, and the six faces of the navigation box can be labeled Front, Back, Left, Right, Top, and Bottom in the order of orientation. The user drags and moves the observation angle of the 3D browser in the scene of the 3D browser model, and the observation angle in the visualization scene changes synchronously; the user clicks on the six orientation faces of the cube model navigation box, and the scene of the 3D browser model and the visualization scene are switched to the main view, back view, left view, right view, top view, and bottom view respectively.

[0056] The detailed technical solutions of the embodiments of this specification are as follows:

[0057] You can import six MeshBasicMaterial surface material maps, Front, Back, Left, Right, Top, and Bottom, in the visualization scene, and call new PlaneGeometry() and new THREE.Mesh() to generate six square planes with a side length of 150.

[0058] Adjust the position and rotation angle of the six square planes to form a cubic navigation box with the center point at zero: for the Front view, set the position property of its Mesh to (0,0,75); for the Back view, set the rotation.x property of its Mesh to Math.PI, the rotation.z property to Math.PI, and the position property to (0,0,-75); for the Left view, set the rotation.y property of its Mesh to -Math.PI / 2, and the position property to (-75,0,0); for the Right view, set the rotation.y property of its Mesh to Math.PI / 2, and the position property to (75,0,0); for the Top view, set the rotation.x property of its Mesh to -Math.PI / 2, and the position property to (0,75,0); for the Bottom view, set the rotation.x property of its Mesh to Math.PI / 2, and the position property to (0,-75,0).

[0059] Call new THREE.Scene(), new THREE.OrthographicCamera(), newOrbitControls(), and new THREE.WebGLRenderer() to create a 3D scene, an orthographic camera, a camera orbit controller, and a WebGL renderer for the visualization scene. At the same time, in order to synchronize the observation angle of the visualization scene with the observation angle of the 3D browser model, the domElement parameter of the camera orbit controller (OrbitControls) in the visualization scene is set to the domElement of the 3D browser model, rather than the floating area of ​​the visualization scene itself, so as to achieve the effect of dragging the navigation angle of the 3D browser model to synchronize with the visualization scene, and then directly observe the posture of the cube model navigation box of the visualization scene to intuitively understand the model posture in the 3D browser.

[0060] In particular, disable the enablePan and enableZoom properties of the camera track controller in the visualization scene, prohibit the right-click drag to pan the visualization scene, and prohibit the mouse wheel to scroll and zoom the visualization scene, in order to achieve a better model navigation effect.

[0061] Call new THREE.Raycaster() to create a ray for the visualization scene for mouse picking to determine which view of the model navigation box the mouse clicked. Call the addEventListener function of the visualization scene domElement to bind the user's left mouse click event on the second scene, and call the intersectObjects method of Raycaster in the bound operation click event. If the result array returned by this method is not empty, the model navigation box view that the user clicked can be determined by comparing the first element of the result array with the name of the view Mesh. In particular, before calling the intersectObjects method, the two-dimensional coordinates of the mouse passed in need to be standardized. The incoming mouse event is recorded as event, the width and height of the visualization scene domElement are clientWidth and clientHeight respectively, the mouse coordinate THREE.Vector2 passed in by the intersectObjects method is mouse, and the camera instance of the visualization scene is camera.

[0062] mouse.x=(event.layerX / clientWidth)*2-1

[0063] mouse.y=-(event.layerY / clientHeight)*2+1

[0064] Convert the mouse position into a standardized value that is always in the interval [-1,1] from left to right horizontally and from bottom to top vertically, and then call the setFromCamera(mouse,camera) method of Raycaster to direct the ray to the direction of the mouse click.

[0065] The length, width and height of the circumscribed cuboid of the 3D browser model are dx, dy and dz respectively, and the size of the main 3D scene model is objectSize

[0066] objectSize=Math.sqrt(Math.pow(dx,2)+Math.pow(dy,2)+Math.pow(dz,2))

[0067] If the user clicks on the Front view of the cube model navigation box, by setting the position property of the OrthographicCamera camera of the 3D browser model scene to (0,0,objectSize*

[0068] Math.sqrt(2)), set the position property of the OrthographicCamera camera of the visualization scene to (0,0,300), and then set the observation perspective of the 3D browser model scene and the visualization scene to the main perspective. Other perspective methods are similar.

[0069] The embodiments of this specification aim at the technical problems that the existing 3D browser lacks visual orientation navigation and cannot know the model posture and spatial perspective. It can provide a 3D browser model navigation visualization method and device based on WEBGL, and realize the visual navigation of the 3D browser model posture and basic view. The 3D browser model navigation visualization method based on WEBGL fills the gap in the visual navigation of the 3D browser model posture, enhances the model space sense of the 3D browser, improves the view usage efficiency of the 3D browser, and improves the user experience of the 3D browser.

[0070] Figure 2 The present invention is a schematic diagram of the structure of a three-dimensional browser model navigation visualization device provided in one or more embodiments of the present specification. The device includes: a parameter acquisition unit 202, a navigation box creation unit 204, a synchronous movement unit 206 and a view switching unit 208.

[0071] A parameter acquisition unit 202 acquires parameter information of a 3D browser model;

[0072] A navigation box creation unit 204 is configured to create a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0073] A synchronous moving unit 206, which synchronously moves the observation angle of the cube model navigation box when the observation angle of the three-dimensional browser model moves;

[0074] The view switching unit 208 switches the three-dimensional browser model to a corresponding view when converting the plane of the cube model navigation box.

[0075] Figure 3 A schematic diagram of a structure of a 3D browser model navigation visualization device provided for one or more embodiments of this specification includes:

[0076] at least one processor; and,

[0077] a memory communicatively connected to the at least one processor; wherein,

[0078] The memory stores instructions executable by the at least one processor, the instructions being executed by the at least one processor to enable the at least one processor to:

[0079] Get parameter information of 3D browser model;

[0080] Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0081] When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously;

[0082] When the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to a corresponding view.

[0083] One or more embodiments of this specification provide a non-volatile computer storage medium storing computer executable instructions, wherein the computer executable instructions are configured to:

[0084] Get parameter information of 3D browser model;

[0085] Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model;

[0086] When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously;

[0087] When the plane of the cube model navigation box is converted, the three-dimensional browser model is switched to a corresponding view.

[0088] Each embodiment in this specification is described in a progressive manner, and the same or similar parts between the embodiments can be referred to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the device, equipment, and non-volatile computer storage medium embodiments, since they are basically similar to the method embodiments, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

[0089] The above is a description of a specific embodiment of the specification. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the embodiments and still achieve the desired results. In addition, the processes depicted in the drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0090] The above description is only one or more embodiments of this specification and is not intended to limit this specification. For those skilled in the art, one or more embodiments of this specification may have various changes and variations. Any modification, equivalent replacement, improvement, etc. made within the spirit and principle of one or more embodiments of this specification shall be included in the scope of the claims of this specification.

Claims

1. A three-dimensional browser model navigation visualization method, characterized in that: The method comprises: Get parameter information of 3D browser model; Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model; When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously; When converting the plane of the cube model navigation box, switching the three-dimensional browser model to a corresponding view; The step of creating a cube model navigation box according to the parameter information includes: Determine the visualization scene corresponding to the cube model navigation box according to the parameter information; Importing six view surface material maps into the visualization scene, and calling a specified function to generate six square planes; Adjust the positions and rotation angles of the six square planes to generate the cube model navigation box; The generating of the cube model navigation box comprises: Creating navigation box parameters of the visualization scene according to the parameter information, wherein the navigation box parameters include a three-dimensional scene, an orthographic projection camera, a camera track controller, and a WebGL renderer; Generate the cube model navigation box according to the navigation box parameters; The method further comprises: Set the domElement of the camera track controller in the navigation box parameters to the domElement of the three-dimensional browser model; The converting the plane of the cube model navigation box includes: Call new THREE.Raycaster() to create a ray for the visualization scene, so as to perform mouse picking to determine that the mouse click is the plane where the cube model navigation box is located; The calling of new THREE.Raycaster() creates a ray for the visualization scene to perform mouse picking to determine the position where the mouse clicks is the plane where the cube model navigation box is located, including: Calling the addEventListener function of the visualization scene domElement to bind the left mouse button click event of the visualization scene; In the left mouse button click event, the intersectObjects method of Raycaster is called. If the result array returned by the intersectObjects method is not empty, the plane of the clicked cube model navigation box is determined by comparing the first element of the result array with the name of the view surface Mesh.

2. The method according to claim 1, characterized in that Before calling the intersectObjects method of Raycaster in the left mouse button click event, the method further includes: The incoming mouse event is set as event, the width and height of the visualization scene domElement are set as clientWidth and clientHeight respectively, the mouse coordinates passed in by the intersectObjects method are set as mouse, and the camera instance of the visualization scene is set as camera. mouse.x=(event.layerX / clientWidth)*2-1 mouse.y=-(event.layerY / clientHeight)*2+1 Convert the mouse position to a range of values ​​from left to right horizontally and from bottom to top vertically, normalized in the interval [-1,1], and call the setFromCamera(mouse,camera) method of Raycaster to direct the ray to the direction of the mouse click; The length, width and height of the circumscribed cuboid of the three-dimensional browser model are set to dx, dy and dz respectively, and the size of the three-dimensional browser model is set to objectSize, where objectSize=Math.sqrt(Math.pow(dx, 2)+Math.pow(dy, 2)+Math.pow(dz, 2)).

3. A three-dimensional browser model navigation visualization device, characterized in that: The device comprises: A parameter acquisition unit, which acquires parameter information of a three-dimensional browser model; A navigation box creation unit is configured to create a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model; A synchronous moving unit, which synchronously moves the observation angle of the cube model navigation box when the observation angle of the three-dimensional browser model moves; A view switching unit, which switches the three-dimensional browser model to a corresponding view when converting the plane of the cube model navigation box; The step of creating a cube model navigation box according to the parameter information includes: Determine the visualization scene corresponding to the cube model navigation box according to the parameter information; Importing six view surface material maps into the visualization scene, and calling a specified function to generate six square planes; Adjust the positions and rotation angles of the six square planes to generate the cube model navigation box; The generating of the cube model navigation box comprises: Creating navigation box parameters of the visualization scene according to the parameter information, wherein the navigation box parameters include a three-dimensional scene, an orthographic projection camera, a camera track controller, and a WebGL renderer; Generate the cube model navigation box according to the navigation box parameters; The device is also used for: Set the domElement of the camera track controller in the navigation box parameters to the domElement of the three-dimensional browser model; The converting the plane of the cube model navigation box includes: Call new THREE.Raycaster() to create a ray for the visualization scene, so as to perform mouse picking to determine that the mouse click is the plane where the cube model navigation box is located; The calling of new THREE.Raycaster() creates a ray for the visualization scene to perform mouse picking to determine the position where the mouse clicks is the plane where the cube model navigation box is located, including: Calling the addEventListener function of the visualization scene domElement to bind the left mouse button click event of the visualization scene; In the left mouse button click event, the intersectObjects method of Raycaster is called. If the result array returned by the intersectObjects method is not empty, the plane of the clicked cube model navigation box is determined by comparing the first element of the result array with the name of the view surface Mesh.

4. A three-dimensional browser model navigation visualization device, characterized in that: include: at least one processor; as well as, a memory communicatively connected to the at least one processor; wherein, The memory stores instructions executable by the at least one processor, the instructions being executed by the at least one processor to enable the at least one processor to: Get parameter information of 3D browser model; Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model; When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously; When converting the plane of the cube model navigation box, switching the three-dimensional browser model to a corresponding view; The step of creating a cube model navigation box according to the parameter information includes: Determine the visualization scene corresponding to the cube model navigation box according to the parameter information; Importing six view surface material maps into the visualization scene, and calling a specified function to generate six square planes; Adjust the positions and rotation angles of the six square planes to generate the cube model navigation box; The generating of the cube model navigation box comprises: Creating navigation box parameters of the visualization scene according to the parameter information, wherein the navigation box parameters include a three-dimensional scene, an orthographic projection camera, a camera track controller, and a WebGL renderer; Generate the cube model navigation box according to the navigation box parameters; The device is also used for: Set the domElement of the camera track controller in the navigation box parameters to the domElement of the three-dimensional browser model; The converting the plane of the cube model navigation box includes: Call new THREE.Raycaster() to create a ray for the visualization scene, so as to perform mouse picking to determine that the mouse click is the plane where the cube model navigation box is located; The calling of new THREE.Raycaster() creates a ray for the visualization scene to perform mouse picking to determine the position where the mouse clicks is the plane where the cube model navigation box is located, including: Calling the addEventListener function of the visualization scene domElement to bind the left mouse button click event of the visualization scene; In the left mouse button click event, the intersectObjects method of Raycaster is called. If the result array returned by the intersectObjects method is not empty, the plane of the clicked cube model navigation box is determined by comparing the first element of the result array with the name of the view surface Mesh.

5. A non-volatile computer storage medium, characterized in that: A computer executable instruction is stored, wherein the computer executable instruction is configured to: Get parameter information of 3D browser model; Creating a cube model navigation box according to the parameter information, wherein the cube model navigation box includes six planes, and each plane of the cube model navigation box corresponds to a view of the three-dimensional browser model; When the observation angle of the three-dimensional browser model moves, the observation angle of the cube model navigation box moves synchronously; When converting the plane of the cube model navigation box, switching the three-dimensional browser model to a corresponding view; The step of creating a cube model navigation box according to the parameter information includes: Determine the visualization scene corresponding to the cube model navigation box according to the parameter information; Importing six view surface material maps into the visualization scene, and calling a specified function to generate six square planes; Adjust the positions and rotation angles of the six square planes to generate the cube model navigation box; The generating of the cube model navigation box comprises: Creating navigation box parameters of the visualization scene according to the parameter information, wherein the navigation box parameters include a three-dimensional scene, an orthographic projection camera, a camera track controller, and a WebGL renderer; Generate the cube model navigation box according to the navigation box parameters; Also used for: Set the domElement of the camera track controller in the navigation box parameters to the domElement of the three-dimensional browser model; The converting the plane of the cube model navigation box includes: Call new THREE.Raycaster() to create a ray for the visualization scene, so as to perform mouse picking to determine that the mouse click is the plane where the cube model navigation box is located; The calling of new THREE.Raycaster() creates a ray for the visualization scene to perform mouse picking to determine the position where the mouse clicks is the plane where the cube model navigation box is located, including: Calling the addEventListener function of the visualization scene domElement to bind the left mouse button click event of the visualization scene; In the left mouse button click event, the intersectObjects method of Raycaster is called. If the result array returned by the intersectObjects method is not empty, the plane of the clicked cube model navigation box is determined by comparing the first element of the result array with the name of the view surface Mesh.

Images