Slide 1

Slide 1 text

Les alternatives libres à Google Maps Mathieu Leplatre @leplatrem www.makina-corpus.com

Slide 2

Slide 2 text

Une longue liste d'utilisations interdites * mode déconnecté, embarqué * géocodage en masse * applications non ouvertes au public (e.g. intranet, extranet) * applications payantes * afficher de grandes cartes * suivre des flottes, des livraisons... ...

Slide 3

Slide 3 text

Une longue liste d'utilisations interdites... et encore... * mettre les tuiles en cache * fournir des services de navigation * impressions commerciales * utilisation hors API * hors d'un navigateur * ...

Slide 4

Slide 4 text

Des utilisations impossibles * maîtriser ce qu'affiche l'API * paramétrer les éléments affichés * définir un style complet * accéder aux données brutes (seulement à des images)

Slide 5

Slide 5 text

De nombreuses limitations * erreurs difficiles voire impossible à corriger * usage payant si fort trafic * esthétique : des cartes trop vues * philosophie : des données propriétaires

Slide 6

Slide 6 text

Principaux services de Google Maps * fonds de carte (tuiles) * visionneuse interactive (API javascript) * publication aisée dans une page web * géocodage * itinéraires * cartes statiques

Slide 7

Slide 7 text

Les solutions libres offrent les mêmes services Open source/Open data Google * fonds de carte (tuiles) ✔ ✔ * visionneuse interactive ✔ ✔ * publication web simple ✔ ✔ * cartes statiques ✔ ~ * géocodage ~ ✔ * itinéraires ~ ✔

Slide 8

Slide 8 text

Les solutions libres sont plus souples Open source/Open data Google * choix des styles ✔ ~ * modification/correction ✔ ~ * impression de cartes ✔ * cartes en mode déconnecté ✔ * applications mobiles ✔ * ajout de tout type de données ✔ * choix des données visualisées ✔ * choix de la langue des tuiles ✔

Slide 9

Slide 9 text

Google Maps a révolutionné les cartes interactives Il faut réutiliser les meilleurs principes

Slide 10

Slide 10 text

Fonds de carte L'approche Google Maps : des compromis ! * une seule projection : Mercator sphérique (900913,WGS 84) * une seule couche ! * du cache pour la rapidité →Rupture avec la plupart des portails Web SIG

Slide 11

Slide 11 text

Les données OpenStreetMap * créé en 2004 (Absence données libres) * édition collaborative (cf. Wikipedia) * free tagging (~NoSQL) * données WGS 84 (GPS) * API REST (moult éditeurs)

Slide 12

Slide 12 text

Serveur de tuiles OpenStreetMap nomstyle/z/x/y.png PostGIS Mapnik Apache + feuilles de style + mod_tile OSM scripts dump + diffs

Slide 13

Slide 13 text

Serveur de tuiles Makina Corpus * autonomie (ex : utilisation commerciale) * styles personnalisés (ex : charte, filtres) * produits dérivés (ex : packs, application voyage) * mobile (ex : offline) * R&D (ex : outils BI) ... à l'écoute de vos besoins !

Slide 14

Slide 14 text

Style par défaut - OpenStreetMap

Slide 15

Slide 15 text

Style, contenu, langue, symboles... ... tout est paramétrable

Slide 16

Slide 16 text

Style allégé – Makina Corpus

Slide 17

Slide 17 text

Style MapQuest

Slide 18

Slide 18 text

Visionneuse L'approche Google Maps : * rapidité (légèreté) * ergonomie (pan, molette) * simplicité ( sans arborescence) * compatibilité (navigateurs, mobiles) … quelles sont les solutions libres équivalentes ?

Slide 19

Slide 19 text

OpenLayers (Metacarta, 2006) + très populaire + support protocoles OGC + gestion des projections + compatibilité - 1 Mo (!) - lenteur - tuiles chargées x8 - HTML généré archaïque - GeoExt :(

Slide 20

Slide 20 text

Modest Maps JS (Stamen Design, 2011) + léger ( ~80 ko) + ultra-rapide et robuste + support mobile - sans support vectoriel - sans interaction - une seule couche :)

Slide 21

Slide 21 text

