Vous l’avez peut être vu dans l’actualité, Google Maps a décidé de drastiquement augmenter ses prix et de limiter son utilisation gratuite. Le prix de certains services, comme la géolocalisation, a été multiplié par quatorze ! Google Maps a basé sa stratégie sur une facilité d’implémentation qui lui a permis de s’installer dans les applications de nombreuses entreprises. Cependant il est possible de mettre en place son propre système de cartographie et ainsi accéder à des coûts réduits et une flexibilité plus poussée.
Synaltic a réalisé, en partenariat avec la DJEPVA (Direction de la Jeunesse, de l’Éducation Populaire et de la Vie Associative), la plateforme data.asso afin de permettre à chacun de visualiser l’ensemble des associations françaises. Ce projet ambitieux s’inscrit dans une dynamique d’ouverture des données publiques à laquelle Synaltic désire participer.

Le site data.asso qui permet, entre autres, de visualiser les associations sur une carte, a permis à Synaltic de développer une expertise dans la réalisation de visualisations de données cartographiques. D’autres projets réalisés pour des clients ont nécessités d’utiliser des technologies plus poussées. En effet, les technologies classiques de cartographie sur navigateur n’arrivent pas à supporter des volumes de données importants. Dans cet article, nous allons faire un tour d’horizon des deux approches afin de comprendre les différences.

L’approche simple : Leaflet et les GeoJSON

Leaflet est une librairie open source Javascript qui permet de facilement intégrer une carte dans une application web. Grâce à cette librairie on peut facilement charger des données au format GeoJSON sur une carte, créer des interactions avec ces éléments et varier de manière dynamique les couches de données affichées.

Il est important de comprendre le fonctionnement technique de Leaflet afin de comprendre ses limites. Le fond de carte de Leaflet est importé au format vectoriel (par défaut depuis le serveur d’Open Street Map), les éléments GeoJSON sont ensuite ajoutés au DOM en tant qu’éléments SVG. Cette multiplication d’éléments est très coûteuse en performance.
Certaines techniques comme la clusterisation ou le chargement dynamique des éléments peuvent permettre de repousser les limites d’éléments affichés. Cependant, très rapidement on se retrouve limité dans les capacités de visualisation de données et le code source de l’application devient difficilement maintenable. Il faut donc changer la technologie de base afin  de construire des applications capables de supporter les charges des entreprises adeptes du Big Data.

L’approche avancée: Mapbox et les tuiles vectorielles

Mapbox GL est une entreprise privée qui a développé sa propre solution cartographique qui inclut une librairie Javascript similaire à Leaflet. La librarie est proposée librement à la communauté. Son architecture est basée sur WebGL et est réfléchie pour être utilisée principalement avec des tuiles vectorielles. Leaflet permet l’utilisation des tuiles vectorielles mais n’a pas été construit avec cette utilisation en tête et propose donc beaucoup moins de fonctionnalités natives dans ce sens. Les performances sur Mapbox GL sont nettement supérieures.
Au lieu de charger une carte puis d’y ajouter vos éléments, les éléments seront chargés directement dans des couches de la carte de manière dynamique (on charge les tuiles de la zone et du niveau de zoom actuels). Les tuiles sont pré-compilées sur le serveur et servies directement avec les données. Si l’on veut afficher certains éléments précis, il suffit alors de changer le style graphique des tuiles plutôt que d’enlever et ajouter des éléments.

Afin de maîtriser complètement son produit, il est important de mettre en place l’intégralité de l’architecture soi-même. Ainsi il faudra générer les tuiles de fonds de carte en plus de ses propres tuiles. Il faudra aussi mettre en place un serveur de tuiles qui pourra transmettre ces tuiles au navigateur. Enfin, il faut développer l’application web qui permette d’apporter une valeur ajoutée à l’utilisateur. Grâce à cette architecture, il est possible d’afficher des dizaines de milliers de points sur carte sans subir des ralentissements. On peut aussi afficher des données concernant des sections très précises de la carte, comme le cadastre par exemple.

Notre équipe de développement travaille actuellement sur différents projets de visualisation de données basés, entre autres, sur ces technologies. Nous avons développé une librairie Javascript qui surcharge Mapbox GL et qui nous permet de nous concentrer sur les logiques métiers des applications. Les possibilités amenées par ces technologies sont nombreuses: 3D, animations, sélection de zones, interactions utilisateur poussées. J’invite les plus curieux d’entre vous à regarder les exemples proposés par Mapbox GL comme ces majestueux bâtiments 3D dansants.
Synaltic a développé son offre dans ces technologies car nous sommes persuadés que de nombreuses utilisations pourraient amener de vrais atouts à nos clients. En plus de nos offres de développement d’applications web sur mesure, nous proposons maintenant les services de cartographie suivants:

• Hébergement et distribution de tuiles cartographiques (fonds de cartes, zones géographiques, open data etc…),
• Géocodage: Enrichissement de jeux de données en ajoutant les coordonnées géographique à partir d’adresses,
• Itinéraire: Calcul d’itinéraire d’un point A à un point B,
• Isochrone: Calcul de la zone accessibles en un temps précis par rapport à un point donné.

N’hésitez pas à nous contacter pour en savoir plus. Nous proposons ces services tels quels ou intégrés dans un projet client !

Raphaël Verdier