Raster vs Vector Map Tiles: What is the Difference Between the Two Data Types?

This article will help you understand the problematics of raster and vector map tiles and the main differences between these two map data types. You will learn about different MapTiler products, including MapTiler Cloud and MapTiler Data that offer ready-to-use raster and vector tiles of the entire planet for your projects and applications. Also, you will find out how to create raster or vector map tiles from your own data with MapTiler Engine.

• Raster map tiles are larger in size, less demanding on end-users' hardware but more demanding on the server-side performance.

• Vector map tiles are faster to load, and less demanding on the server-side performance but more demanding on end-users hardware.

• With MapTiler you can take advantage of both map data types. You can use many standard MapTiler maps of the whole world or create your own data set.

Raster vs vector map tiles

Raster map tiles

Web maps based on raster tiles technology are older but still widely used approach by many. In computer graphics, a raster graphic is a dot matrix data structure that represents a generally rectangular grid of pixels (points of color), viewable e.g. via a computer or mobile display. Raster images are stored in image files of varying formats.

Raster map tiles are actually nothing else than raster images. Zoomable raster maps consist of many raster map tiles (in the .png or .jpg format) placed next to each other, ordered in a pyramid scheme. This clever trick allows you to browse just a small part of the map without loading it whole while maintaining the feeling of exploring a single large document. Read more about zoomable maps and the pyramid scheme in this article.

As raster tiles are images stitched together, they can be zoomed and panned but do not provide styling capabilities on the user’s end. Raster tiles have fixed styles, defined at the time they are created (rendered). Rendering raster imagery is CPU- and memory-consuming. One solution, used by many web map providers, is to render tiles in advance before serving them from a server. So every time a user opens the map, the pre-rendered tiles are simply shown on the screen which means that the requirements for end-users' hardware are much lower while the server-side hardware requirements are higher.

On the other hand, raster tiles are quite large in size, and therefore the loading time during panning and zooming on the map may be longer, depending on the network connection speed.

Vector map tiles

Vector tiles were introduced later, they also deliver data that are divided into roughly squared tiles. But these tiles do not consist of raster images, they are made of mathematical interpretations of geometric features such as points, curves, or polygons. Vector tiles are rendered on the client’s side with a style, which is a small text file that defines how certain map elements look and how they are displayed (e.g., a road can be defined as a solid red line placed on top of all map elements). The style also says whether the map element should be rendered at all, and what font and language are to be used for rendering the labels. So vector tiles make it easy to change the map's look & feel on the fly with minimum resources.

Vector tiles are transferred over the internet in the form of a geographic data package, which usually consists of individual tiles in the .pbf format. The map client on the end user's device will use a rendering engine to create the map in the form of an image that can be displayed to the end user to view. That is why the vector tiles are more demanding on the client’s hardware.

Vector tiles are about 20–50% of the size of raster tiles so they take less time to transmit, requiring fewer resources for processing. Moreover, they offer a high-resolution display on all zoom levels without increasing the file size of the tiles.

Vector tiles are supported by many JavaScript libraries and SDKs for the web and mobile including:

• MapLibre Open Maps SDKs (JavaScript, Android, iOS)

• Leaflet (JavaScript)

• OpenLayers (JavaScript)

• QGIS, ArcGIS, and other GIS software tools

Pros and cons of both data types

Both vector and raster map tiles have their advantages and disadvantages which impact what they are used for. Let’s take a look at the most important points:

It is possible to mix raster with vector tiles and get the best out of both, e.g., a satellite map (raster tiles) with an overlay of streets with labels available in different languages (vector tiles). Check on the interactive map below.

MapTiler offers both raster and vector map tiles of the whole planet for any application

As clients have different use cases their priorities also differ. Raster tiles can be rendered from pre-generated vector tiles on request on the server side. Because of this flexibility MapTiler stores the street maps in the vector format only but can offer both raster and vector map tiles of the whole planet to its customers. Just sign-up, pick one of the standard map styles, or create your own and start using the maps for free with MapTiler Cloud.

The same raster and vector tiles are available for self-hosting too. To get started you will just need a MapTiler Data subscription and a piece of software for easy map tiles hosting - MapTiler Server (a single license is included in every MapTiler Data subscription).

Create your own raster and vector tiles with MapTiler

If you have data in raster or vector format, you can easily generate vector tiles out of it using MapTiler Engine. The vector tiles functionality is available starting from version 10 and it works in all editions including the Free edition.

You simply drag and drop your Shapefile, GeoJSON, or any other vector or raster file type (supported file formats) into MapTiler Engine, adjust the final map properties and select the output format. The map can be created in MBTiles or Folder structure designed for quick serving on the web without a need for additional server software.

Rendering of vector tiles with MapTiler Engine is easy, you can read this simple guide, or if you feel like doing more advanced operations with vector tiles, for example, you want to combine more data sources into one, then proceed to this article instead.

You can try this with the sample data of New York City subway stations or subway lines.

How to host your own tiles with MapTiler

Once you have your geodata created with MapTiler Engine you can easily host them on MapTiler Cloud. Do you want to find out more about how to upload and host any geodata data on MapTiler Cloud? Then continue reading here.

Conclusion

Raster technology is older and has some limitations, especially from the perspective of image quality when compared to more advanced vector technology. However, raster map tiles still have their justification in some of the use cases, e.g., if very low-performance hardware on the end-users' side is expected. With MapTiler you can take advantage of both raster and vector tile maps of the whole planet. On top of that, MapTiler also gives you the option to create your own maps in both formats.

Useful links

Maps and projections
Raster graphics
What are vector tiles
OSM - Vector Tiles
Why are vector maps better than raster maps?
Raster vs vector
Map rendering - vector vs raster