Créer des cartes interactives avec un GeoJSON dans Powerslide

Dernière mise à jour : 30/07/2021

Les cartes interactives sont un moyen simple et efficace de faire comprendre ses données à son auditoire. Le GeoJSON a été créé afin de faciliter la modélisation de cartes et plus généralement de données géographiques en informatique. Dans cet article, nous vous montrerons comment tirer profit de ce format de fichier pour mettre en avant vos données.

geojson

Qu’est-ce qu’un GeoJSON ?

« GeoJSON » signifie en anglais « Geographic JSON », c’est-à-dire « JSON géographique » qui est un format de fichier permettant de décrire des données géographiques et spatiales comme des points, des lignes, des polygones et des chaînes de caractères. Il permet également d’associer à ces données, des informations non géographiques en utilisant le format JSON (JavaScript Object Notation). 

Il se présente sous la forme d’un objet JSON avec différents attributs, comme dans l’exemple ci-dessous.

Exemple de GeoJSON

Il doit obligatoirement commencer par le type du fichier, qui doit être "FeatureCollection". Les différents éléments contenus sur la carte décrite par le GeoJSON seront listés dans l’attribut features, qui est un tableau d’objets. Voici une description des attributs que doivent comporter tous les éléments de ce tableau :

  • type: "Feature" (type de l'élément).
  • properties: propriétés associées à cet élément. Il peut y avoir autant de propriétés que vous le souhaitez et vous pouvez leur attribuer les noms et valeurs que vous voulez.
  • geometry : description de la forme de l’élément. Contient les attributs :
    • type : type d’élément. "Point", "LineString" ou "Polygon".
    • coordinates : tableau des coordonnées des points constituant la forme.

Comment obtenir un GeoJSON ?

Il existe de nombreuses sources de fichiers GeoJSON sur Internet. Mais si vous avez des besoins spécifiques, il est possible de créer son propre GeoJSON.

GeoJSON existants

Comme indiqué dans notre tuto sur les cartes interactives dans Powerslide, pour trouver les GeoJSON dont vous avez besoin pour générer vos cartes interactives, vous pouvez vous rendre sur des sites proposant des fichiers GeoJSON libres de droits et gratuits comme :

Mais si vous ne trouvez pas le GeoJSON dont vous avez besoin, ou si vous souhaitez utiliser une carte de vos bâtiments ou d’un lieu particulier, vous pouvez créer votre propre fichier GeoJSON.

Créer un fichier GeoJSON

Dans le cas où vous souhaitez générer votre GeoJSON à partir d’une carte de vos locaux, d’un bâtiment ou autre, une solution simple est d’utiliser geojson.io. En effet, cet outil en ligne permet de générer des GeoJSON simplement en dessinant les éléments qu’on veut représenter (points, lignes, polygones, …). 

Pour créer une carte de vos locaux par exemple, zoomez sur votre bâtiment, puis tracez les différents espaces qui le composent grâce aux outils disponibles. Dans la vidéo ci-dessous, vous pourrez voir comment générer le GeoJSON d’un supermarché (le tracé réalisé est fictif).

 

Vous pouvez également constater dans la vidéo que pour ajouter des éléments à l’attribut “properties” décrit dans la première partie de cet article, vous pouvez cliquer sur l’élément concerné et ajouter la clé de la propriété ainsi que sa valeur dans les lignes du tableau. Geojson.io crée déjà des propriétés de façon automatique pour décrire l’aspect visuel des éléments, j’ai ajouté pour notre exemple l’attribut rayon qui permettra d’identifier les lignes de données correspondant aux éléments dessinés sur le GeoJSON. Pour télécharger le GeoJSON ainsi créé, cliquez sur Save puis GeoJSON. 

Et voilà, votre GeoJSON est prêt, il ne reste plus qu’à l’intégrer à Powerslide pour créer votre carte interactive.

Utiliser un GeoJSON pour créer des cartes interactives dans Powerslide

Voici le Powerslide que nous avons pu créer à partir du GeoJSON précédemment créé et d’un jeu de données contenant la colonne rayon que nous avons ajouté dans les “properties” du GeoJSON:

Vous pouvez cliquer sur le slide, c'est un Powerslide !

Voyons comment faire pour utiliser le GeoJSON téléchargé à l'étape précédente de cette façon.

Importer un GeoJSON

Pour créer une carte interactive dans Powerslide à partir d’un GeoJSON, il faut tout d’abord importer la source de données qui alimentera votre carte. Cliquez sur l’en-tête de la colonne qui permettra de distinguer les zones (dans notre cas, "rayon"), puis choisissez le type geo. Le menu pour choisir l’un des GeoJSON disponible dans Powerslide ou importer votre propre GeoJSON s’affichera alors. 

Cliquez sur + pour importer votre fichier GeoJSON et sélectionnez-le dans l’explorateur. Si ce n’est pas le bon attribut du fichier qui est sélectionné pour l’attribution des zones à chaque ligne de donnée, cliquez sur l’élément et utilisez le menu déroulant pour sélectionner le bon attribut. Une fois la source de données bien paramétrée, sauvegardez les modifications et vous pouvez commencer à créer votre carte interactive. Toutes ces étapes sont visibles sur la vidéo se trouvant à la fin de cet article.

Créer une carte interactive

Comme vous pourrez le voir dans la vidéo ci-dessous, pour générer la carte interactive correspondant à votre GeoJSON, créez un nouveau slide puis glissez et déposez la colonne de données que vous avez paramétrée sur votre présentation (dans notre cas “rayon”), ainsi que la mesure que vous souhaitez afficher sur la carte (ici la colonne “CA”). Elle sera alors automatiquement générée.  

Vous disposerez alors d’un panel d’options afin de configurer votre carte. Vous pourrez choisir : 

  • De laisser ou non le fond de carte 
  • Si l’échelle de couleur doit s’adapter ou pas aux filtres appliqués 
  • De mettre la carte à jour à chaque filtre 
  • La couleur de début de l’échelle de couleur 
  • La couleur de fin de l’échelle 
  • Celle des lignes où il n’y a pas de valeur 
  • D’afficher ou non la légende de la carte 
  • La position de la légende si elle est affichée

 

En conclusion, 

Les cartes permettent à notre auditoire de visualiser rapidement nos données. Le format GeoJSON a été créé pour faciliter la manipulation et la création de celles-ci. Avec Powerslide, utiliser des fichiers GeoJSON pour matérialiser vos données sous forme de cartes interactives devient un jeu d’enfant.

Vous aussi, mettez en avant vos données avec des cartes interactives !

Découvrez Powerslide