A method for weakening three-dimensional local terrain protrusions based on WebGL
By using a WebGL-based 3D local terrain protrusion weakening method, and leveraging mesh loading and vertex height adjustment, the problems of deformation caused by terrain stretching and scaling and complex terrain fusion processing in GIS technology are solved, achieving improved flexibility and distortion-free visual effects.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- WUHAN GUO YAO XIN TIAN DI INFORMATION TECH CO LTD
- Filing Date
- 2025-09-11
- Publication Date
- 2026-06-26
AI Technical Summary
Existing GIS technologies suffer from poor visual effects and inconvenient operation when loading local high-precision terrain. Terrain stretching and scaling can cause deformation, while terrain fusion processing is complex and lacks flexibility.
Using a WebGL-based approach, terrain data is loaded as a mesh, vertex data is compressed using zig-zag encoding, vertex heights are adjusted, and the Delaunay triangulation is reconstructed. The terrain is rendered in real time, and terrain details are dynamically adjusted to reduce local protrusions.
It achieves flexible reduction of local terrain protrusions without deformation, improving visual effects and ease of operation, reducing manual processing steps, and improving processing efficiency.
Smart Images

Figure CN121095496B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of computer graphics visualization technology, specifically to a WebGL-based method for weakening the protrusion of three-dimensional local terrain. Background Technology
[0002] Typically, a GIS project focuses on its geographical area, requiring only the loading of high-resolution terrain data for that specific region. Other areas lack terrain data, leading to significant differences in elevation between the terrain-rich and non-terrain-rich areas. This results in steep inconsistencies in the displayed terrain, poor visual quality, and inconvenient operation. Current GIS technologies primarily employ terrain stretching / scaling and terrain blending to mitigate the prominence of local terrain features.
[0003] Terrain stretching and scaling is achieved by stretching and scaling the terrain DEM height data. Taking the current mainstream WebGL rendering engine Cesium as an example, the degree of terrain undulation can be increased or decreased by adjusting the terrain exaggeration factor. However, this method scales the entire scene, which solves the problem of displaying height differences, but also causes local terrain distortion. Furthermore, the 3D models loaded in the scene are also stretched and distorted, resulting in incorrect data being displayed.
[0004] Terrain fusion merges multiple terrain data sets from different regions, typically combining global low-resolution terrain data with local high-resolution terrain data to soften the prominence of specific terrain features. Using mainstream desktop GIS software like ArcMap, this involves a series of processes, including overlay corrections, to merge low-resolution and high-resolution terrain data into a single TIF file before tiling. To avoid data abrupt changes and ensure good visualization, large volumes of high-resolution element data need to be merged with low-resolution terrain data to create a large-area DEM. This process is complex, time-consuming, and lacks flexibility. If terrain updates are needed, the data must be manually processed again, and the merged data tiled.
[0005] Neither terrain stretching / scaling nor terrain blending can achieve both flexibility and non-deformation. Terrain stretching / scaling is prone to deformation, while terrain blending lacks flexibility. Therefore, a WebGL-based 3D local terrain protrusion weakening method is proposed to solve the above problems. Summary of the Invention
[0006] To address the shortcomings of existing technologies, this invention provides a WebGL-based method for weakening the protrusion of 3D local terrain, which has the advantages of balancing flexibility and non-deformation, and solves the problem that it is difficult to balance flexibility and non-deformation in existing technologies.
[0007] To achieve the above objectives, the present invention provides the following technical solution: a WebGL-based method for weakening the protrusion of 3D local terrain, comprising the following steps:
[0008] S1. Loading the terrain mesh: In the WebGL rendering engine, terrain data is loaded into the scene in the form of a mesh, and the information is stored in the form of a binary file in .terrain format.
[0009] S2. Mesh parsing: Loading tiled terrain data according to the Level of Detail (LOD) strategy, parsing binary terrain files in .terrain format, each grid is assigned a level, and each grid has a unique row and column number (XY) in the terrain grid system.
[0010] S3. Parse terrain data. Based on the terrain grid level (Level) and row and column numbers (XY), load and parse the downloaded .terrain format binary file data. Its structure includes two parts: header information and vertex data header. Compress the data using the zig-zag encoding method.
[0011] S4. Dynamic adjustment of vertex height;
[0012] S5. Terrain triangulation reconstruction: Based on the adjusted vertex data, an irregular triangular mesh (TIN) conforming to the Delaunay rule is generated, texture coordinates are assigned to the triangular mesh, and the terrain is rendered in real time through the WebGL rendering engine.
[0013] Furthermore, the header information in S3 includes the center position of the tile in the sphere coordinate system, the maximum height, the minimum height, and the circumscribed sphere of the tile.
[0014] Furthermore, the data header of the vertex data in S3 includes an unsigned integer and three short integer arrays. The unsigned integer is used to store the number of vertices, and the three short integer arrays store the vertex horizontal coordinate array (u), the vertex vertical coordinate array (v), and the elevation array (h), respectively. The vertex coordinate array (u,v,h) is decompressed using the zig-zag decoding algorithm, and the vertex coordinates are converted into actual latitude, longitude, and elevation values.
[0015] Furthermore, the step of converting the vertex coordinates into actual latitude, longitude, and elevation values is as follows:
[0016] S31. In a tile, divide each direction into MAX_SHORT segments, which is 2^15 = 32768 segments.
[0017] S32. When representing the coordinates of any vertex in any direction, use Formula 1 to convert them into integers;
[0018] S33. For each vertex, use the interpolation of the transformed vertex coordinates with the coordinates of the previous vertex in each direction to compress the integer as much as possible so that its absolute value is as small as possible, so that zigzag encoding can be used for compression.
[0019] Furthermore, Formula 1 is: Target elevation = minimumHeight + (u[i] / MAX_SHORT) × (maximumHeight - minimumHeight).
[0020] Furthermore, in S4, the minimum non-zero elevation value within the local terrain range is used as the minimum elevation. The minimum elevation is set as a reasonable threshold. The current grid vertex data is traversed. If the vertex elevation is lower than the elevation threshold, it is corrected to be no lower than the threshold.
[0021] Furthermore, the correction method is as follows:
[0022] S41, Traverse vertex data;
[0023] S42. Modify the elevation of vertices below the threshold and box them into the elevation array allHeight;
[0024] S43. Update the height range. After traversing, retrieve the lowest and highest elevations from the allHeight array and reassign them to the lowest and highest elevations of the tiles.
[0025] S44. Re-encode the processed height values into the range [0, MAX_SHORT]. Iterate through the vertex data again, extract the height value of each vertex in the elevation array allHeight, normalize a height value allHeight[i] from the original range [minimumHeight, maximumHeight] to [0.0, 1.0], and then map it to [0, MAX_SHORT].
[0026] Furthermore, the triangulation reconstruction in S5 includes constructing an STK terrain instance based on the corrected vertex array.
[0027] Furthermore, the terrain mesh parsed in S5 is rendered into the scene in real time using the WebGL rendering engine.
[0028] Furthermore, S5 dynamically triggers the re-parsing and rendering of the grid data in response to camera movement or terrain data updates.
[0029] Compared with existing technologies, this invention provides a WebGL-based method for weakening the protrusion of 3D local terrain, which has the following advantages:
[0030] 1. This WebGL-based method for weakening 3D local terrain protrusion weakens the terrain protrusion problem by modifying the vertex elevation of areas without terrain data. It does not distort the local high-precision terrain and model in the scene, is not coupled with other map functions, can weaken the steep terrain problem of 3D local terrain protrusion, and the terrain and model in the scene are not deformed.
[0031] 2. This WebGL-based 3D local terrain protrusion weakening method parses the terrain data of each block on the browser side, modifies the vertex data in real time to reconstruct the vertex triangulation, and renders the terrain in real time. It does not require manual processing of TIF data using desktop tools, thus eliminating the cost of manual data processing. It is highly reliable, flexible, and efficient, and requires no manual data processing throughout the entire process. Attached Figure Description
[0032] Figure 1 This is a flowchart of the present invention;
[0033] Figure 2 To load a 3D rendering of the local terrain;
[0034] Figure 3 The resulting 3D rendering is distorted and appears to be generated using the Cesium rendering engine.
[0035] Figure 4 This is an illustration of the overall effect of weakening the protrusion of local terrain in three dimensions according to the present invention.
[0036] Figure 5 This is a diagram illustrating the effect of the three-dimensional local terrain protrusion weakening elevation without deformation according to the present invention. Detailed Implementation
[0037] 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 embodiments of the present invention, and not all embodiments. 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.
[0038] Please see Figure 1 This embodiment of a WebGL-based method for weakening the protrusion of 3D local terrain includes the following steps:
[0039] S1. Loading the terrain mesh: In the WebGL rendering engine, terrain data is loaded into the scene in the form of a mesh, and the information is stored in the form of a binary file in .terrain format. Storing it in the form of a binary file in .terrain format can optimize loading speed and storage space.
[0040] S2. Mesh parsing: Load tiled terrain data according to the Level of Detail (LOD) strategy, parse binary terrain files in .terrain format. Each grid is assigned a level. The higher the level, the higher the resolution and the richer the details of the grid. Each grid has a unique row and column number (XY) in the terrain grid system to identify its position in the global terrain.
[0041] S3. Parse terrain data. Based on the terrain grid level (Level) and row and column numbers (XY), load and parse the downloaded .terrain format binary file data. This data is stored in binary format and has a specially encoded mesh structure. Its structure includes two parts: header information and vertex data headers. The data is compressed using the zig-zag encoding method.
[0042] S4. Dynamic adjustment of vertex height;
[0043] S5. Terrain triangulation reconstruction: Based on the adjusted vertex data, an irregular triangular mesh (TIN) conforming to the Delaunay rule is generated, texture coordinates are assigned to the triangular mesh, and the terrain is rendered in real time through the WebGL rendering engine.
[0044] It should be further explained that the header information in S3 includes the center position of the tile in the sphere-centered coordinate system, the maximum height, the minimum height, and the circumsphere of the tile. The data header of the vertex data in S3 includes an unsigned integer and three short integer arrays. The unsigned integer is used to store the number of vertices. The three short integer arrays store the horizontal coordinate array (u), the vertical coordinate array (v), and the elevation array (h) of the vertex, respectively. The vertex coordinate array (u, v, h) is decompressed by the zig-zag decoding algorithm, and the vertex coordinates are converted into actual latitude, longitude, and elevation values. Zig-zag decoding is an cumulative process, that is, the subsequent point is the relative position of the previous point, i.e., the difference. The u, v, h arrays stored in the obtained vertex information are not the final latitude and longitude results, and the coordinates need to be further calculated.
[0045] In addition, the steps for converting the vertex coordinates into actual latitude, longitude, and elevation values are as follows:
[0046] S31. In a tile, divide each direction into MAX_SHORT segments, which is 2^15 = 32768 segments.
[0047] S32. When representing the coordinates of any vertex in any direction, use Formula 1 to convert them into integers;
[0048] S33. For each vertex, use the interpolation of the transformed vertex coordinates with the coordinates of the previous vertex in each direction to compress the integer as much as possible so that its absolute value is as small as possible, so that zigzag encoding can be used for compression.
[0049] Furthermore, Formula 1 is: Target elevation = minimumHeight + (u[i] / MAX_SHORT) × (maximumHeight - minimumHeight).
[0050] It is known that in S4, the minimum non-zero elevation value within the local terrain range is used as the minimum elevation. The minimum elevation is set as a reasonable threshold. The current grid vertex data is traversed. If the vertex elevation is lower than the elevation threshold, it is corrected to be no lower than the threshold.
[0051] Furthermore, the correction method is as follows:
[0052] S41, Traverse vertex data;
[0053] S42. Modify the elevation of vertices below the threshold and box them into the elevation array allHeight;
[0054] S43. Update the height range. After traversing, retrieve the lowest and highest elevations from the allHeight array and reassign them to the lowest and highest elevations of the tiles.
[0055] S44. Re-encode the processed height values into the range [0, MAX_SHORT]. Iterate through the vertex data again, extract the height value of each vertex in the elevation array allHeight, normalize a height value allHeight[i] from the original range [minimumHeight, maximumHeight] to [0.0, 1.0], and then map it to [0, MAX_SHORT].
[0056] In addition, the triangulation reconstruction in S5 includes constructing an STK terrain instance based on the corrected vertex array, reorganizing the adjusted vertex elevation data to generate a new vertex array, and reconstructing the STK terrain triangulation instance based on the adjusted vertex data. The parsed terrain mesh in S5 is rendered into the scene in real time through the WebGL rendering engine. The level of detail (LOD) of each mesh is dynamically adjusted according to the scene's position and viewpoint to ensure rendering efficiency and visual quality. When responding to camera movement or terrain data updates, S5 will dynamically trigger the re-parsing and rendering of mesh data. When the camera moves or the terrain data changes, the mesh-by-mesh parsing process will be automatically triggered to reload and parse the necessary terrain data to ensure real-time updates of the terrain.
[0057] In this embodiment, the terrain protrusion problem is mitigated by modifying the vertex elevation of areas without terrain data. Furthermore, the terrain and model in the scene remain undistorted and are not coupled with other functional modules of the map, resulting in high reliability.
[0058] Example 1, please refer to Figures 2 to 5
[0059] Figure 2 Loading local terrain data into the middle will create obvious steep slopes between areas without terrain data, resulting in poor performance. Figure 3 Using the terrain stretching and scaling method provided by the Cesium rendering engine, as can be seen in the image, this method causes local terrain deformation and simultaneously performs stretching and scaling. Figure 3 It is evident from the local terrain elevation differences that scaling has also been applied to these local terrain elevation differences.
[0060] Figure 4 and Figure 5 The technical solution of weakening the protrusion of the three-dimensional local terrain is adopted. As can be seen from the figure, this solution has no impact on the model in the scene and the local terrain is not distorted. It is obvious that the effect of this solution is better.
[0061] It should be noted that, in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.
[0062] Although embodiments of the invention have been shown and described, it will be understood by those skilled in the art that various changes, modifications, substitutions and alterations can be made to these embodiments without departing from the principles and spirit of the invention.
Claims
1. A WebGL-based method for weakening the protrusion of 3D local terrain, characterized in that, Includes the following steps: S1. Loading the terrain mesh: In the WebGL rendering engine, terrain data is loaded into the scene in the form of a mesh, and the information is stored in the form of a binary file in .terrain format. S2. Mesh parsing: Loading block terrain data according to the terrain detail level (LOD) strategy, parsing binary terrain files in .terrain format, assigning a level to each grid, and each grid has a unique row and column number (XY) in the terrain grid system; S3. Parse terrain data. Based on the terrain grid level (Level) and row and column numbers (XY), load and parse the downloaded .terrain format binary terrain file. Its structure includes two parts: header information and vertex data header. Compress the data using the zig-zag encoding method. S4. Vertex height is dynamically adjusted. The minimum non-zero elevation value within the local terrain range is used as the minimum elevation. This minimum elevation is set as a reasonable threshold. The current grid vertex data is traversed. If the vertex elevation is lower than the threshold, it is corrected to be no lower than the threshold. The correction method is as follows: S41, Traverse vertex data; S42. Modify the elevation of vertices below the threshold and box them into the elevation array allHeight; S43. Update the height range. After traversing, retrieve the lowest and highest elevations from the allHeight array and reassign them to the lowest and highest elevations of the tiles. S44. Re-encode the processed elevation values into the range [0, MAX_SHORT]. Iterate through the vertex data again, extract the elevation value of each vertex in the elevation array allHeight, normalize an elevation value allHeight[i] from the original range [minimumHeight, maximumHeight] to [0.0, 1.0], and then map it to [0, MAX_SHORT]. S5. Terrain triangulation reconstruction: Based on the adjusted vertex data, an irregular triangulation network (TIN) conforming to the Delaunay rule is generated, texture coordinates are assigned to the triangulation network, and the terrain is rendered in real time through the WebGL rendering engine.
2. The WebGL-based method for weakening the protrusion of 3D local terrain according to claim 1, characterized in that: The header information in S3 includes the center position of the tile in the sphere coordinate system, the maximum elevation, the minimum elevation, and the information of the circumscribed sphere of the tile.
3. The WebGL-based method for weakening the protrusion of 3D local terrain according to claim 2, characterized in that: The data header of the vertex data in S3 includes an unsigned integer and three short integer arrays. The unsigned integer is used to store the number of vertices. The three short integer arrays store the vertex horizontal coordinate array u, the vertex vertical coordinate array v, and the elevation array h, respectively. The vertex coordinate arrays u, v, and h are decompressed using the zig-zag decoding algorithm, and the vertex coordinates are converted into actual latitude, longitude, and elevation values.
4. The WebGL-based method for weakening the protrusion of 3D local terrain according to claim 3, characterized in that, The steps for converting the vertex coordinates into actual latitude, longitude, and elevation values are as follows: S31. In a tile, divide each direction into MAX_SHORT segments, which is 2^15 = 32768 segments. S32. When representing the coordinates of any vertex in any direction, use Formula 1 to convert it into an integer. Formula 1 is: Target elevation = minimumHeight + (u[i] / MAX_SHORT) × (maximumHeight - minimumHeight); S33. For each vertex, use the interpolation parameters of the transformed vertex coordinates and the previous vertex coordinates in each direction to compress the integer so that its absolute value is small, so that zig-zag encoding can be used for compression.
5. The WebGL-based method for weakening the protrusion of 3D local terrain according to claim 1, characterized in that: The triangulation reconstruction in S5 includes constructing an STK terrain instance based on the corrected vertex array.
6. The WebGL-based method for weakening the protrusion of 3D local terrain according to claim 1, characterized in that: The terrain mesh parsed in S5 is rendered into the scene in real time by the WebGL rendering engine.
7. A WebGL-based method for weakening the protrusion of 3D local terrain according to claim 1, characterized in that: The S5 will dynamically trigger the re-parsing and rendering of the grid data in response to camera movement or terrain data updates.
Citation Information
Patent Citations
Urban three-dimensional model multi-scale expression method considering local features
CN113593031A
TIN-based global digital twinning system coast restoration method
CN118396900A