Leaflet (Cloudmade, 2011) + léger (100 ko) + API simplifiée (à-la GMaps) + mobile (multitouch+accel. sur iOS) + HTML5 Canvas (ex : 2M objets) + projections + CSS3 & Animations + compatible IE6 :) - Tuiles ou GeoJSON/WMS - édition : élémentaire

Slide 22

Slide 22 text

Illustrations * Carte VéloToulouse : Leaflet + Mustache + YQL * Livetitude : Leaflet + HTML5 websockets * Gr@ce : Leaflet + HTML5 WebSQL et LocalStorage (offline)

Slide 23

Slide 23 text

Comment publier ses données ? L'approche Google Maps : culture du Web * Consultation d'une carte comme une page web ! * Partage d'une carte comme une image * Survol des objets en Javascript ... en rupture avec la plupart des portails Web SIG

Slide 24

Slide 24 text

Comment publier ses données ? L'approche privilégiée chez Makina Corpus GeoServer GeoExt OpenLayers GeoNetwork ~ Mo ~ Mo ~ Go Django* JQuery Leaflet + Mapnik ~ Mo ~ Ko ~ Ko

Slide 25

Slide 25 text

Le projet MapBox (DevelopmentSeed, 2011) * Orienté communication (statique, OpenData) * TileMill (MSPaint des cartes) * Format MBTiles (SQLite) * Survol des objets en Javascript (UTF-Grid) * Wax (config., légende, tooltips) Une boite à outils flexibles, innovants … et audacieux !

Slide 26

Slide 26 text

Illustrations * Publier un GeoJSON avec QGis et Leaflet * Fabriquer des tuiles avec TileMill * Afficher un fichier MBTiles avec django-mbtiles

Slide 27

Slide 27 text

Conclusion * OpenStreetMap + OpenData * Éco-système libre riche et varié * Choix d'architecture décisifs

Slide 28

Slide 28 text

Pour aller plus loin...

Slide 29

Slide 29 text

Géocodage Geonames from geopy import geocoders gn = geocoders.GeoNames() gn.geocode('Mirail Toulouse') (u'Le Mirail, B3, FR', (43.5764114330089, 1.3945770263671875)) Nominatim $ curl "http://open.mapquestapi.com/nominatim/v1/search? format=json&q=Mirail%20Toulouse" [{"place_id":"697188","lat":"43.5763978","lon":"1.3916297", ... , ...}]

Slide 30

Slide 30 text

Itinéraires * Open MapQuest http://open.mapquest.com * OpenRouteService http://www.openrouteservice.org * Yours http://www.yournavigation.org * Cloudmade http://maps.cloudmade.com Plus d'informations sur http://wiki.openstreetmap.org/wiki/Routing

Slide 31

Slide 31 text

Street View ? * Do It Yourself streetview, FOSSGIS 2012, Germany http://www.diy-streetview.com

Slide 32

Slide 32 text

Remplacer Google Maps par des solutions libres ? Est-ce bien raisonnable ?

Slide 33

Slide 33 text

Pistes cyclables OSM Pistes cyclables Google

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

... mais sûrement, la qualité ne peut pas être aussi bonne... ?

Slide 36

Slide 36 text

Dans Google Maps : * la rue Alaric II est devenue une impasse

Slide 37

Slide 37 text

dans Google Maps : * une société privée s'est installée dans la mairie * la pharmacie du Capitole n'est pas au bon angle de la place

Slide 38

Slide 38 text

dans Google Maps : * la mairie remplace l'école maternelle Lakanal

Slide 39

Slide 39 text

Google Maps : mélange le français et l'occitan

Slide 40

Slide 40 text

Merci Mathieu Leplatre @leplatrem

Slide 41

Slide 41 text

Les alternatives libres à Google Maps Mathieu Leplatre @leplatrem www.makina-corpus.com

Slide 42

Slide 42 text

Une longue liste d'utilisations interdites * mode déconnecté, embarqué * géocodage en masse * applications non ouvertes au public (e.g. intranet, extranet) * applications payantes * afficher de grandes cartes * suivre des flottes, des livraisons... ... L'utilisation de Google Maps est gratuite mais elle est soumise à de très nombreuses restrictions décrites dans les conditions d'utilisation des services : http://www.google.com/intl/en_fr/help/terms_maps.html http://code.google.com/apis/maps/terms.html http://www.google.com/permissions/geoguidelines.html

