3.4. Création de tuiles

Nous avons brièvement abordé les tuiles (tiles) avec l'option Cache de tuiles serveur dans l'extension Lizmap, dont le but est de publier une couche sous la forme d'imagettes enregistrées en cache sur le serveur.

Nous quittons maintenant Lizmap pour approfondir cet aspect important du webmapping qu'est la création et l'utilisation de tuiles.

3.4.1. Tuiles "à la Google Maps"

La plupart des fournisseurs de données cartographiques en ligne utilisent un système de tuiles pour publier leurs fonds de carte, que ce soit des plans ou des images satellitaires. On peut citer le géoportail IGN, ou des sociétés comme ESRI et MapBox. Le précurseur en la matière fut Google Maps.

Les données tuilées sont publiées :

  • dans le système de coordonnées "WGS84 / Pseudo-Mercator" (EPSG:3857),
  • à différentes échelles prédéfinies (jusqu'à 24 niveaux de zoom, du monde à l'immeuble),
  • sous forme d'images précalculées (PNG ou JPG) de 256x256 pixels.

Niveaux de zoom

Au niveau de zoom 0, l'ensemble du monde tient sur 1 seule tuile. Au niveau de zoom 1, sur 4 tuiles. Au niveau 2, sur 16 tuiles, etc.

niveaux de zoom Source de l'image : https://leafletjs.com/examples/zoom-levels/

Le niveau de zoom maximum (le plus détaillé) varie selon les fournisseurs de données.

Coordonnées des tuiles

Il existe 2 systèmes d'indexation des tuiles : Google et TMS.

La page suivante sur le site du logiciel MapTiler illustre bien ces 2 systèmes de "coordonnées" :

https://www.maptiler.com/google-maps-coordinates-tile-bounds-projection/

Chaque tuile est identifiée par ses coordonnées Z,X,Y :

  • Z = niveau de zoom
  • X = numéro de colonne, en partant de la gauche
  • Y = numéro de ligne, en partant du haut (Google) ou du bas (TMS)

Exercice 1. Sur le site de MapTiler, dans la carte dynamique qui indique le numéro des tuiles, zoomez sur la ville de Sète et répondez aux questions suivantes

  • A quel niveau de zoom voit-on apparaître la ville de Sète ? (apparition du nom Sète)
  • A quel niveau de zoom voit-on apparaître la gare de Sète ? (apparition du logo Gare bleu)
  • Au niveau de zoom Z=17, quelles sont les coordonnées TMS de la tuile avec le Buffet de la Gare de Sète ? (logo rouge du bar)

Voir la solution

Tuiles OpenStreetMap

Le serveur https://www.openstreetmap.org utilise le système "Google" pour identifier les tuiles.

Dans Firefox, avec le volet Outil de développement (touche F12), vous pouvez voir l'URL des tuiles OSM téléchargées lorsque vous vous déplacez et zoomez dans la carte. Cliquez sur Réseau et Images pour voir l'URL des images.

Sur le serveur OpenStreetMap, l'URL des tuiles prend cette forme : https://tile.openstreetmap.org/${z}/${x}/${y}.png

  • Avec Firefox, utilisez le modèle d'URL ci-dessus pour ouvrir et télécharger sur votre ordinateur la tuile OSM ${z}/${x}/${y} = 16/33436/23982

3.4.2. Créer des données tuilées

QGIS propose des outils qui permettent de générer des tuiles. L'intérêt de créer ses propres tuiles est le suivant :

  • pas besoin de webservices OGC pour créer une carte web dynamique. Les tuiles précalculées permettent d'intégrer un fond de carte dans une page web sans déployer un logiciel tel que Geoserver, Mapserver, etc. On parle alors d'architecture "serverless".
  • la bibliothèque Javascript Leaflet est conçue pour les données tuilées. Avec cette API, les cartes tuilées sont faciles à mettre en oeuvre dans une page web (voir partie suivante).
  • côté serveur : améliorer le temps de réponse. Ouvrir un raster de plusieurs centaines de Mo, puis générer une image correspondant à une emprise et échelle donnée - comme c'est le cas avec le WMS - cela demande du temps de calcul. Créer des tuiles à des échelles prédéfinies demande de la puissance de calcul, mais seulement 1 fois... ensuite les tuiles sont prêtes à être servies pour un grand nombre d'utilisateurs.

Inconvénient des tuiles : pour les données qui changent souvent, il faut recalculer les tuiles souvent.

Créer des tuiles à partir d'un raster

