Nouvelles tendances en
webmapping et données libres

 

Toulouse, 12/12/2013
Frédéric Bonifas
@fbonifas
www.makina-corpus....
Makina Corpus
●

●

 

Société de Services en Logiciels Libres (SSLL), indépendante,
créée en 2001
Domaines d'activité : i...
Un exemple à ne pas suivre

http://tempsreel.nouvelobs.com/politique/20130821.OBS3816/l-ete-mediatique-de-manuel-valls.htm...
Évolution du web
●
●

Plus d'interactivité

●

Déporter les traitements vers l'utilisateur

●

 

Allègement des interface...
Design graphique
 

 
Allègement des interfaces
●

Moins de contenu écrit

●

Design graphique épuré

●

La carte véhicule plus d'informations

...
Publicité et contrôles trop nombreux
http://fr.mappy.com/

 

 
Publicité et style de carte pas adapté
http://www.viamichelin.fr/

 

 
Évolution positive
http://maps.google.fr

2006

2013
 

 
Visualiser des données géographiques : Leaflet
●
●

Léger (~120 ko)

●

API ultra-simple

●

JS | CSS3 | HTML5

●

Mobile
...
Nombreux plugins Leaflet

 

 
Mobile
 

 
Supports mobiles
●
●

Ergonomie (Natif)

●

Petits écrans (Allègement)

●

Tout l'écran est occupé par la carte

●

 

Nou...
Données disponibles
 

 
Aller au-delà de Google Maps
●

Utilisations interdites (mode déconnecté, mise en cache,
géocodage en masse...)

●
●

Fond...
Explosion des données disponibles
●
●

Ouverture de certaines données par l'IGN

●

Données libres gouvernementales (MNT S...
OpenStreetMap ?
●

Création en 2004 (absence de données geographiques libres)

●

Base de données mondiale

●

Données sou...
Orthophoto libre
http://vuduciel.loire-atlantique.fr/

 

 
Analyse du territoire et itinéraires
http://moodwalkr.com

 

 
Fonds de plan
 

 
Avoir son propre style - MapServer
MAP
NAME "mapfile_1"
EXTENT -180 -90 180 90
LAYER

???

NAME "mp_roads"
TYPE POLYGON
DA...
Avoir son propre style - GeoServer
<?xml version="1.0" encoding="UTF-8"?>
<StyledLayerDescriptor version="1.0.0"
xsi:schem...
Avoir son propre style - TileMill
#roads {
line-width:1;
line-color:#AA3333;
}

 

Mieux !
 
TileMill – charte graphique
http://loir-et-cher-2020.makina-corpus.net

 

 
mapbox.com
stamen.com

 

 
TileMill & open data
http://tolosa1680.makina-corpus.com

 

 
Interactions
 

 
Traitements côté client
●

Augmentation de la puissance des machines

●

Serveur cartographique de moins en moins indispen...
Calcul d'itinéraires côté client

 

 
En pratique : tuiles vectorielles
●