Slide 43

Slide 43 text

Une longue liste d'utilisations interdites... et encore... * mettre les tuiles en cache * fournir des services de navigation * impressions commerciales * utilisation hors API * hors d'un navigateur * ... Certaines restrictions sont levées dans la version Enterprise (> 100 k€, facturée en fonction des conditions de déploiement, d'accès...)

Slide 44

Slide 44 text

Des utilisations impossibles * maîtriser ce qu'affiche l'API * paramétrer les éléments affichés * définir un style complet * accéder aux données brutes (seulement à des images) Google ne diffuse que des images dont le contenu n'est pas paramétrable. C'est Google qui choisit ce qui doit apparaître ou pas dans les images Les données ne sont pas accessibles : on ne peut pas choisir d'afficher toutes les boîtes aux lettres mais pas les stations services Le rendu n'est pas très finement paramétrable : il est possible d'altérer légèrement les routes, les transports publics, les cours d'eau, quelques points d'intérêts. Il n'est pas possible de choisir la largeur et la présence de chaque type de voies, de régler l'affichage suivant le niveau de zoom, de sélectionner des éléments individuels...

Slide 45

Slide 45 text

De nombreuses limitations * erreurs difficiles voire impossible à corriger * usage payant si fort trafic * esthétique : des cartes trop vues * philosophie : des données propriétaires Risque de se voir imposer de la publicité tel qu'annoncé en octobre 2011 Google est maître chez lui : * les données contribuées par le public ne peuvent être récupérées * Google s'en réserve un usage illimité Google Maps est à l'opposé du mouvement Open Data. Les données sont propriétaires et inaccessibles individuellement.

Slide 46

Slide 46 text

Principaux services de Google Maps * fonds de carte (tuiles) * visionneuse interactive (API javascript) * publication aisée dans une page web * géocodage * itinéraires * cartes statiques Rappel des principaux services et composants de Google Maps utilisés par les entreprises et les collectivités

Slide 47

Slide 47 text

Les solutions libres offrent les mêmes services Open source/Open data Google * fonds de carte (tuiles) ✔ ✔ * visionneuse interactive ✔ ✔ * publication web simple ✔ ✔ * cartes statiques ✔ ~ * géocodage ~ ✔ * itinéraires ~ ✔ Les solutions libres offrent des services équivalents à ceux de Google Maps Solutions Libres : ce sont les logiciels libres et les données libres

Slide 48

Slide 48 text

Les solutions libres sont plus souples Open source/Open data Google * choix des styles ✔ ~ * modification/correction ✔ ~ * impression de cartes ✔ * cartes en mode déconnecté ✔ * applications mobiles ✔ * ajout de tout type de données ✔ * choix des données visualisées ✔ * choix de la langue des tuiles ✔ Les solutions libres présentent de nombreux atouts supplémentaires car elles offrent plus de souplesse. L'imagination et les connaissances techniques sont les seules limites...

Slide 49

Slide 49 text

Google Maps a révolutionné les cartes interactives Il faut réutiliser les meilleurs principes Google Maps : - tout le monde connaît et utilise - la mamie du Cantal aussi ! - au début du siècle, avant Google Maps (Maporama, Mappy, Localis...) ? On oublie vite, mais il fallait cliquer dans les coins ! Pour indiquer une adresse, il y avait un formulaire, au lieu d'un champ unique ! Pour zoomer, impossible d'utiliser la molette...

Slide 50

Slide 50 text

Fonds de carte L'approche Google Maps : des compromis ! * une seule projection : Mercator sphérique (900913,WGS 84) * une seule couche ! * du cache pour la rapidité →Rupture avec la plupart des portails Web SIG - la simplicité à base de compromis. - sur la précision : une projection universelle : … en France 15cm (vous allez me dire « Et les Lapons alors ? », … bonne raison pour chercher une alternative à Google Maps) - sur la quantité d'informations : une seule couche - sur la fraîcheur des infos : cache Portails web SIG : pas toujours la puissance de frappe de Google et ses 350k serveurs, mais que les contours des communes mettent 20 secondes à s'afficher, non !

Slide 51

Slide 51 text

Les données OpenStreetMap * créé en 2004 (Absence données libres) * édition collaborative (cf. Wikipedia) * free tagging (~NoSQL) * données WGS 84 (GPS) * API REST (moult éditeurs) - Approche communautaire autour des données - Le free tagging permet de créer autant de types de données que souhaité (bornes à incendie, anneaux d'amarrage,nids de poules...) - Éditeurs lourds, Web, … : JOSM, Merkaartor, Potlatch...

Slide 52

Slide 52 text

Serveur de tuiles OpenStreetMap nomstyle/z/x/y.png PostGIS Mapnik Apache + feuilles de style + mod_tile OSM scripts dump + diffs - Ces éléments décrivent une architecture minimaliste et masquent la complexité de la tâche : e.g. tuning PostGIS (données > 200 Go ) - Apache et mod_tile sollicitent Mapnik si besoin (cache disque sinon) - le script de mise à jour marque les tuiles « dirty » pour régénération lors d'une future demande

Slide 53

Slide 53 text

Serveur de tuiles Makina Corpus * autonomie (ex : utilisation commerciale) * styles personnalisés (ex : charte, filtres) * produits dérivés (ex : packs, application voyage) * mobile (ex : offline) * R&D (ex : outils BI) ... à l'écoute de vos besoins ! Makina Corpus a construit son propre serveur de tuiles. Cela permet : - soulager les serveurs OSM, pas prévus pour utilisation commerciale - gérer des palettes de couleurs adaptées aux chartes graphiques - filtres sur les données dessinées - ex : packs de tuiles d'une zone sur demande - mobile : tuiles à insérer dans un LocalStorage

Slide 54

Slide 54 text

Style par défaut - OpenStreetMap À partir des données d'OpenStreetMap, il est ainsi possible de créer des styles de cartes totalement différents... Le style par défaut du site http://www.openstreetmap.org/ est peu agréable mais présente beaucoup d'informations

Slide 55

Slide 55 text

Style, contenu, langue, symboles... ... tout est paramétrable Les données d'OSM permettent de paramétrer chacun des éléments de la représentation : - style (couleur, largeur, visibilité...) - montrer/masquer les informations (bâtiments officiels, nom des entreprises, parking, points d'intérêt...) - langue - symboles : choix des pictogrammes, de leur taille - ... Cette souplesse permet de construire des cartes interactives s'adaptant aux besoins de l'utilisateur.

Slide 56

Slide 56 text

Style allégé – Makina Corpus Makina Corpus crée des styles cartographiques adaptés à différents usage. Le style présenté est destiné à une carte multi-usage.

Slide 57

Slide 57 text

Style MapQuest Il est possible de construire son propre style : c'est une opération longue requérant une connaissance approfondie des outils cartographiques et des compétences graphiques. Une solution plus simple est d'utiliser des tuiles existantes préparées par des prestataires comme Makina Corpus ou MapQuest Pour un coût supérieur des prestataires peuvent préparer des tuiles sur mesure (Makina Corpus, GeoFabrik, Developement Seed, CloudMade...)

Slide 58

Slide 58 text

Visionneuse L'approche Google Maps : * rapidité (légèreté) * ergonomie (pan, molette) * simplicité ( sans arborescence) * compatibilité (navigateurs, mobiles) … quelles sont les solutions libres équivalentes ? Pour visualiser les tuiles, les pages web doivent comporter une visionneuse. Google Maps a révolutionné l'ergonomie des interactions avec les cartes en ligne.

Slide 59

Slide 59 text

OpenLayers (Metacarta, 2006) + très populaire + support protocoles OGC + gestion des projections + compatibilité - 1 Mo (!) - lenteur - tuiles chargées x8 - HTML généré archaïque - GeoExt :( OpenLayers : - utilisé massivement chez Makina Corpus - nos formations OpenLayers ont beaucoup de succès > * cette bibliothèque est largement utilisée * elle est complexe - nos critiques émanent d'expériences concrètes, OL est souvent trop lourd (même après compression) ! Il est bien sûr possible de réduire la taille de la biliothèque. Il existe même des outils automatiques pour cela (eg http://openlayerer.appspot.com/) mais attention à la gestion des dépendances ! Le résultat est parfois inutilisable.

Slide 60

Slide 60 text

Modest Maps JS (Stamen Design, 2011) + léger ( ~80 ko) + ultra-rapide et robuste + support mobile - sans support vectoriel - sans interaction - une seule couche :) Modest Maps (modestmaps.js) : - l’extrême inverse ! - ultra-léger (19 ko gzippé) - code minimaliste donc robuste - sans interaction : même pas de bouton pour zoomer ! Juste une API et des évènements ! ne fait rien ! … mais le fait bien !

Slide 61

Slide 61 text

Leaflet (Cloudmade, 2011) + léger (100 ko) + API simplifiée (à-la GMaps) + mobile (multitouch+accel. sur iOS) + HTML5 Canvas (ex : 2M objets) + projections + CSS3 & Animations + compatible IE6 :) - Tuiles ou GeoJSON/WMS - édition : élémentaire - meilleur compromis - HTML5 Canvas : 2 millions d'objets vectoriels côté client JS : http://www.giscloud.com/blog/gis-cloud-starts-html5-mapping-revolution rendu complet de données brutes : http://kothic.org/js/ Attention à la charge CPU ( ~batterie sur mobiles) - interactions édition basiques mais simples à coder –> modèle objet clair. Ex : éditeur de lignes en une vingtaine de LOC Également présents : tile5 (canvas), polymaps (SVG)

