Comment communiquer votre travail sous QGis à des partenaires qui n’ont pas d’outils SIG? Sous forme de page html consultable avec n’importe quel navigateur Internet, c’est l’option la plus pertinente.
Le plugin QSGis2Leaf fournit un moyen facile de distribuer et de visualiser votre travail QGIS sous forme de carte Web utilisant LeafLet.
Leaflet est une bibliothèque logicielle libre en JavaScript de cartographie interactive. Elle est notamment utilisée par le projet de cartographie libre OpenStreetMap.
Avec ce plugin, en quelques clics vous exportez votre projet QGis sous forme de page html. Vous créez un répertoire contenant la page index.html et des sous-répertoires avec tous ce qui est nécessaire pour visualiser votre carte.
Un projet QGIS classique contient des données différentes: vecteur, raster et plugins. QGIS2leaf exporte les couches vecteur en format GeoJSON crée la base de la carte web en utilisant la version actuelle de Leaflet(0.7.3). En plus, le plugin ajoute les données raster sous forme de superposition d’images avec un curseur d’opacité.
Installez le plugin QGis2Leaf à partir du gestionnaire de plugins (Extensions -> Gérer/Installer des extensions).
Le plugin est accessible à partir du menu Internet -> QGis2leaf
Généralités
Vous pouvez choisir entre plusieurs couches de fond de carte et définir l’étendue initiale de la carte, ainsi que les dimensions de la carte dans votre document HTML. Pour faciliter l’export de couches volumineuses, désactivez l’option de chargement automatique des données dans votre projet QGis. La carte web générée ayant un contrôle d’affichage des couches, vous pourrez les activer une fois terminé la création de la carte.
Il y a deux manières de faire avec le plugin:
- utiliser les options par défaut proposées par le plugin
- ou bien ajouter des possibilités en créant des colonnes attributaires dans les tables des couches
Nous allons prendre un exemple simple et utiliser les options par défaut du plugin, puis, dans un deuxième temps, nous allons ajouter des éléments avec des champs attributaires.
Prenons un exemple simple.
Le projet a deux couches:
- une couche vecteur avec les lieux-dits
- une couche raster avec la carte de 1940
Paramétrage du plugin
Nous allons créer notre carte web. Pour cela ouvrez la fenêtre de configuration du plugin.
Cliquez sur Get Layers pour charger les couches de votre projet dans la fenêtre de paramétrage.
Pour notre premier exemple, nous allons faire le plus simple possible.
La seule chose que nous allons utiliser est l’option « Create Opacity control« . Comme nous avons une couche raster dans notre projet, nous avons deux possibilités:
- faire que la couche raster soit le fond de carte fixe. pour cela on ne coche pas l’option pré-citée.
- définir un fond de carte à partir de la liste proposée dans Basemaps et ajouter un contrôle de transparence pour notre couche raster. En augmentant la transparence nous pourrons voir le Basemap à travers.
Nous cochons donc l’option « Create Opacity control » et nous sélectionnons, par exemple, OSM Standard comme Basemap.
Nous ajoutons un titre et un sous-titre et nous cliquons sur OK.
Vous pouvez voir la page html créée en cliquant ici. Vous pouvez voir l’utilisation du curseur d’opacité ainsi que l’affichage des attributs des points quand vous cliquez dessus. Le popup pour les entités est une simple table avec tous vos attributs.
Vous remarquerez que la symbologie des points n’est pas exportée. Les symboles sont remplacés par des points standard.
Nous allons donc voir les possibilités supplémentaires avec les champs attributaires.
Personnaliser les symboles
Pour les objets de type point( symboles simples, classées et graduées) le plugin exporte la taille (le rayon du symbole), la couleur et l’opacité. Malheureusement l’exportation de formes et symboles SVG n’est pas implémenté pour le moment.
Si vous souhaitez utiliser un symbole défini dans votre webmap, ajoutez un attribut ‘icon_exp’ à votre table attributaire. Le contenu de cette colonne sera un chemin relatif sur votre PC ou une déclaration HTML. Vous pouvez définir des icônes différentes pour chaque entité.
Si vous souhaitez communiquer votre page web à d’autres personnes, optez par des symboles accessibles par le web.
Pour affecter un symbole aux entités:
- ajoutez un champ nommé icon_exp à la table attributaire, de type texte et suffisamment long pour contenir l’adresse du symbole
- remplissez ce champ avec l’adresse à utiliser. Étant donné que chaque entité possède une occurrence de ce champ, chaque entité peut avoir un symbole différent.
Ce qui donne sur la table:
Du moment où le champ icon_exp existe, le plugin l’utilise pour la symbologie de la couche. Il n’est pas nécessaire d’activer de nouvelles options dans la fenêtre de paramétrage de l’export.
Ajouter des étiquettes
Nous allons maintenant ajouter les étiquettes des noms de lieux dans notre page en sortie.
Pour cela, vous ajouterez un champ ‘label_exp’ à votre couche qui va définir le texte à afficher dans l’étiquette.
Lors de la création du champ nous pouvons, comme dans l’exemple, remplir le champ avec le contenu d’un champ existant.
Si vous voulez que les étiquettes s’affichent pour toutes les entités sans action de la part de l’utilisateur, cochez l’option Extract labels dans la fenêtre du plugin.
Si vous voulez que l’étiquette de l’entité s’affiche quand la souris passe sur l’entité, cochez l’option Labels on hover. Les étiquettes ne seront pas toutes affichées par défaut.
Voici le résultat, en ajoutant l’option de recherche d’une adresse.
et le lien pour accéder à la page html générée.
Autres options
Vous pouvez remplacer la fenêtre popup des attributs des entités par une fenêtre html. Chaque entité peut alors avoir un popup différent. La définition de cette fenêtre se fait obligatoirement dans un champ nommé html_exp. Si ce champ existe, la fenêtre par défaut (table brute) est ignorée et ne s’affiche pour aucune entité.
Si vous voulez créer une légende avec différentes catégories, vous devez ajouter un champ legend_ico pour définir le symbole de la catégorie et un champ legend_exp pour contenir le texte associé à la catégorie.
Pour terminer, il y a une option « Encode to json« . Pour vos données, il est inutile de cocher cette case, car toutes vos données seront codés au format json. Cette option se réfère aux connexions WFS éventuelles de votre projet. Si vous avez des connexions WFS il y a deux possibilités:
- si la case n’est pas cochée, la page aura sa connexion WFS et devra obtenir les données à partir du fournisseur WFS
- si la case est cochée, les données seront téléchargées avant la création de la page html, et encodés au format json dans les fichiers de votre page. L’utilisateur qui affichera la page aura les données disponibles en local sans besoin de connexion WFS sur le fournisseur.
SUPER