How Does It Work?

If you don't know about standard map things, such as the latitude/longitude system and projections, you should probably read about these first!

If you want a truly British insight into this, look no further than: https://youtu.be/3mHC-Pf8-dU & https://youtu.be/jtBV3GgQLg8.

Layers

Interactive maps are formed from multiple layers of data, which can be panned (moved), rotated, and sometimes tilted/pitched, based on the user's gesture input, or another programmatic control.

Tile Basics

One type of layer included on every map is known as a tile layer, which displays tiles, square segments of a map.

When multiple tiles, which are each the same dimensions, are laid out around each other, they give the illusion of one continuous map.

Tiles can be referenced/identified in a few different ways, such as:

• Slippy Map Convention (the most popular/common)

• TMS (very similar to the Slippy Map Convention)

• WMS

• WMTS

Tiles themselves can be of two types:

• Raster Each tile is a normal pre-rendered standard image, such as JPG or PNG

• Vector Each tile is a special format containing the data for the tile, and is then rendered by the end library

This library/documentation focuses on maps accessible via the Slippy Map Convention, although all are supported.

This library only supports raster tiles. See Raster vs Vector Tiles for more information.

Slippy Map Convention

For more information about the Slippy Map Convention, visit the OpenStreetMap Wiki.

Slippy map tiles are accessed by 3 coordinates, x/y/z.

X & Y coordinates correspond to all the latitudes and longitudes contained within that tile, however they are not actual longitude and latitude. For example, geographic coordinate (61.127, -0.123) in the tile (128983, 430239).

The Z value represents the current zoom level, where one tile (0/0/0) covers the entire planet with extremely low detail at level 0, to level 20 (although some tile servers will support even higher zoom levels) where over 1 trillion tiles are required to cover the entire surface of the Earth.

Sourcing Tiles

Tiles, especially raster tiles, take a lot of computing power and time to generate, because of the massive scale of all the input and output data. Therefore, most tiles are sourced externally, from an online tile server (either publicly or by users holding an API key), or sometimes from the local filesystem or asset store of the app.

Unlike commercial SDKs you may be more familiar with, we don't have an opinion on which tiles you should use, and you'll need to bring your own instead :)

Other Options

Tile Providers

A tile provider (within flutter_map) is responsible for:

• Constructing the path/URL to a tile, when given its coordinates (x/y/z): Slippy Map Convention

• Using an ImageProvider or other mechanism to fetch that tile: Sourcing Tiles

• Performing any other processing steps, such as caching

But don't worry! flutter_map (or a plugin) creates a provider for you, so for most use cases and tile sources, you shouldn't need to handle this yourself!

Tile Providers

This can be quite confusing for newcomers!

Within this library, 'tile providers' use 'tile servers' to retrieve tiles from the Internet. On the other hand, 'tile servers' and external sites usually use 'tile providers' to mean 'tile servers'!