Stockage aisé (pas de création d'images sur le serveur)

●

Rendu sur le terminal (pu...
3D
 

 
En pratique : 3D
●

OSMBuildings : http://osmbuildings.org

●

Jeux vidéo : http://map.f4-group.com

●

Montagne :

http:/...
3D – à utiliser avec modération

 

 
Merci !
Présentation à retrouver :

http://makina-corpus.com/blog/societe/presentation-du-petit-dejeuner-sur-les-nouveaute...
Prochain SlideShare
Chargement dans…5
×

Petit déjeuner "Les nouveautés de la cartographie en ligne" du 12 décembre

1 000 vues

Publié le

Nous vous avions invité à partager un petit déjeuner pour découvrir les nouvelles tendances en webmapping et les possibilités offertes par les données géographiques libres dont OpenStreetMap.

Utilisées habituellement pour calculer des itinéraires ou comme fonds de plan pour afficher des informations, les cartes en ligne sont en pleine révolution grâce à l'arrivée de données géographiques libres. Elles permettent à tout un chacun d'imaginer des applications cartographiques innovantes et inattendues, de personnaliser le style de sa carte et de se passer des solutions techniques lourdes et complexes.

0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

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

Aucune remarque pour cette diapositive

Petit déjeuner "Les nouveautés de la cartographie en ligne" du 12 décembre

  1. 1. Nouvelles tendances en webmapping et données libres   Toulouse, 12/12/2013 Frédéric Bonifas @fbonifas www.makina-corpus.com  
  2. 2. Makina Corpus ● ●   Société de Services en Logiciels Libres (SSLL), indépendante, créée en 2001 Domaines d'activité : ingénierie logicielle, applications métiers innovantes, Web Carto Mobile  
  3. 3. Un exemple à ne pas suivre http://tempsreel.nouvelobs.com/politique/20130821.OBS3816/l-ete-mediatique-de-manuel-valls.html    
  4. 4. Évolution du web ● ● Plus d'interactivité ● Déporter les traitements vers l'utilisateur ●   Allègement des interfaces Arrivée du mobile  
  5. 5. Design graphique    
  6. 6. Allègement des interfaces ● Moins de contenu écrit ● Design graphique épuré ● La carte véhicule plus d'informations ●   Toutes les informations connues ne doivent pas forcément être représentées !  
  7. 7. Publicité et contrôles trop nombreux http://fr.mappy.com/    
  8. 8. Publicité et style de carte pas adapté http://www.viamichelin.fr/    
  9. 9. Évolution positive http://maps.google.fr 2006 2013    
  10. 10. Visualiser des données géographiques : Leaflet ● ● Léger (~120 ko) ● API ultra-simple ● JS | CSS3 | HTML5 ● Mobile ●   Largement utilisé (OSM, Foursquare, Flickr...) Puissant !  
  11. 11. Nombreux plugins Leaflet    
  12. 12. Mobile    
  13. 13. Supports mobiles ● ● Ergonomie (Natif) ● Petits écrans (Allègement) ● Tout l'écran est occupé par la carte ●   Nouvelle façon d'interagir (Tactile) Possibilités offertes par la géolocalisation  
  14. 14. Données disponibles    
  15. 15. Aller au-delà de Google Maps ● Utilisations interdites (mode déconnecté, mise en cache, géocodage en masse...) ● ● Fond de plan trop vu (et pas forcément adapté) ●   Pas d'accès aux données (propriétaires) Usage payant (fort trafic)  
  16. 16. Explosion des données disponibles ● ● Ouverture de certaines données par l'IGN ● Données libres gouvernementales (MNT SRTM ou ASTER) ● APIs des réseaux sociaux (Twitter) ●   Open data des collectivités OpenStreetMap  
  17. 17. OpenStreetMap ? ● Création en 2004 (absence de données geographiques libres) ● Base de données mondiale ● Données sous licence libre (ODbL) ● Édition collaborative (Wikipedia) → http://www.openstreetmap.org    
  18. 18. Orthophoto libre http://vuduciel.loire-atlantique.fr/    
  19. 19. Analyse du territoire et itinéraires http://moodwalkr.com    
  20. 20. Fonds de plan    
  21. 21. Avoir son propre style - MapServer MAP NAME "mapfile_1" EXTENT -180 -90 180 90 LAYER ??? NAME "mp_roads" TYPE POLYGON DATA "midi_pyrennees/mp_roads.shp" CLASS STYLE COLOR 20 10 110 WIDTH 2 END END   END END  
  22. 22. Avoir son propre style - GeoServer <?xml version="1.0" encoding="UTF-8"?> <StyledLayerDescriptor version="1.0.0" xsi:schemaLocation="http://www.opengis.net/sld StyledLayerDescriptor.xsd" xmlns="http://www.opengis.net/sld" xmlns:ogc="http://www.opengis.net/ogc" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <NamedLayer> ??? <Name>Simple Roads</Name> <UserStyle> <Title>Default Styler for simple road segments</Title> <Abstract>Light red line, 2px wide</Abstract> <FeatureTypeStyle> <Rule> <Title>Roads</Title> <LineSymbolizer> <Stroke> <CssParameter name="stroke"> <ogc:Literal>#AA3333</ogc:Literal> </CssParameter> <CssParameter name="stroke-width"> <ogc:Literal>2</ogc:Literal> </CssParameter> </Stroke> </LineSymbolizer> </Rule> </FeatureTypeStyle> </UserStyle>   </NamedLayer> </StyledLayerDescriptor>  
  23. 23. Avoir son propre style - TileMill #roads { line-width:1; line-color:#AA3333; }   Mieux !  
  24. 24. TileMill – charte graphique http://loir-et-cher-2020.makina-corpus.net    
  25. 25. mapbox.com stamen.com    
  26. 26. TileMill & open data http://tolosa1680.makina-corpus.com    
  27. 27. Interactions    
  28. 28. Traitements côté client ● Augmentation de la puissance des machines ● Serveur cartographique de moins en moins indispensable ● Maturité du JavaScript ●   Interaction avec les données directement dans le navigateur (UTFGrid, GeoJSON tuilé...)  
  29. 29. Calcul d'itinéraires côté client    
  30. 30. En pratique : tuiles vectorielles ● Stockage aisé (pas de création d'images sur le serveur) ● Rendu sur le terminal (puissance de calcul suffisante) ➔ http://gijs.github.io/vectorstyling-demo/ ➔ ➔   OpenStreetMap : http://openstreetmap.us/~migurski/vector-datasource/ Google Maps : https://www.google.fr/maps/  
  31. 31. 3D    
  32. 32. En pratique : 3D ● OSMBuildings : http://osmbuildings.org ● Jeux vidéo : http://map.f4-group.com ● Montagne : http://thematicmapping.org/playground/webgl/terrain/texture/jotunheimen.html ●   HERE : http://here.com/41.3907764,2.1650211,19.23,0,54,3d.day  
  33. 33. 3D – à utiliser avec modération    
  34. 34. Merci ! Présentation à retrouver : http://makina-corpus.com/blog/societe/presentation-du-petit-dejeuner-sur-les-nouveautes-de-la-cartographie-en-ligne frederic.bonifas@makina-corpus.com www.makina-corpus.com    

×