Slide 62

Slide 62 text

Illustrations * Carte VéloToulouse : Leaflet + Mustache + YQL * Livetitude : Leaflet + HTML5 websockets * Gr@ce : Leaflet + HTML5 WebSQL et LocalStorage (offline) Démonstrations réalisées lors de la présentation : Carte vélo Toulouse : http://www.makina-corpus.org/blog/carte-des-v%C3%A9los-avec-leafl Livetitude : https://github.com/makinacorpus/livetitude Demo chez Heroku : http://vivid-warrior-6693.herokuapp.com/ http://www.makina-corpus.org/blog/des-cartes-collaboratives-avec-live Livetitude permet de positionner des informations sur des cartes de manière collaborative en temps réel, de les exporter au format GeoJSON, de publier la carte sur une page Web... Leaflet offline storage (en développement) : https://github.com/CloudMade/Leaflet/issues/68#issuecomment-29733

Slide 63

Slide 63 text

Comment publier ses données ? L'approche Google Maps : culture du Web * Consultation d'une carte comme une page web ! * Partage d'une carte comme une image * Survol des objets en Javascript ... en rupture avec la plupart des portails Web SIG La publication de données spatiales sur Internet est devenue extrêmement simple.

Slide 64

Slide 64 text

Comment publier ses données ? L'approche privilégiée chez Makina Corpus GeoServer GeoExt OpenLayers GeoNetwork ~ Mo ~ Mo ~ Go Django* JQuery Leaflet + Mapnik ~ Mo ~ Ko ~ Ko - Approche OGC : seulement si adaptée ou nécessaire (e.g. directive INSPIRE) C'est une approche qui fonctionne et a fait ses preuves - Problèmes : - difficile à adapter aux besoins métier : météo (altitude), océanographie (sous-marin), géologie (sous-sol) - lourdeur Approche privilégiée par Makina Corpus : utiliser des composants léger adaptés au développement des besoins métier, et visualiser avec des outils du monde du Web (jQuery) * Django, Pyramid voire Drupal ou Plone suivant les besoins

