This is an x-ray-view of the lower tile being rendered before clipping: The reason for these clipping artefacts is, that 1-dimensional features of a vector tile (like roads) are actually rendered with a line-width thus being drawn as “2D shapes”. The effects becomes even more noticeable as we zoom into another area and increase the with of the lines (zoom level 17): The clipping occurs exactly on the edges of the tiles: These pictures were taken from a map rendered from vector tiles that were created with NO buffer at all around the actual tile. Looks pretty normal but if you look closely, you will notice several spots, where the roads look somehow clipped/distorted: Lets have a look at a screenshot of a vector tile map: So what will happen if we remove that buffer? Clipping That means the vector tile will contain data that is outside the visible area. Usually, vector tiles are created with a buffer. This canvas is then clipped to the actual boundingbox of the tile and stitched together with all other tiles. This saves bandwidth and allows to re-use the vector tile data for different rendering styles.įirst, each vector tile is rendered individually onto a canvas that is larger that the actual tile. The only difference is that the actual rastering (converting data to an image) of each vector tile is done in your browser (client-side) instead by a server. Similar to raster tiles, vector tiles are stitched into one big image within your browser from smaller images (tiling). Rendering Vectortilesįirst we have to understand how exactly vectortiles are rendered and displayed. Peterson, why I recommend to adjust the buffer size around vectortiles with the zoom level.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |