Les cartes vectorielles sont arrivées !

Mathieu-Daude Bertrand
Wemap
Published in
4 min readOct 24, 2017

--

Un article de la série “Dans la fabrique de Wemap”

Avec l’équipe technique de Wemap, nous avons récemment pris le temps de passer en revue le composant principal de notre application, notre ‘carte intelligente’ afin de réfléchir aux les améliorations qui rendraient notre carte plus élégante, plus puissante, sans perdre les avantages de sa rapidité.

La première évolution répondait à une demande récurrente sur le visuel et la navigation au sein de notre carte, comment rendre l’UX plus efficiente et plus agréable tout en évitant de surcharger le trafic entre l’utilisateur et le serveur ?

Notre précédente interface cartographique utilisait le principe dogmatique de la slippy map (carte glissante), une librairie javascript ayant la charge de rassembler des tuiles raster créées coté serveur, la carte étant découpée en petits fichiers d’images de 256px de côtés appelés et générés au fil de l’eau en fonction du niveau de zoom et de la navigation de l’utilisateur. La carte se limite à n’être qu’un fond, par dessus lequel nous chargeons les données de nos utilisateurs.

Avec les tuiles vectorielles, c’est un vrai changement de paradigme, les données de la carte (que ce soit des points, des polylignes ou des polygones, par exemple des points d’intérêts, des routes, des batiments) sont séparées du moteur de rendu. On n’échange plus des tuiles sous la forme d’images, mais des fichiers contenant pour chaque emprise géographique, toute la géométrie des couches, les attributs des objets, et bien d’autres informations en lien avec la tuile, et c’est au navigateur qu’est délégué la tâche de rendre le visuel de la carte via la technologie WebGL et les paramètres de style fixés par l’utilisateur.

Rendu de l’image par le navigateur via WebGL

Une tuile à l’échelle d’un quartier devient une mine d’informations qui va pouvoir être exploitée coté client pour accroitre l’expérience de l’utilisateur.

Exemples de contenus des tuiles vectorielles — Mapzen

Cette révolution a été possible grâce au travail de Mapbox qui a fournit les spécificités des tuiles vectorielles au format “ProtoBuf”, un format de compression des données optimal, permettant de construire des fichiers avec des tailles acceptables pour un échange client-serveur.

Après avoir rencontré les incroyables développeurs d’OSM2VectorTiles au “State Of The Map” Europe 2016, et constaté la maturité de cette technologie, nous avons décidés d’utiliser pleinement les tuiles vectorielles pour le coeur de l’application Wemap. Désormais nos serveurs nous permettent de fournir durablement des tuiles plus légères, plus rapides à charger, customisables, et aux contenus régulièrement mis à jour grâce à l’utilisation des contributions de la communauté Open Street Map.

Avec les tuiles vectorielles, le volume de données exploitable par l’intelligence de la carte est augmenté, le rendu est plus fluide, et en adéquation avec les écrans de haute résolution. Chaque niveau de tuiles peux condenser un maximum d’objets, permettant la visualisation dynamique de certaines informations ou la création de nouveaux éléments par l’utilisation de méthodes dérivées de l’analyse spatiale pour interagir avec les objets qui composent la carte, et rendre plus immersive la navigation de l’utilisateur.

exemple de navigation sur la carte Wemap

L’utilisation des tuiles vectorielles améliore grandement la qualité des cartes Wemap, et transforme l’expérience de navigation sur nos cartes connectées, en associant en profondeur la donnée spatiale au coeur de notre application tout en maintenant nos exigences sur sa rapidité et son efficacité.

Pour nos développeurs, l’arrivée des tuiles vectorielles devient synonyme de créativité, et nous espérons vous présenter rapidement de nouvelles et incroyables innovations !

Pour plus de détails sur la création de cartes interactives, ou pour une demande particulière, n’hésitez pas à me contacter @Mathieu-Daude Bertrand

***

Comment savoir ce qui se passe autour de nous ? Wemap aborde cette question avec une approche originale : offrir l’information locale via des cartes intelligentes combinant une expérience simple et des services pratiques. Aux côtés de milliers d’utilisateurs des grands noms tels que le Parisien, Ouest-France, le ministère de la Culture ont rejoint la plateforme créée par Wemap pour mieux informer et guider leur public.

Avec sa plateforme de cartes intelligentes Wemap atteint plus de 4 millions de visiteurs mensuels. Pour en savoir plus sur les cartes intelligentes Wemap et rejoindre la plateforme : https://getwemap.com/fr

--

--