Slide 65

Slide 65 text

Le projet MapBox (DevelopmentSeed, 2011) * Orienté communication (statique, OpenData) * TileMill (MSPaint des cartes) * Format MBTiles (SQLite) * Survol des objets en Javascript (UTF-Grid) * Wax (config., légende, tooltips) Une boite à outils flexibles, innovants … et audacieux ! Comment fonctionne les UTF-Grid ? http://mapbox.com/mbtiles-spec/utfgrid/

Slide 66

Slide 66 text

Illustrations * Publier un GeoJSON avec QGis et Leaflet * Fabriquer des tuiles avec TileMill * Afficher un fichier MBTiles avec django-mbtiles Démonstrations réalisées lors de la présentation : Django-mbtiles : https://github.com/makinacorpus/django-mbtiles La gestion de tuiles cartographiques dans Django fera l'objet d'une conférence Makina Corpus lors des prochaines rencontres Django 2012 : http://rencontres.django-fr.org/2012/conferences.html#c4

Slide 67

Slide 67 text

Conclusion * OpenStreetMap + OpenData * Éco-système libre riche et varié * Choix d'architecture décisifs Remplacer Google Maps est possible. On gagne au passage de la flexibilité, de la richesse et de la puissance. Surtout, c'est un choix en phase avec l'ouverture des données et le mouvement OpenData.

