Webgl visual domain tile elimination method, device, computer equipment and storage medium
By using the view frustum and quadtree algorithms to filter tile information, the problems of poor rendering effect and high development difficulty of WEBGL engine in GIS map development are solved, achieving efficient rendering and interaction, and reducing the development threshold.
Patent Information
- Application Number
- CN202210731969.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-06-26
- Publication Date
- 2025-11-18
- Estimated Expiration
- 2042-06-26
AI Technical Summary
Existing WEBGL engines suffer from poor rendering effects, high development thresholds, insufficient performance, and compatibility issues in GIS map development, making it difficult to achieve efficient rendering and interaction when combining GIS and rendering engines.
By calculating the tiles within the visible area, the tile information inside the view frustum is filtered out using the view frustum and quadtree algorithms and stored in the data storage, simplifying the tile calculation process and reducing the difficulty of GIS map development.
It enables efficient rendering and interaction of the WEBGL engine in GIS map development, lowers the development threshold, and allows general rendering engine practitioners to easily develop GIS map components, improving rendering effects and performance.
Smart Images

Figure CN115294252B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to WEBGL, and more specifically to WEBGL view area tile removal methods, apparatus, computer equipment, and storage media. Background Technology
[0002] Generally, WebGL (3D graphics protocol, Web Graphics Library) engines such as Babylon.js, Three.js, and PlayCanvas focus on rendering and functionality, with relatively weak capabilities in GIS (Geographic Information System). Specialized WebGL-based GIS engines, such as Mapbox and Cesium, primarily focus on data processing, resulting in less than satisfactory rendering effects. While both types of engines can perform layer overlay to some extent, compatibility issues always exist when integrating them, causing significant challenges for GIS or WebGL professionals specializing in interactive rendering. In actual project development, the complex tile calculations within the screen space of GIS engines require converting the screen space into a geographic extent, and then into tile numbers. Different calculation methods lead to varying degrees of accuracy loss. For example, most mainstream GIS engines control the horizontal angle of 3D map tile calculations to 89 degrees or lower. Many WebGL developers struggle to understand these complex calculations, making it difficult for developers familiar with rendering but lacking specialized GIS knowledge to implement GIS maps. GIS professionals have limited knowledge of physically based rendering engines, with most focusing on data processing and large-scale data optimization. As a result, the rendering effects of GIS engines generally cannot compare with those of WEBGL engines, which are dedicated to rendering, making it difficult for the projects they develop to match the performance of these engines.
[0003] To address the aforementioned issues, the current approach typically involves using a GIS engine such as Mapbox or Cesium to build the main scene, and then overlaying a canvas layer on top of it using a WEBGL engine focused on rendering to render detailed models. However, this approach not only fails to guarantee performance but also makes the entire project overly cumbersome. Developers must learn two types of engines to manage the project, resulting in high personnel costs, long development cycles, and tedious and difficult-to-maintain projects.
[0004] Therefore, it is necessary to design a new method that allows the WEBGL rendering engine to obtain the tile information inside the view frustum through simple calculations, thereby lowering the threshold for GIS map development. Summary of the Invention
[0005] The purpose of this invention is to overcome the shortcomings of the prior art and provide a method, apparatus, computer equipment and storage medium for WEBGL view area tile removal.
[0006] To achieve the above objectives, the present invention adopts the following technical solution: a WEBGL viewport tile culling method, comprising:
[0007] Calculate the tiles of the root node within the visible area and obtain all tile data sources;
[0008] Iterate through all tile data sources and obtain the current level of each tile data source to get the level data;
[0009] Deduplicat the data at the aforementioned levels;
[0010] Create a data storage device and store the tile data source corresponding to each level of data;
[0011] Remove the root nodes within the visible area to obtain the removal results, and store the removal results in the first array;
[0012] Iterate through the tiles in the first array;
[0013] Determine whether all tiles in the first array have been traversed;
[0014] If the tiles in the first array have not been completely traversed, then determine whether the current tile level can be further subdivided;
[0015] If the current tile level can be further subdivided, then use a quadtree query to retrieve the four child tiles of the current tile;
[0016] Traverse the child tiles of the current tile;
[0017] Determine whether all child tiles of the current tile have been traversed;
[0018] If the sub-tiles of the current tile have not been traversed, then determine whether the sub-tile is inside the view frustum;
[0019] If the sub-tile is inside the view frustum, then the current sub-tile is stored in the first array;
[0020] Determine if the current tile needs to be stored;
[0021] If the current tile needs to be stored, the current tile is stored in the data memory according to the hierarchy, and the process of traversing the sub-tiles of the current tile is executed.
[0022] If all tiles in the first array have been traversed, then output all tile information corresponding to all tile data sources in the data storage.
[0023] The further technical solution is as follows: after determining whether the current tile level can be further subdivided, it also includes:
[0024] If the current tile level cannot be further subdivided, then the traversal of the tiles in the first array is performed.
[0025] A further technical solution is as follows: after determining whether the sub-tile is inside the viewing cone, the method further includes:
[0026] If the sub-tile is not inside the view frustum, then the process of traversing the sub-tiles of the current tile is performed.
[0027] The further technical solution is as follows: after determining whether the current tile needs to be stored, it also includes:
[0028] If the current tile does not need to be stored, then the process of traversing the sub-tiles of the current tile is performed.
[0029] The further technical solution is as follows: the calculation of the root node's tiles within the visible area and the acquisition of all tile data sources include:
[0030] Update the camera projection matrix;
[0031] Update the view frustum using the camera projection matrix;
[0032] Calculate the tiles of the root node within the visible area or set the spatial coordinates of the root node tiles to zero;
[0033] Retrieve all tile data sources.
[0034] The further technical solution is as follows: the deduplication of the hierarchical data includes:
[0035] The hierarchical data is deduplicated using a JavaScript Set object.
[0036] The further technical solution is as follows: determining whether the current tile needs to be stored includes:
[0037] Determine whether the data in the data storage exists in an array corresponding to the sub-tile level;
[0038] If the data in the data storage contains an array corresponding to the sub-tile level, then it is determined that the current tile needs to be stored;
[0039] If the data in the data storage does not contain an array corresponding to the sub-tile level, then it is determined that the current tile does not need to be stored.
[0040] The present invention also provides a WEBGL viewport tile removal device, comprising:
[0041] The tile calculation unit is used to calculate the tiles of the root node within the visible area and obtain all tile data sources;
[0042] The first traversal unit is used to traverse all tile data sources and obtain the current level of each tile data source to get the level data.
[0043] A deduplication unit is used to deduplicatize the hierarchical data.
[0044] The memory creation unit is used to create a data memory and store the tile data source corresponding to each level of data;
[0045] The culling unit is used to cull the root nodes in the visible area to obtain the culling result, and store the culling result in the first array;
[0046] The second traversal unit is used to traverse the tiles in the first array;
[0047] The first judgment unit is used to determine whether the tiles in the first array have been traversed.
[0048] The second judgment unit is used to determine whether the current tile level can be further subdivided if the tiles in the first array have not been completely traversed.
[0049] The query unit is used to retrieve the four sub-tiles of the current tile if the current tile level can be further subdivided using a quadtree query.
[0050] The third traversal unit is used to traverse the child tiles of the current tile;
[0051] The third judgment unit is used to determine whether the sub-tiles of the current tile have been traversed.
[0052] The fourth judgment unit is used to determine whether the sub-tile is inside the view frustum if the sub-tile of the current tile has not been traversed.
[0053] The first storage unit is used to store the current sub-tile into the first array if the sub-tile is inside the view frustum;
[0054] The fifth judgment unit is used to determine whether the current tile needs to be stored;
[0055] The second storage unit is used to store the current tile into the data memory in a hierarchical manner if the current tile needs to be stored, and to perform the traversal of the sub-tiles of the current tile.
[0056] The output unit is used to output all tile information of all tile data sources corresponding to the layer in the data storage if the tiles in the first array have been traversed.
[0057] The present invention also provides a computer device, the computer device including a memory and a processor, the memory storing a computer program, and the processor executing the computer program to implement the above-described method.
[0058] The present invention also provides a storage medium storing a computer program that, when executed by a processor, implements the above-described method.
[0059] The beneficial effects of this invention compared to existing technologies are as follows: This invention utilizes a view frustum to calculate tiles, traverses the tile data source, and when the current tile level can be subdivided, uses a quadtree query to obtain the four sub-tiles of the current tile. It then traverses all sub-tiles, filters out the sub-tiles inside the view frustum, stores them in a first array, and stores the tiles that need to be stored in a data storage device. When the tiles in the first array have been traversed, the relevant information of the sub-tiles in the first array is output. This allows the WEBGL rendering engine to obtain the tile information inside the view frustum through simple calculations, thus lowering the threshold for GIS map development.
[0060] The present invention will be further described below with reference to the accompanying drawings and specific embodiments. Attached Figure Description
[0061] To more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings used in the following description of the embodiments will be briefly introduced. Obviously, the drawings described below are some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0062] Figure 1 A schematic diagram illustrating an application scenario of the WEBGL viewport tile culling method provided in an embodiment of the present invention;
[0063] Figure 2 A schematic flowchart of the WEBGL viewport tile culling method provided in an embodiment of the present invention;
[0064] Figure 3 This is a schematic diagram of a sub-process of the WEBGL viewport tile culling method provided in an embodiment of the present invention;
[0065] Figure 4 This is a schematic diagram of a sub-process of the WEBGL viewport tile culling method provided in an embodiment of the present invention;
[0066] Figure 5 A schematic block diagram of the WEBGL view area tile removal device 300 provided in an embodiment of the present invention;
[0067] Figure 6This is a schematic block diagram of the tile calculation unit 301 of the WEBGL viewable tile removal device 300 provided in an embodiment of the present invention.
[0068] Figure 7 This is a schematic block diagram of the fifth judgment unit 314 of the WEBGL view area tile removal device 300 provided in an embodiment of the present invention;
[0069] Figure 8 A schematic block diagram of a computer device provided for an embodiment of the present invention. Detailed Implementation
[0070] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.
[0071] It should be understood that, when used in this specification and the appended claims, the terms "comprising" and "including" indicate the presence of the described features, integrals, steps, operations, elements and / or components, but do not exclude the presence or addition of one or more other features, integrals, steps, operations, elements, components and / or collections thereof.
[0072] It should also be understood that the terminology used in this specification is for the purpose of describing particular embodiments only and is not intended to limit the invention. As used in this specification and the appended claims, the singular forms “a,” “an,” and “the” are intended to include the plural forms unless the context clearly indicates otherwise.
[0073] It should also be further understood that the term "and / or" as used in this specification and the appended claims refers to any combination of one or more of the associated listed items and all possible combinations, and includes such combinations.
[0074] Please see Figure 1 and Figure 2 , Figure 1 This is a schematic diagram illustrating an application scenario of the WEBGL viewport tile culling method provided in this embodiment of the invention. Figure 2This is a schematic flowchart illustrating the WEBGL viewport tile culling method provided in this embodiment of the invention. This WEBGL viewport tile culling method is applied in a server. The server interacts with the terminal, combining camera frustum culling in the WEBGL rendering engine with quadtree traversal of the tile root nodes to obtain the tiles inside the camera frustum in the rendering engine. This enables the rendering engine to display GIS maps, reduces the difficulty of GIS tile calculation within the viewport, and eliminates the need to control the horizontal angle during tile calculation.
[0075] The server in this embodiment includes, but is not limited to, any WEBGL engine. For now, we will use the Three.js engine as the basis to build a basic 3D environment and set basic parameters such as camera position and rotation angle.
[0076] Figure 2 This is a flowchart illustrating the WEBGL viewport tile culling method provided in an embodiment of the present invention. Figure 2 As shown, the method includes the following steps S110 to S260.
[0077] S110. Calculate the tiles of the root node within the visible area and obtain all tile data sources.
[0078] In this embodiment, the WEBGL engine camera calculates the viewport matrix, updates the camera view frustum, and calculates the tiles of the root node contained within the current view frustum.
[0079] In one embodiment, please refer to Figure 3 The above-mentioned step S110 may include steps S111 to S114.
[0080] S111, Update the camera projection matrix;
[0081] S112. Update the view frustum using the camera projection matrix.
[0082] Prepare a tile server; you can build your own or use a tile service like Gaode or Tencent. Update the camera projection matrix, and then use the projection matrix to update the view frustum. The pseudocode is as follows:
[0083] updateFrustum(){
[0084] this.viewProjectionMatrix.multiplyMatrices(this.perspectiveCamera.projectionMatrix,this.perspectiveCamera.matrixWorldInverse);
[0085] this.frustum.setFromProjectionMatrix(this.viewProjectionMatrix);
[0086] }
[0087] S113. Calculate the tiles of the root node within the visible area or set the spatial coordinates of the root node tiles to zero.
[0088] In this embodiment, the current root node tile is set to zero, with horizontal coordinate 0, vertical coordinate 0, and level 0. Alternatively, the coordinates of the root node inside the current view frustum can be calculated using a custom function to achieve multiple tiled world maps when the level is 0. To better understand the tile culling principle, the root node is temporarily set to zero.
[0089] S114. Obtain all tile data sources.
[0090] The number of root node tiles inside the current view frustum can be obtained by calculation, or a zero node can be set as the root node inside the current view frustum and stored in an array-like object.
[0091] S120. Traverse all tile data sources and obtain the current level of each tile data source to get the level data.
[0092] In this embodiment, hierarchical data refers to the hierarchical level at which all tile data sources are currently located.
[0093] Specifically, this embodiment does not limit the number of tile data sources or the current state level of the data sources. There can be multiple current data sources, and the level of each data source does not have to be exactly the same. All tile data sources are traversed, and the current state level of all tile data sources is collected and stored in an array.
[0094] S130, Deduplicate the hierarchical data.
[0095] In this embodiment, the hierarchical data is deduplicated using a JavaScript Set object. This ensures that each obtained hierarchy is unique, optimizes tile removal performance, avoids repeated tile detection, and improves program execution speed.
[0096] S140. Create a data storage device and store the tile data source corresponding to each level of data.
[0097] In this embodiment, the data storage refers to a Map object, where the key value of the object is used as a hierarchy and the value value is used as an array. Each array is used to store the tile data source of the current hierarchy inside the view frustum.
[0098] S150. Remove the root node in the visible area to obtain the removal result, and store the removal result in the first array.
[0099] Specifically, the root node inside the calculated view frustum is selected, and the result is stored in the first array.
[0100] In this embodiment, it is determined whether the set zero point or the calculated root node is inside the view frustum. The root node inside the view frustum is selected and stored in an array, which is set as the first array B. The nodes stored in the first array B are the set of nodes that need to be traversed and that need to be removed by the view frustum.
[0101] We need to perform view frustum detection on the root node array to ensure that the root node must be inside the view frustum, and store the result in an array-like object, i.e., the first array B.
[0102] S160, Traverse the tiles in the first array.
[0103] In this embodiment, the node set in the first array B is traversed until all nodes in the first array B have been traversed. The nodes in the first array B are not only derived from the root node, but nodes that need to be traversed will be continuously added to the first array B during the subsequent calculation process.
[0104] Iterate through the root node tile data in the first array B. The root node data comes not only from the initial value, but also from the calculation results of the subsequent steps, ensuring that each root node needs to participate in the view frustum detection, and also ensuring that all data source levels participate in the view frustum detection.
[0105] S170. Determine whether the tiles in the first array have been traversed.
[0106] S180. If the tiles in the first array have not been completely traversed, determine whether the current tile level can be further subdivided.
[0107] In this embodiment, it is specifically determined whether the traversed tile can be further traversed and segmented using a quadtree. If the condition is met, the four sub-tiles of the current tile are obtained by querying the quadtree, and the data is subdivided and selected quickly. If the segmentation condition is not met, step S160 is executed.
[0108] Specifically, the current tile level, i.e. the node being traversed, is determined by comparing the current tile level with the deduplicated level data. If the current tile level is greater than all tiles in the deduplicated level data, then the current tile does not need to be further subdivided; otherwise, it needs to be subdivided.
[0109] If the current tile level cannot be further subdivided, then step S160 is executed.
[0110] S190. If the current tile level can be further subdivided, then use a quadtree query to obtain the four sub-tiles of the current tile.
[0111] Since the tiles at the current level in GIS are further subdivided into four sub-tiles at the next level, a quadtree is used here to find the four sub-tiles of the current tile.
[0112] S200, Traverse the child tiles of the current tile;
[0113] S210. Determine whether the child tiles of the current tile have been traversed.
[0114] Determine whether all four sub-tiles have been acquired and whether they have all participated in the frustum detection. If all sub-tiles have participated in the detection, return to continue executing step S160. If they have not been acquired and the detection is complete, loop through the process and continue executing.
[0115] S220. If the sub-tiles of the current tile have not been traversed, determine whether the sub-tiles are inside the view frustum.
[0116] If the sub-tile is not inside the view frustum, then step S200 is performed.
[0117] Specifically, the frustum detection is used to determine whether the obtained sub-tiles have been traversed. If the traversal is complete, the process returns to step S160 to continue traversing the root node. If the traversal is not complete, the process continues to traverse and executes step S230 to perform frustum detection.
[0118] S230. If the sub-tile is inside the view frustum, then store the current sub-tile in the first array.
[0119] In this embodiment, the method of frustum culling is used to detect whether the current child tile is inside the frustum. If the child tile is inside the frustum, the tile is stored in the first array B as the root node and the traversal continues. Step S240 is then executed. If the current tile is not inside the frustum, step S200 is returned and the child tiles obtained by traversing the quadtree are continued.
[0120] S240. Determine whether the current tile needs to be stored.
[0121] In this embodiment, it is determined whether the current sub-tile is a tile required by the data source. If it is a tile required by the current data source, it is stored in the data storage MapA. If it is not a tile required by the current data source, step S200 is continued to traverse the sub-tiles obtained by the quadtree.
[0122] In one embodiment, please refer to Figure 4 The above-mentioned step S240 may include steps S241 to S243.
[0123] S241. Determine whether there is an array corresponding to the sub-tile level in the data storage;
[0124] S242. If the data in the data storage exists in an array corresponding to the sub-tile level, then it is determined that the current tile needs to be stored.
[0125] S243. If the data in the data storage does not contain an array corresponding to the sub-tile level, then it is determined that the current tile does not need to be stored.
[0126] To determine whether a child tile needs to be stored in the set Map object, the criterion is to check if the Map object contains an array corresponding to the child tile level. If the Map object contains an array corresponding to the level, then the tile is stored in the Map object; otherwise, the tile does not need to be stored.
[0127] S250. If the current tile needs to be stored, the current tile is stored in the data storage according to the hierarchy, and step S200 is executed.
[0128] If the current tile does not need to be stored, then step S200 is executed.
[0129] S260. If the tiles in the first array have been traversed, output all tile information of all tile data sources corresponding to the layer in the data storage.
[0130] When the first array B has been completely traversed, an object MapA containing all collected tile data is returned. Object MapA stores the tile information corresponding to all data sources within the current visible range. In other words, it checks whether array B has been completely traversed. If it has, a Map object is returned, storing the tile information corresponding to the current layer of all data sources within the current view frustum. If it has not been completely traversed, array B continues to be traversed.
[0131] If the tiles in the first array have not been completely traversed, then step S160 is executed.
[0132] This embodiment significantly lowers the barrier to entry for developing GIS capabilities using mainstream rendering engines, enabling general rendering engine practitioners to easily develop map components without being limited to any particular GIS engine. GIS practitioners can also learn about rendering engines and use them to develop GIS components, greatly improving the rendering quality of GIS projects. This invention is not limited to any particular rendering engine; various types of rendering engines can use this embodiment to extend GIS capabilities. It solves the problem of tile loading within the visible area in WebGL, enabling high-performance loading of tile data within the visible area, improving tile loading speed, and significantly lowering the barrier to entry for integrating GIS map capabilities into popular WebGL frameworks such as Three.js and Babylon.js.
[0133] The aforementioned WEBGL viewable tile culling method calculates tiles using a view frustum, traverses the tile data source, and when the current tile level is subdividable, uses a quadtree query to obtain the four child tiles of the current tile. It then traverses all child tiles, filters out the child tiles inside the view frustum, stores them in a first array, and stores the tiles that need to be stored in a data storage device. When the tiles in the first array have been traversed, the relevant information of the child tiles in the first array is output. This allows the WEBGL rendering engine to obtain the tile information inside the view frustum through simple calculations, thus lowering the threshold for GIS map development.
[0134] Figure 5 This is a schematic block diagram of a WEBGL viewport tile removal device 300 provided in an embodiment of the present invention. Figure 5 As shown, corresponding to the above-described WEBGL viewport tile culling method, the present invention also provides a WEBGL viewport tile culling device 300. This WEBGL viewport tile culling device 300 includes a unit for performing the above-described WEBGL viewport tile culling method, and the device can be configured in a server. Specifically, please refer to... Figure 5 The WEBGL view area tile removal device 300 includes a tile calculation unit 301, a first traversal unit 302, a deduplication unit 303, a memory creation unit 304, a removal unit 305, a second traversal unit 306, a first judgment unit 307, a second judgment unit 308, a query unit 309, a third traversal unit 310, a third judgment unit 311, a fourth judgment unit 312, a first storage unit 313, a fifth judgment unit 314, a second storage unit 315, and an output unit 316.
[0135] The system includes a tile calculation unit 301 for calculating the tiles of the root node within the visible area and obtaining all tile data sources; a first traversal unit 302 for traversing all tile data sources and obtaining the current level of each tile data source to obtain the level data; a deduplication unit 303 for deduplicating the level data; a memory creation unit 304 for creating a data memory and storing the tile data sources corresponding to each level of data; a culling unit 305 for culling the root node within the visible area to obtain the culling result and storing the culling result in a first array; a second traversal unit 306 for traversing the tiles in the first array; a first judgment unit 307 for judging whether the tiles in the first array have been traversed completely; a second judgment unit 308 for judging whether the current tile level can be further subdivided if the tiles in the first array have not been traversed completely; and a query unit 309 for judging whether the current tile level can be further subdivided if the current tile level has not been subdivided completely. If the tile level can be further subdivided, a quadtree query is used to retrieve the four child tiles of the current tile; the third traversal unit 310 is used to traverse the child tiles of the current tile; the third judgment unit 311 is used to determine whether the child tiles of the current tile have been traversed; the fourth judgment unit 312 is used to determine whether the child tile is inside the view frustum if the child tiles of the current tile have not been traversed; the first storage unit 313 is used to store the current child tile in the first array if the child tile is inside the view frustum; the fifth judgment unit 314 is used to determine whether the current tile needs to be stored; the second storage unit 315 is used to store the current tile in the data memory according to the level if the current tile needs to be stored, and to execute the traversal of the child tiles of the current tile; the output unit 316 is used to output all tile information of the level corresponding to all tile data sources in the data memory if the tiles in the first array have been traversed.
[0136] In one embodiment, such as Figure 6 As shown, the tile calculation unit 301 includes a first update subunit 3011, a second update subunit 3012, a calculation subunit 3013, and a data source acquisition subunit 3014.
[0137] The first update subunit 3011 is used to update the camera projection matrix; the second update subunit 3012 is used to update the view frustum using the camera projection matrix; the calculation subunit 3013 is used to calculate the tile of the root node in the visible area or set the spatial coordinates of the root node tile to zero; the data source acquisition subunit 3014 is used to acquire all tile data sources.
[0138] In one embodiment, the deduplication unit 303 is used to deduplicatize the hierarchical data using a JavaScript Set object.
[0139] In one embodiment, such as Figure 7As shown, the fifth judgment unit 314 includes an array judgment subunit 3141, a first determination subunit 3142, and a second determination subunit 3143.
[0140] The array determination subunit 3141 is used to determine whether there is an array corresponding to the sub-tile level in the data storage; the first determination subunit 3142 is used to determine that the current tile needs to be stored if there is an array corresponding to the sub-tile level in the data storage; the second determination subunit 3143 is used to determine that the current tile does not need to be stored if there is no array corresponding to the sub-tile level in the data storage.
[0141] It should be noted that those skilled in the art can clearly understand that the specific implementation process of the WEBGL view area tile removal device 300 and each unit can be referred to the corresponding description in the foregoing method embodiments. For the sake of convenience and brevity, it will not be repeated here.
[0142] The aforementioned WEBGL viewport tile removal device 300 can be implemented as a computer program, which can, for example, Figure 8 It runs on the computer device shown.
[0143] Please see Figure 8 , Figure 8 This is a schematic block diagram of a computer device provided in an embodiment of this application. The computer device 500 can be a server, wherein the server can be a standalone server or a server cluster composed of multiple servers.
[0144] See Figure 8 The computer device 500 includes a processor 502, a memory, and a network interface 505 connected via a system bus 501. The memory may include a non-volatile storage medium 503 and internal memory 504.
[0145] The non-volatile storage medium 503 may store an operating system 5031 and a computer program 5032. The computer program 5032 includes program instructions that, when executed, cause the processor 502 to perform a WEBGL viewport tile culling method.
[0146] The processor 502 provides computing and control capabilities to support the operation of the entire computer device 500.
[0147] The internal memory 504 provides an environment for the execution of the computer program 5032 in the non-volatile storage medium 503. When the computer program 5032 is executed by the processor 502, the processor 502 can execute a WEBGL viewport tile culling method.
[0148] This network interface 505 is used for network communication with other devices. Those skilled in the art will understand that... Figure 8 The structure shown is merely a block diagram of a portion of the structure related to the present application and does not constitute a limitation on the computer device 500 to which the present application is applied. The specific computer device 500 may include more or fewer components than those shown in the figure, or combine certain components, or have different component arrangements.
[0149] The processor 502 is used to run a computer program 5032 stored in the memory to perform the following steps:
[0150] Calculate the tile of the root node within the visible area and obtain all tile data sources; traverse all tile data sources and obtain the current level of each tile data source to obtain level data; deduplicate the level data; create a data storage device and store the tile data source corresponding to each level data; remove the root node within the visible area to obtain the removal result, and store the removal result in a first array; traverse the tiles in the first array; determine whether the tiles in the first array have been traversed completely; if the tiles in the first array have not been traversed completely, determine whether the current tile level can be further subdivided; if the current tile level can be further subdivided... The process involves using a quadtree to retrieve the four child tiles of the current tile; traversing the child tiles of the current tile; determining whether the traversal of the child tiles of the current tile has been completed; if the traversal of the child tiles of the current tile has not been completed, determining whether the child tile is inside the view frustum; if the child tile is inside the view frustum, storing the current child tile in the first array; determining whether the current tile needs to be stored; if the current tile needs to be stored, storing the current tile in the data storage according to the hierarchy, and executing the traversal of the child tiles of the current tile; if the tiles in the first array have been traversed, outputting all tile information of the corresponding hierarchy of all tile data sources in the data storage.
[0151] In one embodiment, after performing the step of determining whether the current tile level can be further subdivided, the processor 502 further performs the following steps:
[0152] If the current tile level cannot be further subdivided, then the traversal of the tiles in the first array is performed.
[0153] In one embodiment, after performing the step of determining whether the sub-tile is inside the view frustum, the processor 502 further performs the following steps:
[0154] If the sub-tile is not inside the view frustum, then the process of traversing the sub-tiles of the current tile is performed.
[0155] In one embodiment, after performing the step of determining whether the current tile needs to be stored, the processor 502 further performs the following steps:
[0156] If the current tile does not need to be stored, then the process of traversing the sub-tiles of the current tile is performed.
[0157] In one embodiment, when the processor 502 calculates the tiles of the root node within the visible area and obtains all tile data sources, it specifically implements the following steps:
[0158] Update the camera projection matrix; update the view frustum using the camera projection matrix; calculate the tile of the root node within the visible area or set the spatial coordinates of the root node tile to zero; obtain all tile data sources.
[0159] In one embodiment, when implementing the step of deduplicating the hierarchical data, the processor 502 specifically implements the following steps:
[0160] The hierarchical data is deduplicated using a JavaScript Set object.
[0161] In one embodiment, when implementing the step of determining whether the current tile needs to be stored, the processor 502 specifically implements the following steps:
[0162] Determine whether the data in the data storage exists an array corresponding to the sub-tile level; if the data in the data storage exists an array corresponding to the sub-tile level, then determine that the current tile needs to be stored; if the data in the data storage does not exist an array corresponding to the sub-tile level, then determine that the current tile does not need to be stored.
[0163] It should be understood that in the embodiments of this application, the processor 502 may be a central processing unit (CPU), or it may be other general-purpose processors, digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor may be a microprocessor or any conventional processor.
[0164] It will be understood by those skilled in the art that all or part of the processes in the methods of the above embodiments can be implemented by a computer program instructing related hardware. The computer program includes program instructions and can be stored in a storage medium, which is a computer-readable storage medium. The program instructions are executed by at least one processor in the computer system to implement the process steps of the embodiments of the above methods.
[0165] Therefore, the present invention also provides a storage medium. This storage medium can be a computer-readable storage medium. The storage medium stores a computer program, wherein when executed by a processor, the computer program causes the processor to perform the following steps:
[0166] Calculate the tile of the root node within the visible area and obtain all tile data sources; traverse all tile data sources and obtain the current level of each tile data source to obtain level data; deduplicate the level data; create a data storage device and store the tile data source corresponding to each level data; remove the root node within the visible area to obtain the removal result, and store the removal result in a first array; traverse the tiles in the first array; determine whether the tiles in the first array have been traversed completely; if the tiles in the first array have not been traversed completely, determine whether the current tile level can be further subdivided; if the current tile level can be further subdivided... The process involves using a quadtree to retrieve the four child tiles of the current tile; traversing the child tiles of the current tile; determining whether the traversal of the child tiles of the current tile has been completed; if the traversal of the child tiles of the current tile has not been completed, determining whether the child tile is inside the view frustum; if the child tile is inside the view frustum, storing the current child tile in the first array; determining whether the current tile needs to be stored; if the current tile needs to be stored, storing the current tile in the data storage according to the hierarchy, and executing the traversal of the child tiles of the current tile; if the tiles in the first array have been traversed, outputting all tile information of the corresponding hierarchy of all tile data sources in the data storage.
[0167] In one embodiment, after executing the computer program to perform the step of determining whether the current tile level can be further subdivided, the processor further performs the following steps:
[0168] If the current tile level cannot be further subdivided, then the traversal of the tiles in the first array is performed.
[0169] In one embodiment, after executing the computer program to perform the step of determining whether the sub-tile is inside the view frustum, the processor further performs the following steps:
[0170] If the sub-tile is not inside the view frustum, then the process of traversing the sub-tiles of the current tile is performed.
[0171] In one embodiment, after executing the computer program to implement the step of determining whether the current tile needs to be stored, the processor further implements the following steps:
[0172] If the current tile does not need to be stored, then the process of traversing the sub-tiles of the current tile is performed.
[0173] In one embodiment, when the processor executes the computer program to calculate the tiles of the root node within the visible area and obtain all tile data sources, it specifically implements the following steps:
[0174] Update the camera projection matrix; update the view frustum using the camera projection matrix; calculate the tile of the root node within the visible area or set the spatial coordinates of the root node tile to zero; obtain all tile data sources.
[0175] In one embodiment, when the processor executes the computer program to perform the step of deduplicating the hierarchical data, it specifically implements the following steps:
[0176] The hierarchical data is deduplicated using a JavaScript Set object.
[0177] In one embodiment, when the processor executes the computer program to implement the step of determining whether the current tile needs to be stored, it specifically implements the following steps:
[0178] Determine whether the data in the data storage exists an array corresponding to the sub-tile level; if the data in the data storage exists an array corresponding to the sub-tile level, then determine that the current tile needs to be stored; if the data in the data storage does not exist an array corresponding to the sub-tile level, then determine that the current tile does not need to be stored.
[0179] The storage medium can be any computer-readable storage medium capable of storing program code, such as a USB flash drive, portable hard drive, read-only memory (ROM), magnetic disk, or optical disk.
[0180] Those skilled in the art will recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed herein can be implemented in electronic hardware, computer software, or a combination of both. To clearly illustrate the interchangeability of hardware and software, the components and steps of the various examples have been generally described in terms of functionality in the foregoing description. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementations should not be considered beyond the scope of this invention.
[0181] In the several embodiments provided by this invention, it should be understood that the disclosed apparatus and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative. For example, the division of each unit is merely a logical functional division, and there may be other division methods in actual implementation. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed.
[0182] The steps in the method of this invention can be adjusted, merged, or reduced in order according to actual needs. The units in the device of this invention can be merged, divided, or reduced according to actual needs. Furthermore, the functional units in the various embodiments of this invention can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit.
[0183] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a storage medium. Based on this understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, a terminal, or a network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of the present invention.
[0184] The above description is merely a specific embodiment of the present invention, but the scope of protection of the present invention is not limited thereto. Any person skilled in the art can easily conceive of various equivalent modifications or substitutions within the technical scope disclosed in the present invention, and these modifications or substitutions should all be covered within the scope of protection of the present invention. Therefore, the scope of protection of the present invention should be determined by the scope of the claims.
Claims
1. A method for WEBGL view frustum culling, characterized in that, The method comprises the following steps: calculating the tiles of the root node in the visible region and obtaining all tile data sources; traversing all tile data sources and obtaining the level data of the current state of all tile data sources; de-duplicating the level data; creating a data storage and storing the tile data sources corresponding to each level data; culling the root node in the visible region to obtain a culling result and storing the culling result in a first array; traversing the tiles in the first array; judging whether the tiles in the first array have been traversed completely; if the tiles in the first array have not been traversed completely, judging whether the current tile level can be further subdivided; if the current tile level can be further subdivided, obtaining four child tiles of the current tile by using a quadtree query; traversing the child tiles of the current tile; judging whether the child tiles of the current tile have been traversed completely; if the child tiles of the current tile have not been traversed completely, judging whether the child tiles are inside a view frustum; if the child tiles are inside the view frustum, storing the current child tiles in the first array; judging whether the current tile needs to be stored; if the current tile needs to be stored, storing the current tile in the data storage according to the level and executing the step of traversing the child tiles of the current tile; if the tiles in the first array have been traversed completely, outputting all tile information of all tile data sources corresponding to the levels in the data storage.
2. The WEBGL view frustum culling method of claim 1, wherein, After the step of judging whether the current tile level can be further subdivided, the method further comprises the following step: if the current tile level cannot be further subdivided, executing the step of traversing the tiles in the first array.
3. The WEBGL view frustum culling method of claim 1, wherein, After the step of judging whether the child tiles are inside the view frustum, the method further comprises the following step: if the child tiles are not inside the view frustum, executing the step of traversing the child tiles of the current tile.
4. The WEBGL view frustum culling method of claim 1, wherein, After the step of judging whether the current tile needs to be stored, the method further comprises the following step: if the current tile does not need to be stored, executing the step of traversing the child tiles of the current tile.
5. The WEBGL view frustum culling method of claim 1, wherein, The step of calculating the tiles of the root node in the visible region and obtaining all tile data sources comprises the following steps: updating a camera projection matrix; updating a view frustum by using the camera projection matrix; calculating the tiles of the root node in the visible region or setting the spatial coordinates of the root node tiles as zero points; obtaining all tile data sources.
6. The WEBGL view frustum culling method of claim 1, wherein, The step of de-duplicating the level data comprises the following step: de-duplicating the level data by using a Set object of JavaScript.
7. The WEBGL view frustum culling method of claim 1, wherein, The step of judging whether the current tile needs to be stored comprises the following steps: judging whether the data in the data storage exists an array corresponding to the child tile level; if the data in the data storage exists the array corresponding to the child tile level, determining that the current tile needs to be stored; if the data in the data storage does not exist the array corresponding to the child tile level, determining that the current tile does not need to be stored.
8. A WEBGL view frustum culling apparatus, characterized by, The method comprises the following steps: a tile calculation unit, configured to calculate the tiles of the root node in the visible region and obtain all tile data sources; a first traversal unit, configured to traverse all tile data sources and obtain the level data of the current state of all tile data sources; a de-duplication unit, configured to de-duplicate the level data; a storage creation unit, configured to create a data storage and store the tile data sources corresponding to each level data; The culling unit is configured to cull the root node in the visible region to obtain a culling result and store the culling result in a first array; The second traversal unit is configured to traverse the tiles in the first array; The first judgment unit is configured to judge whether the tiles in the first array are traversed completely; The second judgment unit is configured to judge whether the current tile level can be further subdivided if the tiles in the first array are not traversed completely; The query unit is configured to obtain four child tiles of the current tile by using a quadtree query if the current tile level can be further subdivided; The third traversal unit is configured to traverse the child tiles of the current tile; The third judgment unit is configured to judge whether the child tiles of the current tile are traversed completely; The fourth judgment unit is configured to judge whether the child tiles are inside a view frustum if the child tiles of the current tile are not traversed completely; The first storage unit is configured to store the current child tile in the first array if the child tiles are inside the view frustum; The fifth judgment unit is configured to judge whether the current tile needs to be stored; The second storage unit is configured to store the current tile in a data storage according to the level if the current tile needs to be stored, and execute the step of traversing the child tiles of the current tile; The output unit is configured to output all tile information of all tile data sources corresponding to the level in the data storage if the tiles in the first array are traversed completely.
9. A computer device, comprising: The computer device includes a memory and a processor, the memory stores a computer program, and the processor implements the method in any one of claims 1 to 7 when executing the computer program.
10. A storage medium, characterized by The storage medium stores a computer program, and the computer program is executed by the processor to implement the method in any one of claims 1 to 7.
Citation Information
Patent Citations
MDDRQ-Tree index structure for network multidimensional space data expression
CN101923542A
Accelerated rendering method of scene model
CN110910505A