Parmi les utilitaires GDAL installés avec QGIS, il existe une commande qui permet de générer des tuiles à partir d'un fichier raster : gdal2tiles. Elle est accessible en ligne de commande dans le terminal, ou depuis QGIS, dans la boîte à outil de traitements : GDAL/Divers raster/gdal2tiles.

La commande gdal2tiles est bien adaptée pour générer des tuiles à partir de cartes scannées ou d'images satellite. Par contre, elle n'est pas opérante pour les données vectorielles, ni adaptée aux rasters qui ont besoin d'être "stylés" (exemple un MNT).

La documentation de cette commande se trouve sur le site de GDAL :

https://gdal.org/programs/gdal2tiles.html

En plus des tuiles au format image, la commande peut générer un "Web viewer" (une page HTML avec une carte pour visualiser les tuiles) de 3 manières : avec les API Leaflet, OpenLayers ou Google Maps.

TP: Générez les tuiles à partir de la carte de Montpellier en 1724, entre les niveaux de zoom 14 et 18. Pour cela, utilisez la commande suivante. L'option -a 0 permet d'afficher en transparent les pixels noirs du bord de carte. Le répertoire de sortie sera ~/data/mon_travail/3_leaflet/tiles/M1724.

gdal2tiles.py -r bilinear -z 14-18 -a 0 -t "Carte de Montpellier en 1724" ~/data/Occitanie/Montpellier_Niquet/1724_montpel_cv_niquet_georef.tif ~/data/mon_travail/3_leaflet/tiles/M1724

Les fichiers HTML générés par la commande se trouvent dans ce répertoire. Sur la machine virtuelle, pour accéder à la page web ~/data/mon_travail/3_leaflet/tiles/M1724/leaflet.html générée par gdal2tiles, vous pouvez utiliser cette URL : http://localhost/3_leaflet/tiles/M1724/leaflet.html

Créer des tuiles avec un rendu défini dans QGIS

Il est possible depuis QGIS de générer des tuiles à partir de données vectorielles affichées dans le projet. Pour cela utilisez l'outil Outils rasters/Génère des tuiles XYZ (répertoire) dans la boîte à outil de traitements.

TP: Générez les tuiles à partir de la Carte physique de la France.

Ouvrez le projet fra_physical.qgs, dans data/mon_travail/3_lizmap/public. Ajoutez au projet la couche HILLSHADE_L93_FRANCE.tif (le fichier est situé dans le sous-répertoire donnees, au niveau du projet) pour ajouter un effet d'ombrage au relief. Affichez toutes les couches, y compris les limites de départements.

Avec l'outil Outils rasters/Génère des tuiles XYZ (répertoire) de QGIS, créez un nouveau répertoire de données tuilées, avec les paramètres suivants :

  • extent = Utiliser l'emprise du canevas
  • min zoom = 4
  • max zoom = 9
  • répertoire de destination = /home/sist/data/mon_travail/3_leaflet/tiles/FRAPHY
  • sortie html = /home/sist/data/mon_travail/3_leaflet/tiles/FRAPHY/leaflet.html

Inspectez le résultat en double-cliquant sur le fichier généré leaflet.html

Générer des tuiles en cache dans Lizmap

Dans le chapitre 3.2, nous avons vu comment configurer les couches dans une carte Lizmap pour obtenir des données tuilées et en cache (option Server tile cache plutôt que Single tile). Cela peut améliorer le temps d'affichage.

Les données tuilées sont générées au fil des demandes, quand les internautes se déplacent dans la carte, et conservée en "cache" sur le serveur. L'administrateur du site peut aussi choisir de générer les tuiles par le moyen d'une commande dans le terminal, avant même que la carte soit consultée. Quant à la suppression du cache, elle se fait par l'interface d'administration de Lizmap.

Pour en savoir plus, reportez-vous au chapitre Gestion du cache dans le manuel administrateur de Lizmap.

3.4.3. A RETENIR

  • Les tuiles cartographiques sont de petites images, au format JPG ou PNG, qui juxtaposées forment une carte.
  • Les tuiles sont généralement créées pour des niveaux de zoom (échelles) standard ; ainsi le niveau 0 correspond au monde entier et le niveau 20 à un immeuble.
  • Des producteurs de données publics et privés proposent des fonds de carte et de l'imagerie sous forme de tuiles, utilisables dans un site web ou dans QGIS.
  • Vous pouvez créer vos propres cartes tuilées avec la commande gdal2tiles, ou avec QGIS. Le 1er est plus adapté pour les cartes scannées et les orthophotos, le 2nd est utilisable sur des données vectorielles.