{"id":13820,"date":"2025-05-21T10:00:00","date_gmt":"2025-05-21T08:00:00","guid":{"rendered":"https:\/\/www.sigterritoires.fr\/?p=13820"},"modified":"2025-05-19T15:36:49","modified_gmt":"2025-05-19T13:36:49","slug":"mbtiles-leaflet","status":"publish","type":"post","link":"https:\/\/www.sigterritoires.fr\/index.php\/en\/mbtiles-leaflet\/","title":{"rendered":"MBtiles & Leaflet"},"content":{"rendered":"\n

\n

\n

Contenu <\/p>\nToggle<\/span>

Introduction: What is the MBTiles format?<\/a><\/li>
Internal structure of an MBTiles file<\/a>
- 1. The main tables<\/a>
  - a) tiles<\/a><\/li>
  - b) metadata<\/a><\/li><\/ul><\/li>
  - 2.Indexing<\/a><\/li>
  - 3.Other views and variants<\/a><\/li><\/ul><\/li>
  - Raster vs. Vector: Two types of tiles in MBTiles files<\/a>
    - 1.MBTiles Raster<\/a><\/li>
    - 2.Vector MBTiles (VectorTiles)<\/a>
      - In a nutshell<\/a><\/li><\/ul><\/li><\/ul><\/li>
      - Generating MBTiles files: tools and workflows<\/a>
        1.MBTiles Raster (images)<\/a><\/li>
        MBTiles (Vector Tiles)<\/a><\/li><\/ul><\/li>
        Internal structure of an MBTiles file<\/a>
        1.Main tables<\/a>
        tiles (or map + images for multi-part vectors)<\/a><\/li>
        (optional) grids, grid_data, keymap<\/a><\/li><\/ul><\/li><\/ul><\/li>
        Important notes<\/a><\/li><\/ul><\/li>
        Using MBTiles with Leaflet<\/a>
        Prerequisites: A tile server<\/a><\/li>
        MBTiles integration with Leaflet<\/a>
        Example with raster tiles<\/a>
        a)Launch the tile server<\/a><\/li><\/ul><\/li><\/ul><\/li>
        Vector tiles (MBTiles PBF)<\/a>
        Example with vector tiles (PBF)<\/a><\/li>
        Symbology<\/a><\/li>
        Dependencies<\/a><\/li>
        Encoding<\/a><\/li>
        Example of PHP code modified to serve vector tiles (PBF) :<\/a><\/li><\/ul><\/li><\/ul><\/li>
        Scalability and other uses<\/a><\/li>
        Conclusion<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n
        <\/span>Introduction: What is the MBTiles format?<\/span><\/h2>\n\n\n\n
        The MBTiles format is a file format for storing map tiles (raster or vector) in a SQLite database, a lightweight, stand-alone database engine.<\/p>\n\n\n\n
        Initially designed by Mapbox, this format has been widely adopted in the GIS, cartographic and web mapping communities for its portability, ease of use and compatibility with numerous tools.<\/p>\n\n\n\n\n\n\n
        In practical terms, an .mbtiles file is a single database that can contain thousands, even millions of geographic tiles organized by zoom levels, columns and rows. This avoids the need for a complex tree structure of files on disk, while facilitating distribution (on the web, via USB, or in disconnected mode).<\/p>\n\n\n\n
        The MBTiles format can contain :<\/p>\n\n\n\n
        \n
        Raster tiles (usually PNG or JPEG),<\/li>\n\n\n\n
        Or vector tiles (in MVT – Mapbox Vector Tiles – format),<\/li>\n\n\n\n
        And metadata (description, attribution, format, etc.).<\/li>\n<\/ul>\n\n\n\n
        Thanks to its SQLite format, MBTiles can be easily read with tools such as sqlite3, DB Browser for SQLite, or operated via lightweight servers (such as Flask or TileServer-PHP), making it highly suitable for training, demonstrations or off-line use.<\/p>\n\n\n\n
        \n\n\n\n
        <\/span>Internal structure of an MBTiles file<\/span><\/h2>\n\n\n\n
        An MBTiles file is a SQLite database structured according to a simple, standardized schema, which allows you to efficiently store map tiles in raster (PNG, JPEG) or vector (PBF) format.<\/p>\n\n\n\n
        <\/span>1. The main tables<\/span><\/h3>\n\n\n\n
        According to the official specification (https:\/\/github.com\/mapbox\/mbtiles-spec<\/a>), an .mbtiles file contains at least :<\/p>\n\n\n\n
        <\/span>a) tiles<\/span><\/h4>\n\n\n\n
        This is the central table. It contains the encoded tiles, each identified by its zoom coordinates, column (x) and line (y):<\/p>\n\n\n
        <\/div>
        <\/div>
        <\/div><\/div>
        <\/p>\n\n\n\n
        CREATE TABLE tiles (
        zoom_level INTEGER,
        tile_column INTEGER,
        tile_row INTEGER,
        tile_data BLOB
        );
        <\/p>\n\n\n
        <\/div><\/div>\n\n\n\n
        Note<\/strong>: MBTiles use the TMS (Tile Map Service) coordinate system, which means that the vertical axis (Y) is inverted in relation to the XYZ scheme used by Leaflet. Some servers or viewers correct this automatically.<\/p>\n\n\n\n
        <\/span>b) metadata<\/span><\/h4>\n\n\n\n
        This table contains general information about the file and the tiles it contains, such as :<\/p>\n\n\n
        <\/div>
        <\/div>
        <\/div><\/div>
        <\/p>\n\n\n\n
        CREATE TABLE metadata (\n name TEXT,\n value TEXT\n);\n<\/code><\/pre>\n\n\n<\/div><\/div>\n\n\n\n Some common fields :<\/p>\n\n\n\n \nname: name of tile set;<\/li>\n\n\n\n format: tile format (png, jpg, pbf);<\/li>\n\n\n\n minzoom, maxzoom: zoom levels available;<\/li>\n\n\n\n bounds: geographic extent (minlon,minlat,maxlon,maxlat) ;<\/li>\n\n\n\n center: map center coordinates (lon,lat,zoom) ;<\/li>\n\n\n\n type: map type (baselayer, overlay);<\/li>\n\n\n\n description: explanatory text.<\/li>\n<\/ul>\n\n\n\n<\/span>2.Indexing<\/span><\/h3>\n\n\n\nMBTiles files can include indexes to speed up tile access, but this is not mandatory.<\/p>\n\n\n\n <\/span>3.Other views and variants<\/span><\/h3>\n\n\n\nSome tools (such as MapTiler or TileMill) generate additional views or alternative schemas, such as the map view associated with an image table in an optimized format (tile deduplication).<\/p>\n\n\n\n Example:<\/p>\n\n\n <\/div> <\/div><\/div><\/div><\/p>\n\n\n\nCREATE TABLE images (\n tile_id TEXT,\n tile_data BLOB\n);\n\nCREATE TABLE map (\n zoom_level INTEGER,\n tile_column INTEGER,\n tile_row INTEGER,\n tile_id TEXT\n);\n<\/code><\/pre>\n\n\n<\/div><\/div>\n\n\n\n This allows each image to be stored only once, even if it is used at several coordinates.<\/p>\n\n\n\n Here’s a clear comparative section between the two types of content that the MBTiles format can store:<\/p>\n\n\n\n \n\n\n\n<\/span>Raster vs. Vector: Two types of tiles in MBTiles files<\/span><\/h2>\n\n\n\nThe MBTiles format is versatile: it can contain raster tiles (images) or vector tiles (encoded geographic data). Each approach has its advantages and is suitable for different use cases.<\/p>\n\n\n\n <\/span>1.MBTiles Raster<\/span><\/h3>\n\n\n\n\nContent: PNG or JPEG images (rarely WebP).<\/li>\n\n\n\n Use: pre-rendered backgrounds, static maps, historical maps, orthophotos, etc.<\/li>\n\n\n\n Declared format: format field = png or jpg in metadata table.<\/li>\n\n\n\n Display: directly compatible with most libraries such as Leaflet, OpenLayers or MapLibre, via a tile server (local or remote).<\/li>\n\n\n\n Advantages:\n\nVery simple to implement.<\/li>\n\n\n\n Consistent rendering on all platforms.<\/li>\n\n\n\n No client-side processing.<\/li>\n<\/ul>\n<\/li>\n\n\n\n Limitations:\n\nNo native interactivity (no click on entity).<\/li>\n\n\n\n Higher weight: one image per tile.<\/li>\n\n\n\n Less flexible in case of style changes.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<\/span>2.Vector MBTiles (VectorTiles)<\/span><\/h3>\n\n\n\n\nContents: vector data encoded in Mapbox Vector Tile (MVT, .pbf) format.<\/li>\n\n\n\n Use: dynamic, interactive, multi-style maps (OpenStreetMap, custom maps).<\/li>\n\n\n\n Declared format: format = pbf field in metadata table.<\/li>\n\n\n\n Display: requires a library supporting vector rendering (MapLibre GL, Mapbox GL JS, etc.).<\/li>\n\n\n\n Advantages :\n\nLightweight: a single file can contain several styles.<\/li>\n\n\n\n Very fast to load with the right rendering engine.<\/li>\n\n\n\n Interactive: entities can be queried on the fly.<\/li>\n<\/ul>\n<\/li>\n\n\n\n Limitations:\n\nRequires a client-side renderer or a server such as tileserver-gl.<\/li>\n\n\n\n More complex to generate.<\/li>\n\n\n\n Not yet supported by all platforms (e.g. Leaflet does not support them directly).<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<\/span>In a nutshell<\/span><\/h4>\n\n\n\nFeatures<\/th> Raster<\/th> Vector<\/th><\/tr><\/thead> Tile format<\/td> PNG, JPEG<\/td> PBF (MVT)<\/td><\/tr> Rendering<\/td> Pre-rendered, fixed<\/td> Dynamic, stylable<\/td><\/tr> Interactivity<\/td> No<\/td> Yes<\/td><\/tr> Compatibility<\/td> Very wide<\/td> More restricted<\/td><\/tr> Size<\/td> Heavier<\/td> Lighter on large scale<\/td><\/tr> Styling requirements<\/td> None (rendering included)<\/td> Requires JSON styling<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n \n\n\n\n<\/span>Generating MBTiles files: tools and workflows<\/span><\/h2>\n\n\n\n<\/span>1.MBTiles Raster (images)<\/span><\/h3>\n\n\n\nRaster tiles are generally generated from a map displayed in GIS software or a cartographic rendering engine. Here are the main tools:<\/p>\n\n\n\n Tool<\/th> Description<\/th> Type<\/th><\/tr><\/thead> QGIS<\/strong><\/td> Plugin \u00ab Export as tiles \u00bb (or Processing \u2192 Generate XYZ tiles<\/code>)<\/td> Graphical interface<\/td><\/tr> GDAL<\/strong><\/td> gdal2tiles.py<\/code> with option --mbtiles<\/code> (since GDAL 3.1)<\/td> Command line<\/td><\/tr> TileMill<\/strong> (old)<\/td> Creation of PNG tiles via Mapnik <\/td> Graphical interface<\/td><\/tr> MapTiler Desktop<\/strong><\/td> Full interface for creating MBTiles (limited free version)<\/td> Graphical interface<\/td><\/tr> tippecanoe + rasterize<\/strong><\/td> Hybrid workflow: rasterize upstream if required<\/td> Command line<\/td><\/tr> MapProxy<\/strong><\/td> Generates dynamically and can export to MBTile<\/td> Server\/cache<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nTypical use case: tourist map, orthophoto, scanned map.<\/p>\n\n\n\n \n\n\n\n<\/span>MBTiles (Vector Tiles)<\/span><\/h3>\n\n\n\nVector tiles require encoding in PBF and cutting into tiles according to the MVT (Mapbox Vector Tile) standard. This requires specialized tools:<\/p>\n\n\n\n Tool<\/th> Description<\/th> Format MBTiles<\/th><\/tr><\/thead> tippecanoe<\/strong> (Mapbox)<\/td> Reference tool for converting GeoJSON to PBF tiles in an MBTiles<\/td> Yes<\/td><\/tr> tilemaker<\/strong><\/td> Generates vector tiles directly from an OSM PBF<\/td> Yes<\/td><\/tr> PostGIS<\/a> + ST_AsMVT<\/strong><\/td> Export tiles manually with SQL scripts \u2192 storage in MBTiles via mb-util<\/td> With script<\/td><\/tr> OpenMapTiles<\/strong><\/td> Complete chain with Docker, based on PostgreSQL\/PostGIS + imposm3 + tippecanoe<\/td> Yes<\/td><\/tr> MapTiler Desktop<\/strong><\/td> Also allows vector export with integrated styles (Pro version)<\/td> Yes<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nTypical applications: interactive city maps, customizable backgrounds, highly interactive projects.<\/p>\n\n\n\n <\/span>Internal structure of an MBTiles file<\/span><\/h2>\n\n\n\nAn .mbtiles file is a SQLite database containing geographic tiles organized according to a standardized schema, which varies slightly between raster and vector formats.<\/p>\n\n\n\n <\/span>1.Main tables<\/span><\/h3>\n\n\n\n<\/span>tiles (or map + images for multi-part vectors)<\/span><\/h5>\n\n\n\nField<\/th> Type<\/th> Description<\/th><\/tr><\/thead> zoom_level<\/code><\/td> INTEGER<\/td> zoom level of tile<\/td><\/tr> tile_column<\/code><\/td> INTEGER<\/td> column (x) of tile <\/td><\/tr> tile_row<\/code><\/td> INTEGER<\/td> line (y) of tile (inverted TMS \u2194 XYZ)<\/td><\/tr> tile_data<\/code><\/td> BLOB<\/td> Binary image data or PBF<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\nNote: in vector format, some implementations such as tilemaker separate image metadata (images) and positions (map). In this case, a tiles view is created to combine them.<\/p>\n\n\n\n metadata<\/strong><\/p>\n\n\n\n Key-value table (key = text, value = text) containing information essential for interpreting the file.<\/p>\n\n\n\n Key<\/th> Example value<\/th> Utility <\/th><\/tr><\/thead> name<\/code><\/td> \"Rodrigues Map\"<\/code><\/td> Readable name<\/td><\/tr> format<\/code><\/td> \"png\"<\/code>, \"jpg\"<\/code>, \"pbf\"<\/code><\/td> Tile type<\/td><\/tr> minzoom<\/code><\/td> 5<\/code><\/td> Minimum zoom level<\/td><\/tr> maxzoom<\/code><\/td> 14<\/code><\/td> Maximum zoom level<\/td><\/tr> bounds<\/code><\/td> 63.35,-19.9,63.5,-19.7<\/code><\/td> BBox (WGS84)<\/td><\/tr> center<\/code><\/td> 63.42,-19.8,12<\/code><\/td> Map center (lon, lat, z)<\/td><\/tr> type<\/code><\/td> \"baselayer\"<\/code> ou \"overlay\"<\/code><\/td> Tile set role<\/td><\/tr> json<\/code><\/td> JSON Mapbox (if vector)<\/td> Style, layers, fields<\/td><\/tr> attribution<\/code><\/td> HTML text<\/td> Source to display<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<\/span>(optional) grids<\/code>, grid_data<\/code>, keymap<\/code><\/span><\/h5>\n\n\n\nUsed for UTFGrid format, an obsolete form of interactivity in raster backgrounds.<\/p>\n\n\n\n \n\n\n\n<\/span>Important notes<\/span><\/h3>\n\n\n\n\nThe tile_row coordinates are often inverted, depending on the tile system:\n\nTMS (Tile Map Service): origin is bottom left.<\/li>\n\n\n\n XYZ (Web standard): origin is top left.<\/li>\n\n\n\n Most modern servers and viewers use XYZ.<\/li>\n<\/ul>\n<\/li>\n\n\n\n The tile_data field contains :\n\nA compressed image (png, jpg) for raster.<\/li>\n\n\n\n A zlib-compressed PBF object for vector tiles.<\/li>\n<\/ul>\n<\/li>\n\n\n\n For vector tiles, the json field in metadata can contain:\n\n { \u201cvector_layers\u201d: [ { \u201cid\u201d: \u201cbuildings\u201d, \u201cdescription\u201d: \u201c\u201d, \u201cminzoom\u201d: 12, \u201cmaxzoom\u201d: 16, \u201cfields\u201d: { \u201cname\u201d: \u201cString\u201d, \u201cheight\u201d: \u201cNumber\u201d } } ] }<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<\/span>Using MBTiles with Leaflet<\/span><\/h2>\n\n\n\nLeaflet is a popular JavaScript library for creating interactive maps. It supports the integration of many types of map backgrounds, including MBTiles. Here are typical steps and use cases for integrating MBTiles into a Leaflet map.<\/p>\n\n\n\n <\/span>Prerequisites: A tile server<\/span><\/h3>\n\n\n\nBefore using MBTiles with Leaflet, you need to set up a tile server, as Leaflet does not load local MBTiles directly. This server will serve the tiles as images or in vector format, accessible via a URL.<\/p>\n\n\n\n There are various options for hosting MBTiles:<\/p>\n\n\n\n \nTileStache<\/a><\/strong><\/li>\n\n\n\n Tileserver-GL<\/a><\/strong><\/li>\n\n\n\n Flask + Flask<\/a>-tile<\/strong> (for lightweight installation)<\/li>\n\n\n\n Tileserver-php<\/a><\/li>\n<\/ul>\n\n\n\nOnce the server has been configured, it can distribute the tiles via HTTP, which Leaflet can call up to display them on the map.<\/p>\n\n\n\n<\/span>MBTiles integration with Leaflet<\/span><\/h3>\n\n\n\nHere’s a simple example of using a tile server with Leaflet to display data from an .mbtiles file:<\/p>\n\n\n\n<\/span>Example with raster tiles<\/span><\/h4>\n\n\n\n<\/span>a)Launch the tile server<\/span><\/h5>\n\n\n\nGo to the directory containing the raster tiles.<\/p>\n\n\n\n php.exe -S localhost:8081<\/em><\/strong><\/p>\n\n\n\n launch the tile server<\/p>\n\n\n\n<\/a><\/figure>\n\n\n\nThe following html page displays the contents of the tiles in the countries.mbtiles file located in the tiles\/ subfolder. In the browser, enter the address localhost:8081\/page_name.html<\/p>\n\n\n<\/div> <\/div><\/div><\/div><\/p>\n\n\n\n<!DOCTYPE html>\n<html>\n<head>\n <meta charset=\"utf-8\" \/>\n <title>Carte Mondiale<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.css\" \/>\n <style>\n html, body, #map { height: 100%; margin: 0; }\n <\/style>\n<\/head>\n<body>\n<div id=\"map\"><\/div>\n<script src=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.js\"><\/script>\n<script>\n var map = L.map('map').setView([45, 2], 5);\n\n L.tileLayer('tileserver.php?file=tiles\/countries.mbtiles&z={z}&x={x}&y={y}', {\n tileSize: 256,\n minZoom: 0,\n maxZoom: 6,\n attribution: '© OpenStreetMap contributors'\n }).<\/mark>addTo(map);\n<\/script>\n<\/body>\n<\/html>\n\n<\/code><\/pre>\n\n\n<\/div><\/div>\n\n\n\n The result is as follows:<\/p>\n\n\n\n<\/a><\/figure>\n\n\n\n<\/span>Vector tiles (MBTiles PBF)<\/span><\/h3>\n\n\n\nIf you’re using a vector MBTiles file (e.g. generated by MapTiler or Mapbox), you’ll need to configure Leaflet with a plugin that can interpret vector tiles. Leaflet.VectorGrid is one of the plugins that can handle vector tiles in Leaflet.<\/p>\n\n\n\n <\/span>Example with vector tiles (PBF)<\/span><\/h5>\n\n\n<\/div> <\/div><\/div><\/div><\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"fr\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Carte Vectorielle MBTiles avec Leaflet<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet@1.7.1\/dist\/leaflet.css\" \/>\n <script src=\"https:\/\/unpkg.com\/leaflet@1.7.1\/dist\/leaflet.js\"><\/script>\n <script src=\"https:\/\/unpkg.com\/leaflet.vectorgrid@1.1.0\/dist\/Leaflet.VectorGrid.js\"><\/script>\n<\/head>\n<body>\n <div id=\"map\" style=\"height: 600px;\"><\/div>\n\n <script>\n var map = L.map('map').setView([ -19.7, 63.35], 12); \/\/ Centr\u00e9 sur Rodrigues\n\n \/\/ Charger les tuiles vectorielles MBTiles\n L.vectorGrid.protobuf(\"http:\/\/localhost:8081\/tileserver.php?file=tiles\/map.mbtiles&z={z}&x={x}&y={y}\", {\n vectorTileLayerStyles: {\n \/\/ Styles pour les tuiles vectorielles\n building: {\n fillColor: 'blue',\n weight: 1,\n fillOpacity: 0.6\n },\n park: {\n fillColor: 'green',\n weight: 1,\n fillOpacity: 0.6\n }\n }\n }).addTo(map);\n <\/script>\n<\/body>\n<\/html>\n<\/code><\/pre>\n\n\n<\/div><\/div>\n\n\n\n In this example, the Flask or Tileserver-GL server is used to supply vector tiles, which Leaflet renders as vectors using L.vectorGrid.<\/p>\n\n\n\n However, this is not as simple as with raster tiles.<\/p>\n\n\n\n <\/span>Symbology<\/span><\/h5>\n\n\n\nThe first difference is that vector tiles, unlike raster tiles, have no associated symbology at server level. You are therefore obliged to define the symbology at the html client level. You can see this in the example code above:<\/p>\n\n\n <\/div> <\/div><\/div><\/div><\/p>\n\n\n\nvectorTileLayerStyles: {\n \/\/ Styles pour les tuiles vectorielles\n building: {\n fillColor: 'blue',\n weight: 1,\n fillOpacity: 0.6\n },\n park: {\n fillColor: 'green',\n weight: 1,\n fillOpacity: 0.6\n }\n }<\/code><\/pre>\n\n\n<\/div><\/div>\n\n\n\n What’s also important to know is that there is no default symbology. If a layer has no symbology definition in vectorTileLayerStyles, it will not be displayed. In our example, only buildings and parks will be displayed, all other layers (roads, etc.) will be ignored.<\/p>\n\n\n\n <\/span>Dependencies<\/span><\/h5>\n\n\n\nLeaflet.VectorGrid has several dependencies that can complicate the operation of the local tile server. When we display an .mbtiles file converted to .pbf via tileserver.php (for example), we’re calling up raw vector tiles from a local PHP server, without the right headers or encodings. But :<\/p>\n\n\n\n \nThese tiles require pbf.js (which you can add: src=\u201chttps:\/\/unpkg.com\/pbf@3.2.1\/dist\/pbf.js\u201d)<\/li>\n\n\n\n but also @mapbox\/vector-tile to decode .pbf content.<\/li>\n<\/ul>\n\n\n\nHowever, the latter is not available as a .js file for direct use in an HTML page: it is written for Node.js or for a modern bundler (Webpack, Vite, etc.).<\/p>\n\n\n\n <\/span>Encoding<\/span><\/h5>\n\n\n\nThe default PHP code in tileserver.php is configured to handle raster tiles (PNG images), but not vector tiles (.pbf).<\/p>\n\n\n\n You’ll need to adjust tileserver.php to serve vector tiles (PBF):<\/p>\n\n\n\n Modification of the Content-Type header:<\/strong> For vector tiles, you need to specify a Content-Type header: application\/x-protobuf, as vector tiles are Protobuf format files (.pbf), not PNG images.<\/p>\n\n\n\n <\/span>Example of PHP code modified to serve vector tiles (PBF) :<\/span><\/h5>\n\n\n<\/div> <\/div><\/div><\/div><\/p>\n\n\n\n<?php \/\/ Ouverture de la base de donn\u00e9es SQLite $db = new SQLite3($_GET['file']); \/\/ Extraction des coordonn\u00e9es de la tuile $z = (int) $_GET['z']; $x = (int) $_GET['x']; $y = (int) $_GET['y']; \/\/ Conversion du syst\u00e8me de coordonn\u00e9es TMS vers XYZ $y = (1 << $z) - 1 - $y; \/\/ TMS flip \/\/ Pr\u00e9paration de la requ\u00eate pour extraire la tuile correspondante $stmt = $db->prepare(\"SELECT tile_data FROM tiles WHERE zoom_level = :z AND tile_column = :x AND tile_row = :y\"); $stmt->bindValue(':z', $z, SQLITE3_INTEGER); $stmt->bindValue(':x', $x, SQLITE3_INTEGER); $stmt->bindValue(':y', $y, SQLITE3_INTEGER); $res = $stmt->execute(); \/\/ Si une tuile est trouv\u00e9e if ($row = $res->fetchArray()) { \/\/ D\u00e9finir l'en-t\u00eate appropri\u00e9 pour les tuiles vectorielles Protobuf header('Content-Type: application\/x-protobuf'); \/\/ Retourner les donn\u00e9es de la tuile echo $row['tile_data']; } else { \/\/ Si aucune tuile n'est trouv\u00e9e, renvoyer une erreur 404 http_response_code(404); } ?> <\/pre>\n\n\n<\/div><\/div>\n\n\n\n <\/span>Scalability and other uses<\/span><\/h3>\n\n\n\nMBTiles are particularly useful in scenarios where :<\/p>\n\n\n\n \nPerformance is an important issue, as tiles can be distributed efficiently thanks to an optimized tile server.<\/li>\n\n\n\n You want to distribute a large number of tiles offline, or in an environment with no Internet connection (pre-generated tiles stored in a single file).<\/li>\n\n\n\n Tiles are generated from frequently changing data, and you can update or replace them with minimum disruption to end-users.<\/li>\n<\/ul>\n\n\n\n \n\n\n\n<\/span>Conclusion<\/span><\/h3>\n\n\n\nThe MBTiles format is very well suited to Leaflet applications, offering a simple and efficient solution for serving geospatial tiles, whether raster or vector. With a lightweight installation and a well-configured tile server, it’s easy to display high-performance maps and manage large quantities of geospatial data.<\/p>\n","protected":false},"excerpt":{"rendered":" Introduction: What is the MBTiles format? The MBTiles format is a file format for storing map tiles (raster or vector) in a SQLite database, a lightweight, stand-alone database engine. Initially designed by Mapbox, this format has…<\/p>\n","protected":false},"author":1,"featured_media":13824,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"give_campaign_id":0,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sfsi_plus_gutenberg_text_before_share":"","sfsi_plus_gutenberg_show_text_before_share":"","sfsi_plus_gutenberg_icon_type":"","sfsi_plus_gutenberg_icon_alignemt":"","sfsi_plus_gutenburg_max_per_row":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false},"categories":[3015],"tags":[3108,2945,3110,2060,1388,3112,1309,3114,3116,3118,2106],"class_list":["post-13820","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-webmapping-en","tag-flask-en","tag-leaflet-en","tag-mbtiles-en","tag-raster-en","tag-spatialite-en","tag-sqlite-en","tag-tiles","tag-tileserver-gl-en","tag-tileserver-php-en","tag-tilestache-en","tag-vector"],"aioseo_notices":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.sigterritoires.fr\/wp-content\/uploads\/2025\/05\/image_mbtiles_leaflet-1.jpg?fit=1024%2C1024&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/p6XU0A-3AU","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/posts\/13820","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/comments?post=13820"}],"version-history":[{"count":0,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/posts\/13820\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/media\/13824"}],"wp:attachment":[{"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/media?parent=13820"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/categories?post=13820"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sigterritoires.fr\/index.php\/wp-json\/wp\/v2\/tags?post=13820"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}