README.md

vector_map_tiles_pmtiles

A tile provider for vector_map_tiles that adds support for PMTiles.

light	white	grayscale

dark	black

Getting started

Add the following packages to your pubspec.yaml file:

dependencies:
  flutter_map: ^6.0.0              # in case you don't have it yet 
  vector_map_tiles_pmtiles: ^1.1.0 # this package

Usage

1. Initiate the TileProvider

// ...from an URL
final _futureTileProvider = PmTilesVectorTileProvider
    .fromSource('https://example.com/useYourOwnHostedPMTilesFile.pmtiles');
// ...from an local file on the file system
final _futureTileProvider = PmTilesVectorTileProvider
    .fromSource('some/file/system/path.pmtiles');
// ...or provide a PmTilesArchive directly 
// (you'll have to add pmtiles as direct dependency to your project)
final _futureTileProvider = PmTilesVectorTileProvider
    .fromArchive(somePmTilesArchive);

2. Create your map theme

The theme specifies the look of the rendered map.

• You can use one of the default Protomaps basemap themes, for example the light theme: ProtomapsThemes.light().
• or provide your own style with: ThemeReader().read(myStyleJson).

Note: Styles from Mapbox, OpenMapTiles and others and not compatible with Protomaps styles.

3. Await the future, e.g. by using a FutureBuilder.

4. Provide your PmTilesVectorTileProvider and your map theme to your TileLayer.

@override
Widget build(BuildContext context) {
  return FlutterMap(
    options: MapOptions(),
    children: [
      VectorTileLayer(
        // the map theme
        theme: mapTheme,

        tileProviders: TileProviders({
          // the awaited vector tile provider
          'protomaps': tileProvider,
        }),

        // disable the file cache when you change the PMTiles source
        // fileCacheTtl: Duration.zero,
      ),
    ],
  );
}

Frequent questions

Where do I get PMTiles files from?

Visit the Getting Started guide on protomaps.com.

Can I use a custom style?

Yes that's possible. Start with one of the basemap themes and make the changes you want. Then use ThemeReader().read(style) to use your theme.

Maputnik has currently no built-in support for PMTiles (open issue here). But you can use the fork maputnik-with-pmtiles in the meantime.

Additional information

If you need help you can open an issue or join the flutter_map discord server.