Vector tile compression and rendering method in high-density data scene and storage medium
By identifying and reducing overlapping spatial data in high-density data scenarios, generating new feature sets, and optimizing front-end processing, the problems of large vector tile size and low performance are solved, achieving efficient tile compression and user-friendly display.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- GUANGZHOU KETENG INFORMATION TECH
- Filing Date
- 2022-09-16
- Publication Date
- 2026-04-24
AI Technical Summary
In high-density data scenarios, vector tiles are large in size, which affects network transmission and front-end parsing and rendering performance, and overlapping data cannot be visually recognized, wasting resources.
By calculating tile coordinates, overlapping spatial data is identified and reduced, a new feature set P, Q, and R is generated, vector tiles are generated according to specifications, and overlapping data is processed on the front end to optimize rendering and interaction.
It effectively reduces tile size, lowers network transmission and front-end resource consumption, while maintaining an unaffected user experience, thus improving rendering and interaction performance in high-density data scenarios.
Smart Images

Figure CN115511707B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to a method and storage medium for vector tile compression and display in high-density data scenarios, and in particular to a method for reducing tile volume by reducing overlapping spatial data and then re-displaying it on the front end. Background Technology
[0002] In the field of GIS, spatial data is typically modeled as spatial feature objects (features include numbers, shapes, and attributes), and these features are displayed using map tiles. From the perspective of the spatial feature carrying mechanism, map tiles can be divided into raster tiles and vector tiles. Raster tiles use raster images such as PNG and JPG to carry spatial features, while vector tiles organize and carry spatial features according to specifications (https: / / github.com / mapbox / vector-tile-spec) and complete the drawing by parsing the data in real time on the client side. Therefore, compared with raster tiles, vector tiles have advantages such as higher generation efficiency, allowing dynamic modification of styles on the front end, and stronger interactivity.
[0003] However, in high-density data scenarios (such as personnel distribution maps, power distribution equipment distribution maps, etc.), a large number of spatial elements will be superimposed within a single tile area, resulting in a very large tile volume after the vector tile is organized in a standardized manner, which seriously affects the performance of network transmission, front-end parsing and rendering, and other steps.
[0004] Observing vector tiles in high-density scenes, it is not difficult to find that most of the spatial elements are overlapping. However, the map display mechanism makes the spatial data on the lower layer invisible to the human eye, meaning that the data on the lower layer becomes useless data. Therefore, reducing and compressing the volume occupied by overlapping data is a feasible method to improve the performance of vector tiles in high-density data scenes. Summary of the Invention
[0005] This paper addresses the issue of large file sizes in high-density data scenarios by providing a method to reduce the size of vector tiles by shrinking overlapping spatial data and then re-representing them on the front end.
[0006] The technical solution of this invention is as follows:
[0007] A method for vector tile compression and display in high-density data scenarios includes the following steps:
[0008] Step (1): Calculate the geographic coordinates of the top left and bottom right corners of the tile and the tile coordinates.
[0009] Based on the pixel accuracy requirements of the tiles, the tile coordinates of the top left and bottom right corners are obtained. Based on the Google tile hierarchy standard and the z, x, and y values of the tiles, the geographic coordinates of the top left and bottom right corners of the tiles are calculated.
[0010] Step (2) converts the geographic coordinates of the elements within the tile area to tile coordinates.
[0011] Obtain the spatial features contained within the geographic coordinate range of the tile, traverse each coordinate of each feature, and use the top left and bottom right corners of the tile to interpolate and convert each coordinate into tile coordinates.
[0012] Step (3), overlapping element reduction and tile generation
[0013] Iterate through each element, calculate the overlapping part, and create a new element from the overlapping part. The shape of the new element is the shape of the overlapping part, and the attribute of the new element is the array of numbers pids of all overlapping elements. Store the new element in the common element set P. Iterate through each element. If the shape of the element does not overlap with the shape of the element in set P, add the element to the independent element Q. If there is an overlap, trim the shape of the overlapping part of the element. If the shape is not empty after trimming, store the element in the superimposed element set R.
[0014] Step (4), tile generation
[0015] Extract the features from sets P, Q, and R in step (3), mark which set the feature belongs to in the feature's attributes, generate vector tiles according to the vector tile specification, and return them to the front end.
[0016] Step (5), front-end processing
[0017] After the front-end obtains the vector tiles, it performs feature rendering (i.e., drawing and displaying them as images) and feature user interaction (i.e., mouse clicks, hovering over features, etc.):
[0018] During rendering, if the feature belongs to set Q or set R, the rendering can be performed directly according to the standard vector tile rendering logic; if the feature belongs to set P, the first number pid in the feature attribute pids is taken out, the feature r with the number equal to pid in set R is taken out, and the standard vector tile rendering logic is performed according to the attributes of feature r.
[0019] When performing user interaction, if the selected element f belongs to set Q, the interaction logic is executed directly using f; if the selected element f belongs to set R, the element pfs containing the number of f in the attribute pids is retrieved from set P, the shape of pfs is merged with the shape of f to obtain the complete shape, and then the interaction logic is executed using f; if the selected element f belongs to set P, that is, multiple elements are actually selected, the attribute pids of f is retrieved for the user to further select which specific element they need, and then the logic for when the element belongs to set R is executed.
[0020] Furthermore, in the tile coordinate calculation of step (1), the upper left tile coordinate is always [0,0], and the lower right tile coordinate changes according to the pixel precision requirement. If the pixel precision requirement is pix, then the lower right tile coordinate is [pix,pix].
[0021] Furthermore, the interpolation method in step (2) is linear interpolation, which aims to minimize the computational load of coordinate transformation without distortion. If the geographic coordinates of the top left corner of the tile are [lng1,lat1] and the tile coordinates are [0,0], the geographic coordinates of the bottom right corner of the tile are [lng2,lat2] and the tile coordinates are [pix,pix], the geographic coordinates to be transformed are [lng,lat], and the transformed pixel coordinates are [x,y], then the transformation formula is:
[0022]
[0023]
[0024] Furthermore, the array of overlapping element numbers pids in step (3) can be sorted according to the element attributes specified by the user as weights, so that when rendering in step (5), the first number pid retrieved is always the one that the user cares about most.
[0025] The present invention also provides a computer-readable storage medium having a computer program stored thereon, the computer program being executable by a processor to implement the steps of the method of the present invention.
[0026] Compared with the prior art, the present invention has the following beneficial effects:
[0027] The vector tile volume reduction method for high-density data scenarios described in this invention addresses the extremely high overlap rate of high-density data by compressing the overlapping parts, thereby significantly reducing the tile volume and lowering resource consumption in network transmission, front-end parsing, and other steps. Furthermore, since the covered parts are not visually visible, the compressed tiles will not affect the user's browsing and interaction experience. Attached Figure Description
[0028] Figure 1 : A schematic diagram of the process of this invention.
[0029] Figure 2 : Diagram of overlapping elements in a simplified form. Detailed Implementation
[0030] The technical solutions of the present invention will be further described in detail below with reference to the embodiments, but the present invention is not limited to the following technical solutions.
[0031] Example 1: The method of the present invention is used to support the display and interaction of power distribution equipment distribution diagrams.
[0032] The data volume of power grid distribution equipment is enormous (generally in the tens of millions to hundreds of millions per province), and the equipment is often more concentrated in densely populated areas, exhibiting a clear high-density distribution characteristic. If existing vector tile generation methods are used directly for province-wide map display and interaction, each tile will be tens or even hundreds of MB in size, causing map lag or even browser crashes. After reduction using the method described in this invention, the tile size is reduced to less than 2 MB, allowing for smoother map browsing and interaction.
[0033] This method achieves tile compression and display through the following steps:
[0034] Step (1) Calculate the geographic coordinates of the top left and bottom right corners of the tile and the tile coordinates.
[0035] Based on the tile pixel precision requirements, the tile coordinates of the top-left and bottom-right corners are obtained. According to the Google tile hierarchy standard and the z, x, and y values of the tile, the geographic coordinates of the top-left and bottom-right corners are calculated. In this embodiment, the tile pixel precision value is 4096, which is recommended by the vector tile standard. Therefore, the tile coordinates of the top-left and bottom-right corners are [0,0] and [4096,4096], respectively. The gistcat framework (https: / / github.com / codingmiao / giscat) has mature components supporting the calculation of tile geographic coordinates; therefore, this embodiment uses this framework to complete the tile geographic coordinate calculation.
[0036] Step (2) converts the geographic coordinates of the elements within the tile area to tile coordinates.
[0037] The geographic coordinates of the top-left and bottom-right corners of the tile are used to construct an SQL statement to query a PostGIS database containing power grid data. This retrieves the elements within the tile area. Each element's coordinates are then iterated through, and interpolation is performed using the top-left and bottom-right corners of the tile to convert each coordinate into tile coordinates. If the top-left corner geographic coordinates are [lng1,lat1] and the tile coordinates are [0,0], the bottom-right corner geographic coordinates are [lng2,lat2] and the tile coordinates are [4096,4096], the geographic coordinates to be converted are [lng,lat], and the converted pixel coordinates are [x,y], then the conversion formula is:
[0038]
[0039]
[0040] Step (3) Overlapping element reduction and tile generation
[0041] The overlapping parts are calculated by traversing all elements. The JTS framework (https: / / github.com / locationtech / jts) has mature component support for geometric object overlap calculation, so this embodiment uses this framework to complete the overlap calculation. The overlapping parts are made into new elements, with the shape of the overlapping parts and the attribute of the new element being an array of IDs (pids) of all overlapping elements (in this embodiment, since different equipment types have different levels of importance, for example, users are more concerned about transformer type equipment than towers, so after obtaining the array pids, it is sorted according to the weight value of the equipment type from largest to smallest), and the new elements are stored in the common element set P. Each element is traversed. If the shape of an element does not overlap with the shape of an element in set P, the element is added to the independent element Q. If there is an overlap, the shape of the overlapping part of the element is clipped. If the shape after clipping is not empty, the element is stored in the overlay element set R. The condensed result is shown in the appendix. Figure 2 As shown.
[0042] Step (4) Tile generation
[0043] Extract the features from sets P, Q, and R in step (3), mark which set the feature belongs to in the feature's attributes, generate vector tiles according to the vector tile specification, and return them to the front end.
[0044] Step (5) Front-end processing
[0045] The mapbox-gl framework (https: / / github.com / mapbox / mapbox-gl-js) already has mature component support for displaying standard vector tiles, therefore, this embodiment uses this framework to complete the front-end processing. After obtaining the vector tiles, the front-end performs feature rendering (i.e., drawing and displaying as an image) and feature user interaction (i.e., mouse clicks, hovering over features, etc.):
[0046] During rendering, if the feature belongs to set Q or set R, the rendering can be performed directly according to the standard vector tile rendering logic; if the feature belongs to set P, the first number pid in the feature attribute pids is taken out, the feature r with the number equal to pid in set R is taken out, and the standard vector tile rendering logic is performed according to the attributes of feature r.
[0047] When performing user interaction, if the selected element f belongs to set Q, the interaction logic is executed directly using f; if the selected element f belongs to set R, the element pfs containing the number of f in the attribute pids is retrieved from set P, the shape of pfs is merged with the shape of f to obtain the complete shape, and then the interaction logic is executed using f; if the selected element f belongs to set P, that is, multiple elements are actually selected, the attribute pids of f is retrieved and a selection component pops up in the browser, allowing the user to further select which specific element they need, and then the logic for when the element belongs to set R is executed.
Claims
1. A method for vector tile compression and display in high-density data scenarios, characterized in that, Includes the following steps: Step (1): Calculate the geographic coordinates of the top left and bottom right corners of the tile and the tile coordinates; Step (2) converts the geographic coordinates of the elements within the tile area to tile coordinates; Step (3), overlapping feature reduction and tile generation, includes: (1) Traverse each element, calculate the overlapping part, make the overlapping part into a new element, the shape of the new element is the shape of the overlapping part, the attribute of the new element is the number array pids of all overlapping elements, and store the new element into the common element set P. (2) Traverse each element. If the shape of the element does not overlap with the shape of the elements in the common element set P, add the element to the independent element Q. If there is an overlap, cut off the shape of the overlapping part of the element. If the shape is not empty after cutting, store the element in the superimposed element set R. Step (4), tile generation Extract the features from sets P, Q, and R in step (3), mark which set the feature belongs to in the feature's attributes, generate vector tiles according to the vector tile specification, and return them to the front end; Step (5), front-end processing After the front-end obtains the vector tiles, it performs feature rendering and user interaction with the features, including: During rendering, if a feature belongs to set Q or set R, the rendering logic of standard vector tiles is directly executed; if a feature belongs to set P, the first number pid in the feature attribute pids is retrieved, and the feature r in set R with the number equal to pid is retrieved, and the rendering logic of standard vector tiles is executed according to the attributes of feature r. When performing user interaction, if the selected element f belongs to set Q, the interaction logic is executed directly using f; if the selected element f belongs to set R, the element pfs containing the number of f in the attribute pids is retrieved from set P, the shape of pfs is merged with the shape of f to obtain the complete shape, and then the interaction logic is executed using f; if the selected element f belongs to set P, that is, multiple elements are actually selected, the attribute pids of f is retrieved for the user to further select which specific element they need, and then the logic for when the element belongs to set R is executed.
2. The method according to claim 1, characterized in that, Step (1) also includes: Based on the pixel accuracy requirements of the tiles, the tile coordinates of the top left and bottom right corners are obtained. Based on the Google tile hierarchy standard and the z, x, and y values of the tiles, the geographic coordinates of the top left and bottom right corners of the tiles are calculated.
3. The method according to claim 1, characterized in that, Step (2) also includes: Obtain the spatial features contained within the geographic coordinate range of the tile, traverse each coordinate of each feature, and use the top left and bottom right corners of the tile to interpolate and convert each coordinate into tile coordinates.
4. The method according to claim 2, characterized in that, In step (1), the tile coordinates are calculated such that the upper left tile coordinate is always [0,0], and the lower right tile coordinate changes according to the pixel precision requirement. If the pixel precision requirement is pix, then the lower right tile coordinate is [pix,pix].
5. The method according to claim 3, characterized in that, The interpolation method in step (2) is linear interpolation. If the geographic coordinates of the top left corner of the tile are [lng1,lat1] and the tile coordinates are [0,0], the geographic coordinates of the bottom right corner of the tile are [lng2,lat2] and the tile coordinates are [pix,pix], the geographic coordinates to be converted are [lng,lat], and the converted pixel coordinates are [x,y], then the conversion formula is:
6. The method according to any one of claims 1-5, characterized in that, The array of overlapping element numbers pids in step (3) is sorted according to the element attributes specified by the user as weights, so that when rendering in step (5), the first number pid retrieved is always the one that the user cares about most.
7. A computer-readable storage medium having a computer program stored thereon, characterized in that, The computer program can be executed by a processor to implement the steps of the vector tile compression and display method in high-density data scenarios as described in any one of claims 1-6.
Citation Information
Patent Citations
Spatial vector data online interactive mapping method based on hierarchical-divided storage structure
CN103744999A
Tile type grid raster map compression storage and release methods
CN107301194A