Communiquez avec
des cartes
La cartographie interactive sur le Web
05/02/16Carto'CITÉ
Antoine Riche
Double compétence informatique / SIG
Core developper pour Smallword GIS
(1993-2012)
Créat...
05/02/16Carto'CITÉ
Usages d'une
carte interactive
05/02/16Carto'CITÉ
une carte = un message
05/02/16Carto'CITÉ
une carte = des données
05/02/16Carto'CITÉ
Une carte interactive
pour ...
Communiquer avec clarté
05/02/16Carto'CITÉ
Choix du fonds de carte
MapQuest Open
CartoDB DarkMatter Mapbox Satellite
OpenSeaMap
05/02/16Carto'CITÉ
Un contenu structuré
05/02/16Carto'CITÉ
Des informations détaillées
05/02/16Carto'CITÉ
Une carte interactive
pour ...
Orienter l'utilisateur
05/02/16Carto'CITÉ
Filtres et recherche dynamiques
05/02/16Carto'CITÉ
Recherche à proximité
05/02/16Carto'CITÉ
Calculs d'itinéraires
05/02/16Carto'CITÉ
Une carte interactive
pour ...
Analyser et décider
05/02/16Carto'CITÉ
Visualisation de données
05/02/16Carto'CITÉ
Evolution dans le temps
05/02/16Carto'CITÉ
Isochrones
05/02/16Carto'CITÉ
Une carte interactive
pour ...
Aller plus loin !
05/02/16Carto'CITÉ
Suivi de véhicules
Flightradar24
05/02/16Carto'CITÉ
Simulation de scénarios
05/02/16Carto'CITÉ
Remontée d'informations
05/02/16Carto'CITÉ
Une carte interactive …
Oui mais comment ?
05/02/16Carto'CITÉ
Pour faire une bonne carte
il faut ...
Des données Du logiciel
05/02/16Carto'CITÉ
OpenStreetMap
L'open data du territoire
05/02/16Carto'CITÉ
OSM = des données détaillées
OpenStreetMap Google Map Bing Map
05/02/16Carto'CITÉ
OSM = de multiples fonds de cartes
Open Topo Map
MapBox woodcutStamen WaterColour
Stamen TonerLite
05/02/16Carto'CITÉ
OSM sur data.gouv.fr
05/02/16Carto'CITÉ
Ils utilisent OpenStreetMap
et bien d'autres ...
05/02/16Carto'CITÉ
Autres sources de données
05/02/16Carto'CITÉ
Solutions logicielles
05/02/16Carto'CITÉ
Image Map HTML
05/02/16Carto'CITÉ
Image Map HTML
Usage
✔ Menu visuel pour accéder aux pages d'un site
Caractéristiques
✔ Pur HTML … qui p...
05/02/16Carto'CITÉ
Plugin WordPress : Maps Marker
05/02/16Carto'CITÉ
Plugin WordPress
Usage
✔ Positionner ses filiales ou ses clients sur un
site vitrine WordPress
Caractér...
05/02/16Carto'CITÉ
umap
05/02/16Carto'CITÉ
umap
05/02/16Carto'CITÉ
Usages
✔ Communiquer : valoriser un territoire, tourisme
✔ Orienter : évènement, logistique
✔ Dataviz s...
05/02/16Carto'CITÉ
Mapbox                   CartoDB
05/02/16Carto'CITÉ
Solutions cloud
Usages
✔ Communiquer : cartes personnalisées (Mapbox)
✔ Visualisation de données (Carto...
05/02/16Carto'CITÉ
Application cartographique
05/02/16Carto'CITÉ
Application cartographique
05/02/16Carto'CITÉ
Application cartographique
Usages
✔ Communiquer : territoire, tourisme, immobilier ...
✔ Orienter : fil...
05/02/16Carto'CITÉ
Des services à la carte
Une grande variété
✔ Fonds de carte : standards ou personnalisés
✔ Géocodage di...
05/02/16Carto'CITÉ
www.cartocite.fr
Antoine Riche
06 76 88 13 49
antoine.riche@cartocite.fr
@cartocite
Vous pouvez partage...
Prochain SlideShare
Chargement dans…5
×

Communiquez avec des cartes : a cartographie interactive sur le Web

2 534 vues

Publié le

Une bonne carte vaut mieux qu'un long discours. Interactive, la carte s'anime et devient un outil de communication efficace. Sur un site internet, une carte interactive oriente l'internaute et le rend acteur de sa navigation.

Cette conférence dresse un panorama des usages et atouts des cartes interactive, puis analyse plusieurs solutions Web au regard des objectifs d'une carte.

Publié dans : Internet
0 commentaire
1 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
2 534
Sur SlideShare
0
Issues des intégrations
0
Intégrations
675
Actions
Partages
0
Téléchargements
33
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive
  • J'ai voulu faire cette conf. car je vois trop de cartes qui se ressemblent et qui sont peu pratiques
    .
    Carte interactive sur site Web = outil de communication efficace 2 x : visuel + ludique
    .
    Un des rares éléments permettant à l'internaute d'interagir avec le site Web → diminution de l'effet rebond
    .
  • Développeur toujours dans le secteur de la cartographie
    .
    Expérience SW GIS : développement de services Web carto + client Web avec HTML5
    .
    Carto'CITÉ : la carte pour comprendre le territoire, la carte pour communiquer avec les citoyens.
  • Conf. en 2 temps :
    .
    - usages et atouts d'une carte INTERACTIVE, démo
    .
    - outils disponibles : familles de solutions, pas technique
    .
  • Mais avant : qu'est-ce qu'une carte ?
    .
    Pas qu'une image, une carte a un objectif : véhiculer un message (cartographe, statisticien)
    .
    Expliquer la carte : le choix d'inclure les humains donne une toute autre carte, un autre message
    .
    Je voudrais zoomer, voir les proportions relatives de mammifères
    .
  • Carte = représentation de données
    .
    Carte du PNB en Europe (données Eurostat) :
    - taille des carrés proportionnelle au PNB
    - couleur montrant le PNB / habitant
    .
    Synthèse claire : où est créée la richesse en Europe
    .
    On aimerait questionner la carte, voir les données : par un clic sur la carte, pas dans un grand tableau
    .
    → frustration
  • Carte interactive : réponse à ces questions
    .
    Carte interactive = nombreux avantages que nous allons passer en revue
    .
    Une carte peut avoir plusieurs objectifs : communiquer, orienter, analyser
    .
    Nous allons voir comment une carte interactive permet d'atteindre ces objectifs
    .
    Pour commencer : communiquer vers l'internaute → INFOS HIERARCHISEES : 3 NIVEAUX : fond de carte, données sur la carte, infos complémentaires
    .
    Plusieurs éléments à notre disposition
    .
  • 1. Choix du fond de carte
    .
    Participe au message porté par la carte
    .
    Choix selon la thématique, la place laissée aux données
    .
    Chargé ou épuré, avec ou sans toponymes, couleurs ou N&B, etc
    .
    Dizaines de fonds de carte, pas un meilleur que les autres : chacun adapté à un usage différent
    .
    Possible de laisser l'utilisateur choisir entre plusieurs fonds de carte, de les combiner par transparence
    .
  • 2. Données structurées
    .
    Contenu de la carte, propre à l'objectif de la carte
    .
    Structurer selon la thématique : calques = couches
    .
    Pictogramme et/ou couleur pour chaque calque
    .
    Légende, ici combinée avec le sélecteur de calques : cases à cocher
    .
    → l'utilisateur comprend vite ce que montre la carte, et comment s'en servir
    .
  • 3. Informations complémentaires
    .
    Clic sur un élément de la carte, ou hover sur zone
    .
    Popup ou encart sur le côté
    .
    Texte formaté, image, lien vers page Web, graphique, vidéo, fichier à télécharger (ex. horaire ligne de bus)
    .
    RECAP COMMUNIQUER : 3 niveaux – choix du fond de carte, contenu structuré, infos complémentaires – pour diffuser une information claire et complète
    .
    Source : http://umap.openstreetmap.fr/fr/map/lile-de-france-en-bandes-dessinees_26576
  • 2. carte pour orienter l'utilisateur
    .
    Aider un citoyen à trouver le service qu'il recherche
    ,
    aider un touriste à organiser ses vacances
    ,
    aider un consommateur à trouver un point de vente
    .
    Plusieurs outils qui peuvent être combinés entre eux → service sur mesure
    .
  • Données filtrées selon un ou plusieurs critères qui peuvent être combinés entre eux
    .
    Outil de recherche, qui permet de filtrer les données selon un critère libre
    .
    Carte Annuaire : plusieurs filtres combinés, recherche avec suggestions, interaction liste – carte
    .
    + que des filtres : aide pour trouver la structure qui correspond à un besoin
    .
  • Trouver des services (commerces, écoles, équipements sportifs etc.) autour d'un lieu
    .
    Rayon fixe ou défini par l'utilisateur
    .
    Lieu défini par géolocalisation
    .
    Agence immo Laforêt : aide les acheteurs à choisir leur lieu de vie
    .
    Le long d'un itinéraire - ex. hôtels sur la route des vacances
    .
    Dans une zone : bibliothèques d'un quartier, sentiers d'un parc naturel, etc
    .
    Source : http://www.laforet.com/
  • Lieu identifié → itinéraire pour s'y rendre
    .
    Mode(s) de transport, PMRs
    .
    Comparaison de plusieurs itinéraires, ajout d'étapes, export vers GPS ou smartphone
    .
    Rien de neuf : Mappy, Via Michelin
    .
    CIRCUIT : MoodWalkr (Makina Corpus) : l'utilisateur choisit la durée et le thème (shopping, culture, espaces verts)
    .
    RECAP ORIENTER : filtres, recherche à proximité, itinéraires
    .
    Source : http://moodwalkr.makina-corpus.net/
  • 3. Outil d'aide à la décision
    .
    Majorité des données « géoréférencées » d'une manière ou d'une autre → pertinent de « faire parler » les données sur une carte
    .
    → domaine de la visualisation de données, discipline en plein essor à l'heure du big data
    .
    Je fais pas un exposé sur la dataviz
    .
    Je vais montrer ce qu'apporte l'interactivité à la visualisation de données : aide pour comprendre des données volumineuses et variées
    .
    DEMO
    .
  • Carte interactive : comparer facilement, choisir une variable, un mode de visualisation
    .
    Pour comprendre un phénomène, analyser ses causes
    .
    Illustreets : qualité de vie d'un quartier : déplacer la souris sur un ilôt → infos sur l'encart à gauche
    .
    Carte interactive → choix des données par l'utilisateur
    .
    Possible et efficace avec les technos Web actuelles
    .
    Source : http://illustreets.co.uk/explore-england/
  • Evolution de la taxe foncière entre 2001 et 2012, par communes
    .
    Carte réalisée par le collectif Regards Citoyens à partir de données ouvertes (nosdonnes.fr)
    .
    Carte interactive → évolution d'une variable dans le temps, et ici comparer entre plusieurs communes
    .
    Source: http://www.nosfinanceslocales.fr/
  • Connaissez-vous les isochrones ?
    .
    Courbe isochrone = ligne d'égale durée de déplacement par rapport à un point de départ, en s'appuyant sur le réseau routier
    .
    Carte interactive → faire varier les paramètres : point(s) de départ, heure de départ et durée, mode de transport
    .
    RECAP DATAVIZ : concentrer en une seule carte énormément d'informations, permetttre à l'utilisateur de choisir, comparer et analyser
    .
    Si on utilisait des cartes statiques : atlas volumineux
    .
    Source: http://www.flaviogortana.com/isoscope/
  • 4. Pour finir sur les usages des cartes interactives
    .
    Quelques exemples où l'interactivité permise aujourd'hui par le Web montre tout son intérêt
    .
  • Flux de données localisation GPS de véhicules → déplacement sur la carte en quasi temps réel (en déplaçant les marqueurs)
    .
    FlightRadar24 : position des avions en vol
    .
    L'utilisateur peut afficher les informations sur un vol : aéroports de départ et destination, altitude, vitesse
    .
    Il peut définir des filtres : seulement les avions partant ou arrivant d'un aéroport, volant à une certaine altitude, etc
    .
    Possible pour véhicules routiers, trains, bateaux, etc
    .
    Source : http://www.flightradar24.com
  • Carte réalisée par Data Publica
    .
    Découpage des régions en fonction des mobilités professionnelles entre départements
    .
    L'utilisateur choisit le nombre de régions → nouveau découpage
    .
    Interactivité → passer d'un scénario à l'autre facilement
    .
    Source: http://labs.data-publica.com/regionator3000/
  • Dernier exemple
    .
    Géolocalisation : remontée d'infos par les usagers en mobilité
    .
    FixMaVille (DataForPeople) : signaler des incidents sur la voirie aux services techniques, qui peuvent les visualiser sur une carte
    .
    Même principe pour d'autres types d'informations et d'autres usages
    .
    RECAP : communiquer, orienter l'utilisateur, aide à la décision, suivi de véhicules
    .
    Interactivité : internaute lecteur → acteur
    .
  • Vous avez tous envie d'une carte interactive pour votre site internet
    .
    Vous êtes tous convaincus qu'une carte va vous permettre de mieux communiquer sur vos projets
    .
    De mieux orienter vos clients
    .
    De mieux comprendre vos données
    .
    Cartes interactives : atout pour votre activité
    .
    Mais comment fait-on ?
    Quels outils utiliser ?
    Quelles données ?
  • CLIC
  • Avant tout : définir l'objectif de la carte, identifier qui va utiliser la carte, cibler une audience
    .
    Contrètement – techniquement – 2 ingrédients
    .
    1. Des données : fond de carte, données propres à la carte, données qui donnent un contexte (ex. limites admin)
    .
    2. Du logiciel : afficher ces données, naviguer dans la carte, fournir des services (ex. calculs d'itinéraires)
    .
    Commençons par les données
    .
  • Bcp de donneés Open Data
    .
    Ressource que j'affectionne particulièrement : OSM
    .
    QUESTION : qui parmi vous connaît OSM ?
    .
    OSM = carte collaborative produite et tenue à jour par des 10'000 de bénévoles ;
    OSM = carte d'une grande richesse ;
    OSM = plus qu'une carte une BD
    .
    BD sous licence libre : libre d'extraire et réutiliser, pour produire des cartes ou ce qu'on veut
    .
    Certains utilisent OSM pour créer des œuvres d'art
    .
    OSM = c'est l'open data du territoire.
  • Cartes OSM, Google, Bing : même zone et même échelle
    .
    Détails du terrain : escaliers, Bicloo, arbres
    .
    Ce qui fait vivre un territoire : commerces, restos, arrêts de bus
    .
    Trop d'informations, peu clair ?
    → Bien comprendre qu'OSM est avant tout une BD
    .
    Cette BD permet de produire plusieurs fonds de carte
    .
    Les données peuvent être extraites et réutilisées, mises en valeur sur la carte : arrêts de bus, appuis-vélos, DABs etc. (cf. agence immo La Forêt)
  • Plusieurs dizaines de fonds de carte en ligne créées à partir des données OSM
    .
    Cartes des plus épurées aux plus détaillées, certaines plutôt artistiques comme le style « aquarelle » de Stamen Design
    .
    La plupart utilisables en fond de carte gratuitement
    .
    On peut créer ses propres fonds de carte : plusieurs outils existent
    .
    OSM = immense écosystème de logiciels (libres et gratuits pour la plupart)
    .
    + entreprises qui fournissent des services utilisant les données OSM.
  • OSM = une source de données ouvertes reconnue par l'état
    .
    Plate-forme open data du gouvernement : + de 20 jeux de données fournis par OSM
    .
    Limites admin, réseau autoroutier, lignes RER, etc
    .
    Certains jeux de données sont certifiés, ex. cartographie des gares du SNCF Transilien (accéssibilité aux PMRs)
    .
  • Des structures, publiques, associatives et privées, utilisent OSM
    .
    Collectivités territoriales : pour communiquer avec leurs citoyens, et faire communiquer les citoyens entre eux
    .
    Services de secours, qui apprécient une carte à jour et précise
    .
    GéoVélo, qui utilise les données OSM pour calculer des itinéraires pour vélos
    .
    Entreprises petites et grosses, ex. agences immo Laforêt, Flickr, Pinterest
    .
    2012 : FourSquare passe de Google Maps à OSM → coût, beauté des carte, flexibilité, pérennité.
  • Je pourrais parler d'OSM pdt des heures
    .
    Autres sources de données :
    données libres, niveau local, national, européen, GEOVENDEE
    .
    données statistiques, météo, transport
    .
    données géoréférencées ou qui peuvent l'être
    .
    CLIC
    .
    Des données il en existe chez vous !
    .
    Fort à parier qu'elles sont ou peuvent être géolocalisées → placées sur une carte
    .
  • Pour visualiser ces données, pour créer une carte claire et ergonomique, de quels outils dispose-t-on ?
    .
    Ils sont nombreux : je ne vais pas les énumérer
    .
    Pas de solution propriétaire : solutions OPEN SOURCE car flexible et pérenne + communauté dynamique (soutenue par une fondation)
    .
    Je vais citer quelques solutions de différentes catégories
    .
    Pas de détails techniques
    .
    Principales caractéristiques de chaque famille de solutions & usages adaptés à chacune.
  • 1e solution pour le développeur Web : Image Map
    .
    Image (carte ou autre) + zones qui découpent l'image, chacune associée à un hyperlien
    .
    Bien pour des images simples
    .
    Compliqué pour une carte comme les USA : il faut définir le contour de chaque état
    .
    Pas adapté si zones grandes et petites : difficile de sélectionner les états de la côte Est
    .
    Si vous changez d'image il faut tout recommencer
    .
  • Solution simple en apparence
    .
    Deux inconvénients majeurs :
    - pas responsive : si l'image est plus grande que l'écran pas ergonomique
    .
    - difficile à maintenir : si on décide de changer d'image il faut redéfinir toutes les zones !
    .
    Usage : alternative aux menus classiques
    .
  • Plugins carto pour WordPress : MapsMarker
    .
    Projet actif, déployé 40000+ fois, bien intégré à WP
    .
    Choix de fonds de carte (Google ou OSM), grand choix de pictos
    .
    Back-end WP pour configurer la carte, définir ou importer des marqueurs d'un fichier
    .
    Insertion d'itinéraire mais pas de calcul d'itinéraire pour l'utilisateur, pas de filtre ou de module de recherche
    .
  • OK pour placer des marqueurs sur une carte intégrée à un site Web : filiales d'une société, membres d'un réseau
    .
    A condition qu'il n'y en ait pas trop : pas de filtre ni de recherche
    .
    Solution bien intégrée à WP, à partir de 29 €
    .
    Nombreux plugins de carto pour CMS, +/- complets
    .
    Assez limités en terme de fonctionnalités.
  • Vous avez peut-être déjà vu cette carte ?
    .
    Carto-crise : carte des festivals et évènements culturels annulés
    .
    Reprise par les grands médias nationaux, du Figaro au Monde, de Ouest-France à France Culture
    .
    Visionnée + 900 000 fois
    .
    Produite collaborativement et régulièrement complétée
    .
    Réalisée sur un logiciel en ligne : umap
    .
    Autre carte umap célèbre : « Je suis Charlie », visionnée plus de 200 000 en 24 H.
  • umap = service en ligne libre et gratuit
    .
    Créer des cartes personnalisées sans coder
    .
    Pendant open source à MyMaps de Google
    .
    + de fonctionnalités, comme le montrent ces exemples de cartes que j'ai réalisées avec umap
    .
    Données structurées sur plusieurs calques
    .
    Import depuis un fichier ou par une requête
    .
    Ajout d'images, de vidéos, etc.
  • Carte umap : hébergée sur un serveur OSM-FR
    .
    Carte intégrée à un site Web par une iframe : peut être intégrée à un site WP
    .
    Entièrement gratuit
    .
    Solution assez complète pour communiquer, organiser un évènement, simuler un scénario
    .
    Filtre par les calques uniquement, pas de recherche
    .
    Si bcp de données sur la carte, peu efficace pour orienter l'internaute.
  • Mapbox & CartoDB : 2 enterprises de l'écosystème OSM, offre Cloud intéressante
    .
    Mapbox pour créer des fonds de cartes avec les données OSM + ses données, définition de styles : de très belles réalisations
    .
    Les cartes créées peuvent être copiées sur votre serveur ou publiées sur le cloud Mapbox. Elles peuvent alors être intégrées à votre site Web (iframe ou code JS)
    .
    CartoDB : cartes sur le cloud, spécialisé dans la visualisation de données
    .
    carte HELLO DATA
    .
    Solutions complémentaires qui peuvent être combinées
    .
  • Mapbox & CartoDB : soit pour des besoins assez pointus de design de carte ou de visualisation de données
    ,
    soit si un grand nombre d'utilisateurs est attendu : solution cloud solide
    .
    Freemium / abonnement mensuel à partir de 49 $ pour Mapbox, 29 $ pour CartoDB
    .
    Nombreuses entreprises Google → Mapbox ou CartoDB (FourSquare, Pinterest) : coût, solutions open source, donc plus ouvertes et plus pérennes
    .
    Grands médias utilisant MapBox : le Monde, Guardian, Washington Post.
  • Dév spécifique pour adapter les fonctionnalités à l'objectif de la carte et à ses données
    .
    Plus grande clarté, meilleure ergonomie → communication claire et meilleur service pour l'internaute
    .
    J'ai développé cette carte avec Leaflet : open source et « mobile friendly », responsive et légère
  • Autre carte : géocodage + recherche + itinéraire
    .
    Que des outils et des données libres : BAN + OSM + Graphhopper
    .
    Un peu de code → véritable application carto qui s'exécute sur le navigateur Web.
  • Avantage de Leaflet ou OpenLayers : pouvoir développer une véritable application carto
    .
    Adaptée aux objectifs de la carte et aux données
    .
    Filtres, recherche, calcul d'itinéraires, etc
    .
    L'application peut être intégrée au site Web de l'entreprise voire à son SI
    .
    Solution pérenne et évolutive
    .
    On pourra répondre à un grand nombre de cas d'usages. Principale limite : l'imagination
    .
    Enfin : services Web pour enrichir les fonctionnalités de la carte
  • Pas que Google qui propose des services Web carto
    .
    Plusieurs entreprises en proposent, beaucoup utilisent les données OSM
    .
    Offre premium, et même leur offre la + complète est - chère que Google : MapBox 500 $ / mois max
    .
    Nombreux services gratuits : fondation OSM, association OSM-FR, gouvernement, SNCF, etc
    .
    Nombreuses solutions open source et documentées, peuvent être déployées sur des serveurs avec vos données
    .
    Tout dépend des besoins et des ambitions du projet.
  • Voilà pour un rapide panorama des usages d'une carte interactive : communiquer, orienter l'internaute, visualiser des données
    .
    Voilà pour un rapide panorama des solutions disponibles : données et logiciels
    .
    J'espère que cette présentation a répondu à vos attentes, qu'elle ouvre des perspectives pour votre activité
    .
    Présentation disponible en open data sur mon slideshare, licence Creative Commons
    .
    Avez-vous des questions ou des remarques ?
  • Services Web : Google Maps API
    .
    Nombreux, solides, bénéficient de l'infrastructure de Google
    .
    On peut créer des fonds de cartes personnalisées, à partir des données Google
    .
    Avant d'investir dans le dév d'une appli carto basée sur Google il faut se poser quelques questions : ce n'est pas gratuit
    .
    Des entreprises en ont fait l'expérience : payer plusieurs 100 000 $ à Google
    .
    Elles ont vite cherché et trouvé des alternatives.
  • Communiquez avec des cartes : a cartographie interactive sur le Web

    1. 1. Communiquez avec des cartes La cartographie interactive sur le Web
    2. 2. 05/02/16Carto'CITÉ Antoine Riche Double compétence informatique / SIG Core developper pour Smallword GIS (1993-2012) Création de Carto'CITÉ (2014) Carto'CITÉ Carte, territoire et citoyens Géomatique et cartographie Web Formations OpenStreetMap www.cartocite.fr @cartocite
    3. 3. 05/02/16Carto'CITÉ Usages d'une carte interactive
    4. 4. 05/02/16Carto'CITÉ une carte = un message
    5. 5. 05/02/16Carto'CITÉ une carte = des données
    6. 6. 05/02/16Carto'CITÉ Une carte interactive pour ... Communiquer avec clarté
    7. 7. 05/02/16Carto'CITÉ Choix du fonds de carte MapQuest Open CartoDB DarkMatter Mapbox Satellite OpenSeaMap
    8. 8. 05/02/16Carto'CITÉ Un contenu structuré
    9. 9. 05/02/16Carto'CITÉ Des informations détaillées
    10. 10. 05/02/16Carto'CITÉ Une carte interactive pour ... Orienter l'utilisateur
    11. 11. 05/02/16Carto'CITÉ Filtres et recherche dynamiques
    12. 12. 05/02/16Carto'CITÉ Recherche à proximité
    13. 13. 05/02/16Carto'CITÉ Calculs d'itinéraires
    14. 14. 05/02/16Carto'CITÉ Une carte interactive pour ... Analyser et décider
    15. 15. 05/02/16Carto'CITÉ Visualisation de données
    16. 16. 05/02/16Carto'CITÉ Evolution dans le temps
    17. 17. 05/02/16Carto'CITÉ Isochrones
    18. 18. 05/02/16Carto'CITÉ Une carte interactive pour ... Aller plus loin !
    19. 19. 05/02/16Carto'CITÉ Suivi de véhicules Flightradar24
    20. 20. 05/02/16Carto'CITÉ Simulation de scénarios
    21. 21. 05/02/16Carto'CITÉ Remontée d'informations
    22. 22. 05/02/16Carto'CITÉ Une carte interactive … Oui mais comment ?
    23. 23. 05/02/16Carto'CITÉ Pour faire une bonne carte il faut ... Des données Du logiciel
    24. 24. 05/02/16Carto'CITÉ OpenStreetMap L'open data du territoire
    25. 25. 05/02/16Carto'CITÉ OSM = des données détaillées OpenStreetMap Google Map Bing Map
    26. 26. 05/02/16Carto'CITÉ OSM = de multiples fonds de cartes Open Topo Map MapBox woodcutStamen WaterColour Stamen TonerLite
    27. 27. 05/02/16Carto'CITÉ OSM sur data.gouv.fr
    28. 28. 05/02/16Carto'CITÉ Ils utilisent OpenStreetMap et bien d'autres ...
    29. 29. 05/02/16Carto'CITÉ Autres sources de données
    30. 30. 05/02/16Carto'CITÉ Solutions logicielles
    31. 31. 05/02/16Carto'CITÉ Image Map HTML
    32. 32. 05/02/16Carto'CITÉ Image Map HTML Usage ✔ Menu visuel pour accéder aux pages d'un site Caractéristiques ✔ Pur HTML … qui peut alourdir une page ✔ OK pour toute image ✔ Lié à la taille et au contenu de l'image
    33. 33. 05/02/16Carto'CITÉ Plugin WordPress : Maps Marker
    34. 34. 05/02/16Carto'CITÉ Plugin WordPress Usage ✔ Positionner ses filiales ou ses clients sur un site vitrine WordPress Caractéristiques ✔ Configuration dans le back-end WordPress ✔ Import de données CSV/XLS/ODS et KML ✔ Bon choix de fonds de cartes et de marqueurs ✔ Peu de fonctionnalités (ni filtre ni recherche)
    35. 35. 05/02/16Carto'CITÉ umap
    36. 36. 05/02/16Carto'CITÉ umap
    37. 37. 05/02/16Carto'CITÉ Usages ✔ Communiquer : valoriser un territoire, tourisme ✔ Orienter : évènement, logistique ✔ Dataviz simple : clustering et cartes de densité ✔ Simuler un scénario, raconter une histoire umap Caractéristiques ✔ Gratuit et open source, prêt à l'emploi ✔ Intégration sur un site Web par une iframe ✔ Données structurées et popups personnalisées ✔ Import de données : fichiers ou services Web
    38. 38. 05/02/16Carto'CITÉ Mapbox                   CartoDB
    39. 39. 05/02/16Carto'CITÉ Solutions cloud Usages ✔ Communiquer : cartes personnalisées (Mapbox) ✔ Visualisation de données (CartoDB) ✔ Pour un grand nombre de visites  ✔ Pour de gros volumes de données Caractéristiques ✔ Solutions cloud performantes et populaires ✔ Freemium et 1ers  abonnements économiques ✔ Mapbox & CartoDB peuvent être combinés ✔ APIs pour intégrer à une application Web
    40. 40. 05/02/16Carto'CITÉ Application cartographique
    41. 41. 05/02/16Carto'CITÉ Application cartographique
    42. 42. 05/02/16Carto'CITÉ Application cartographique Usages ✔ Communiquer : territoire, tourisme, immobilier ... ✔ Orienter : filtres, recherche, géocodage, routage ✔ Visualisation de données statiques ou  évolutives  ✔ Suivi de véhicules, remontée d'informations ... Caractéristiques ✔ Développement Web avec librairies Javascript ✔ Large choix d'APIs et de plugins ✔ Design et ergonomie adaptés aux objectifs ✔ Intégration possible au Système d'Information
    43. 43. 05/02/16Carto'CITÉ Des services à la carte Une grande variété ✔ Fonds de carte : standards ou personnalisés ✔ Géocodage direct/inverse, recherche à proximité,  suggestion « à la volée », géolocalisation ✔ Itinéraires : mode(s) de transport, contraintes,  optimisation de tournée, trafic, isochrones  Une offre abondante  ✔ Services libres : OpenStreetMap, data.gouv.fr, SNCF ... ✔ Entreprises : Mapquest, Stamen, Mapbox, CartoDB ... ✔ Solutions open source déployées sur vos serveurs
    44. 44. 05/02/16Carto'CITÉ www.cartocite.fr Antoine Riche 06 76 88 13 49 antoine.riche@cartocite.fr @cartocite Vous pouvez partager et adapter cette présentation à condition de l'attribuer à son auteur et de partager vos adaptations dans les mêmes conditions. Retrouvez cette présentation sur  http://fr.slideshare.net/cartocite http://creativecommons.fr/

    ×