Slide 68

Slide 68 text

Pour aller plus loin...

Slide 69

Slide 69 text

Géocodage Geonames from geopy import geocoders gn = geocoders.GeoNames() gn.geocode('Mirail Toulouse') (u'Le Mirail, B3, FR', (43.5764114330089, 1.3945770263671875)) Nominatim $ curl "http://open.mapquestapi.com/nominatim/v1/search? format=json&q=Mirail%20Toulouse" [{"place_id":"697188","lat":"43.5763978","lon":"1.3916297", ... , ...}] Plusieurs solutions existent pour le géocodage à partir de données libres. Open MapQuest est la plus aboutie.

Slide 70

Slide 70 text

Itinéraires * Open MapQuest http://open.mapquest.com * OpenRouteService http://www.openrouteservice.org * Yours http://www.yournavigation.org * Cloudmade http://maps.cloudmade.com Plus d'informations sur http://wiki.openstreetmap.org/wiki/Routing

Slide 71

Slide 71 text

Street View ? * Do It Yourself streetview, FOSSGIS 2012, Germany http://www.diy-streetview.com Il n'y a pas encore d'équivalent libre de Street View. DIY streetview http://www.diy-streetview.com semble actif OpenView http://openviewproject.org/ est en sommeil

Slide 72

Slide 72 text

Remplacer Google Maps par des solutions libres ? Est-ce bien raisonnable ? Les solutions techniques et les données existent. Est-il cependant concevable de se passer de Google Maps en utilisant des logiciels et des données libres ?

Slide 73

Slide 73 text

Pistes cyclables OSM Pistes cyclables Google Les applications et les cartes spécialisées sont plus faciles à réaliser. Comparer ici les données sur les pistes cyclables dans OpenStreetMap et dans Google Maps. (vue de Toulouse, le 06/02/2012)

Slide 74

Slide 74 text

OpenStreetMap permet d'enregistrer des données de toute nature comme l'accessibilité en fauteuil. Il devient possible de produire des cartes et des outils spécialisés.

Slide 75

Slide 75 text

... mais sûrement, la qualité ne peut pas être aussi bonne... ? Une bande d'amateurs peut-elle vraiment produire des données plus efficacement que le géant Google ? En Europe, les données OpenStreetMap sont beaucoup plus riches, variées et souvent de meilleure qualité que celle de Google Maps Une bonne partie des amateurs contribuant à OpenStreetMap sont aussi des professionnels qualifiés (SIG, urbanistes, développeurs informatiques...) Les contributeurs sont nombreux (> 500 000) et motivés Des entités publiques et privées contribuent leur données (cadastre, ville de Brest, ville de Toulouse...)

Slide 76

Slide 76 text

Dans Google Maps : * la rue Alaric II est devenue une impasse Il est fréquent de trouver des erreurs dans les jeux de données de Google Maps (capture de Toulouse, le 06/02/2012) Loin de nous l'idée de dire qu'OpenStreetMap est parfait. Nous tenons simplement à souligner dans les diapos suivantes qu'il est aisé de trouver des erreurs dans la solution qui domine aujourd'hui le marché. Si vous trouvez des erreurs ou surtout des omissions dans OSM, nous vous encourageons à les corriger vous-même sur http://www.openstreetmap.org/

Slide 77

Slide 77 text

dans Google Maps : * une société privée s'est installée dans la mairie * la pharmacie du Capitole n'est pas au bon angle de la place (capture de Toulouse, le 06/02/2012)

Slide 78

Slide 78 text

dans Google Maps : * la mairie remplace l'école maternelle Lakanal (capture de Toulouse, le 06/02/2012)

Slide 79

Slide 79 text

Google Maps : mélange le français et l'occitan Google Maps a fréquemment des problèmes avec les noms propres et les langues L'avantage d'OpenStreetMap est que la collecte des informations est généralement faite par des autochtones...

Slide 80

Slide 80 text

Merci Mathieu Leplatre @leplatrem