1 / 70

Web Mapping

Web Mapping. Emmanuel Fritsch – 8 décembre 2009. Web Mapping. l’information géographique Clients et serveurs, internet Image et internet Client cartographique Serveur cartographique Les flux de données Fonctionnement du serveur. information géographique.

franz
Download Presentation

Web Mapping

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Web Mapping Emmanuel Fritsch – 8 décembre 2009

  2. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  3. information géographique 1) Les données enmode raster ou maillé ou matriciel : un quadrillage régulier du terrain Image satellitale Document scanné valeur = radiométrie (intensité lumineuse)

  4. PrimitivesExemple x le pointune borne x---x le segment (peu utilisé) la ligne un axe de route la surface une commune x AB le texte un toponyme St-Mésis information géographique Les données enmode vecteur (ou vectoriel) Les primitives géométriques sont des objets élémentaires :

  5. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  6. Architecture client-serveur comment cela fonctionne et à quoi cela sert

  7. { ?

  8. Que trouve-t-on dans un serveur ? = un programme = des fichiers de données = une base de données = +

  9. serveur internet Apache Architecture client-serveur www.bidule.fr + truc.html + identifiant exp. www.bidule.fr/truc.html truc.html affichage navigateur IE, Netscape, Firefox, etc.

  10. Le client affichage navigateur

  11. Le serveur La gestion des fichiers sur le serveur : • Le client voit :truc.html • L’administrateur voit : c:\Program Files\apache\wwwroot\truc.html • Tout ce qui est en dehors de : c:\Program Files\apache\wwwroot est invisible pour le client

  12. c:\ Program Files\ apache\ wwwroot\ truc.html machin\ Le serveur c:\ Program Files\ apache\ truc.html wwwroot\ Apache

  13. c:\Program Files\apache\wwwroot\machin\truc.html Le serveur c:\ Program Files\ www.bidule.fr /machin/truc.html apache\ truc.html wwwroot\ Apache truc.html machin\

  14. c:\Program Files\apache\wwwroot\machin\index.html c:\Program Files\apache\wwwroot\machin\index.html c:\Program Files\apache\wwwroot\machin\index.htm c:\Program Files\apache\wwwroot\machin\index.html c:\Program Files\apache\wwwroot\machin\index.htm c:\Program Files\apache\wwwroot\machin\index.php Le serveur www.bidule.fr /machin/ Apache truc.html machin\

  15. truc.php?x=12&y=45 truc.php javascript plug-in Client et plug-in – serveur et modules Apache www.bidule.fr/truc.php?x=12&y=45 affichage $x=12 $y=45 PHP navigateur MySQL => Le web dynamique

  16. www.ensg.ign.fr + truc.html + identifiant exp. 3- appelle l’image Un image dans une page 1- appelle le document www.bidule.fr/truc.html truc.html 2- lit le document : il y a une image dedans src="Guernesey.jpg" 4- reçoit l’image et l’insère dans la page

  17. javascript PHP plug-in MySQL Web Services affichage Webservice navigateur

  18. 5 Page Dynamique API Client 3 2 Page dynamique 1 Serveur de l’API 4 6 affichage

  19. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  20. De l’image statique à la carte interactive Evolution du langage HTML : • La balise <img> • Les balises <map> et <area> • La balise <input> Image statique Navigation entre pages statiques Web dynamique

  21. Balise HTML – le principe <html> <head> <title>titre du document </title> </head> <body> <H1>Titre de la page</H1> </body> </html> = balise ouvrant le fichier = balise ouvrant l’entête du doc. = ce qui apparaît sur la barre sup. = balise fermant l’entête = balise ouvrant le corps du doc. = titre de la page = fin du corps du document = fin du fichier html Principe : langage à base de balise (Hyper Text Mark-up Language)

  22. Balise Les balises permettent d’inclure : • du texte • des formulaires avec bouton, menu, etc. • des images • des objets, utilisant des plug-in • Les balises permettent d’inclure : • du texte • des formulaires avec bouton, menu, etc. • des images • des objets, utilisant des plug-in

  23. La carte comme image Une image dans une page html : la balise <img> <body> <img src="Guernesey/Guernesey.jpg" width="312" height="283" border="0" /> </body> </html>

  24. La carte comme image • Usage : • simplicité extrême • sécurité totale • maîtrise du rendu Exemple : site de réservation touristique

  25. La carte cliquable : MAP et AREA La carte cliquable comporte des liens = déclare un groupe de liens = déclare une zone cliquable = coordonnées X1,Y1,X2,Y2, etc. = lien vers la page cible = message qui s’affiche sous la souris = déclare une image = l’image est liée à une map <map NAME="mapGuer"> <area SHAPE=POLY COORDS="86,215,89,217,92,220,93,223,90,222,87,221,86,222,86,217,86" HREF="Jersey.htm" TITLE="Jersey"> </map> <img src="Guernesey.jpg" width=312 height=283 usemap="#mapGuer" >

  26. La carte avec zones cliquables Utilisation : • Atlas / fiche région /lien vers des données sémantiques • Lien avec javascript => Les balises <map> et <area> Peu pratique pour la navigation graphique http://www.atlasgeo.net/htmlg/Guernesey.htm

  27. poster les coordonnées : INPUT <form method="get" name="MapImage" action="Map.asp"> <inputtype="image" border="0" name="XgoClickMap" align="center" src="../image.asp?XgoPageName=XMLOUT&amp;XgoUserID=B5797364A8064D13&amp;XgoNbReq=1&amp;XgoAnswer=Gif&amp;sizex=370&amp;sizey=263&amp;CODE=congre" title="Cliquez pour recentrer et zoomer" width="370" height="263" > </form> = déclare un formulaire = déclare une image cliquable = comment a été générée l’image (celle que l’on voit) Lorsqu’on clique sur la carte, - le formulaire est posté vers la page Map.asp - les coord. (x,y) du "clic" sont postées aussi - Map.asp génère une nouvelle image, à partir des coodonnées (x,y).

  28. poster les coordonnées : INPUT • <form method="get" name="MapImage" action="Map.asp"> • <inputtype="image" border="0" name="XgoClickMap" align="center" src="../image.asp?XgoPageName=XMLOUT&amp;XgoUserID=B5797364A8064D13&amp;XgoNbReq=1&amp;XgoAnswer=Gif&amp;sizex=370&amp;sizey=263&amp;CODE=congre" title="Cliquez pour recentrer et zoomer" width="370" height="263" > • </form>

  29. http://maporama.com/share/Map.asp?SESSIONID=%7B2D1955DA-409C-D &NavigateHeight=46 &NavigateWidth=46 &XgoClickMap.x=226 &XgoClickMap.y=168&ClickMode=1

  30. poster les coordonnées : INPUT • La balise INPUT : • la solution pour envoyer les coordonnées d’un clic • du client vers le serveur • base du serveur cartographique on peut mettre plusieurs cartes sur la même page ex : la carte détaillée + une carte de situation

  31. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  32. client riche : Ajax, flash, API carto • Le client riche prend en charge toutes les opérations de navigations • Ces opérations de navigations sont prises en charge par des contrôles • Les contrôles gèrent, en dehors de l’interface, les appels aux serveurs

  33. Dans actions dans l’interface widgets clics souris raccourcis claviers + Firegesture ? + motion capture ? + nouvelles interfaces ? Zoom / dézoom / pan Recadrage Sélection Mise en relief Affichage / effacement Gestion de la transparence etc. Les contrôles Des interfaces intuitives et similaires

  34. Définition du client Carto Interface qui gère • l’affichage de la carte • Les interactions avec l’utilisateur • Les connexions avec les sources de données

  35. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  36. Serveur cartographique - définition • Une source de données (ou plusieurs) • Et un traitement Pour : • un transport par Internet • et une visualisation sur écran Client lourd (Google Earth) Client léger = navigateur

  37. MapServer Avant image (gif, jpeg) fichiers shape

  38. MapServer Après WMS WMS services services WFS WFS GPX image (gif, jpeg) fichiers shape png tab mdb tif SVG PostGIS vecteur SGBD GML Oraclespatial GeoJSON mySQL

  39. MapServer services services image fichiers vecteur SGBD

  40. Web Mapping • l’information géographique • Client et serveur, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  41. typologie des web-mapping vecteurimage • serveur cartographique • accès à une BD • chaque image est générée • compatibilité totale • souplesse

  42. typologie des web-mapping vecteurvecteur • extraction d’une BD • rapidité • nécessite un plug-in • problème de la protection des données • légèreté

  43. Quelle solution technique ? • La carte statique ☺ Pour conserver la maîtrise • de la carte • de la mise en page • Vecteur => vecteur ☺ Si je suis maître • des données • de leur volume • de leur sécurité • Vecteur => Image • Dans tous • les autres cas

  44. Pourquoi ? un syndicat de professionnels des recommandations et des standards des logiciels labellisés de la veille et des évolutions Recommandations de l’OGC • spécifications abstraites • standards techniques • bonnes pratiques Une procédure de labellisation • change requests, • discussion papers • OGC Reference Model

  45. Standards pour le web WMS : La carte raster WFS : Les objets vecteur SLD : La légende WCS : Les couvertures WPS : Les processus SPS : Les capteurs Spécifications abstraites Géométrie Relations spatiales Gestion des droits Métadonnées etc. Recommandations de l’OGC

  46. Web Map Service 3 requêtes : getCapabilities getMap getFeatureInfo Web Feature Services 3+2 requêtes : getCapabilities describeFeatureType getFeature lockFeature transaction WFS-T WMS et WFS

  47. XML et ses dérivés (GML, KML, SVG) anciens et rodés standardisés outils répandus mais langage parsé sur le client JSON, GeoJSON (issu de javascript) récent (2 ans) expansion rapide facilité de lecture interprété sur le client Langages porteurs

  48. Premières utilisations Logiques de projet pour : Prototypage Maintenance Aujourd’hui Logique de service Logique de partage Mais fortes protections sur la sémantique => WMS le plus utilisé La standardisation en marche

  49. Web Mapping • l’information géographique • Clients et serveurs, internet • Image et internet • Client cartographique • Serveur cartographique • Les flux de données • Fonctionnement du serveur

  50. Serveurs cartographiques Deux modes de fonctionnement : • soit la carte est générée à la volée • soit la carte est stockée temporairement

More Related