Εισαγωγή στη Διαδικτυακή Χαρτογραφία

Transcript

1 1 Χαροκόπειο Πανεπιστήμιο, Τμήμα Γεωγραφίας ΠΜΣ Εφαρμοσμένη Γεωγραφία & Διαχείριση του Χώρου Ερευνητικά θέματα στη Γεωπληροφορική Μάιος 2017 Χριστόφορος Βραδής Υποψήφιος διδάκτορας Χαροκόπειου Πανεπιστημίου Εισαγωγή στη Διαδικτυακή Χαρτογραφία

2 2 Περίγραμμα της διάλεξης Βασικοί ορισμοί Η διαδικτυακή χαρτογραφία Αρχιτεκτονική πελάτη - εξυπηρετητή Το περιβάλλον του πελάτη Το περιβάλλον του εξυπηρετητή Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή Διεθνείς οργανισμοί και πρότυπα Τάσεις και ερευνητικά θέματα

3 Βασικοί ορισμοί 3 Διαδικτυακή Χαρτογραφία Η σύνθεση χαρτών για το διαδίκτυο (web mapping) είναι η διαδικασία σχεδιασμού, υλοποίησης, παραγωγής και διάθεσης διαδικτυακών χαρτών στον Παγκόσμιο Ιστό. Τα διαδικτυακά ΓΣΠ (Web GIS) σχετίζονται με τους διαδικτυακούς χάρτες και δίνουν έμφαση στην ανάλυση και την επεξεργασία γεωχωρικών δεδομένων. Οι διαδικτυακοί χάρτες αποτελούν το μέσο παρουσίασης σε ένα web GIS. Η διαδικτυακή χαρτογραφία (web cartography) είναι επιπρόσθετα η μελέτη θεωρητικών πτυχών: η χρήση των διαδικτυακών χαρτών, η ανάλυση και βελτιστοποίηση τεχνικών και ροών εργασίας, η χρηστικότητα των διαδικτυακών χαρτών, η μελέτη κοινωνικών διαστάσεων και άλλα. Web mapping Web GIS Web cartography

4 Διαδικτυακή Χαρτογραφία 4 Παγκόσμιος Ιστός Το σύνολο των Η/Υ του διαδικτύου που ανταλλάσσουν πληροφορίες (πρωτόκολλο HTTP, γλώσσα HTML) Ο Παγκόσμιος Ιστός είναι ένα υποσύνολο του διαδικτύου και είναι προσβάσιμος από αυτό μέσα από μια μηχανή Υπερκείμενα (hypertext) Πλοήγηση μέσω υπερσυνδέσμων (hyperlinks)

5 Διαδικτυακή Χαρτογραφία 5 Σημαντικές χρονολογίες 1989, CERN Ελβετία: Γέννηση του Παγκόσμιου Ιστού για την ανταλλαγή ερευνητικού περιεχομένου 1993: Xerox PARC Map Viewer 1994: The National Atlas of Canada 1994, CERN Ελβετία: οριστικοποίηση γλώσσας HTML και πρωτόκολλου HTTP 1997, University of Minnesota (UMN): MapServer 1.0 (NASA ForNet Project. Για τη διανομή τηλεπισκοπικών δεδομένων. 2005: Google maps 2005: OpenLayers, open source Javascript library

6 Διαδικτυακή Χαρτογραφία 6 Η προέλευση των διαδικτυακών χαρτών Hypermaps (Laurini and Millert - Raffort, 1990) Ένας ψηφιοποιημένος, διαδραστικός, πολυμεσικός χάρτης, ο οποίος επιτρέπει στους χρήστες τη μεγέθυνση και σμίκρυνση, καθώς και την εύρεση θέσεων από ένα γεωγραφικό λεξικό (gazetteer) υπερκειμένου.

7 Διαδικτυακή Χαρτογραφία 7 Ο συμβατικός χάρτης Στατικοί χάρτες σε έντυπη ή / και ψηφιακή μορφή. Στην ψηφιακή μορφή χωρίς ή με περιορισμένη διαδραστικότητα Έντυπος Ψηφιακή μορφή (PDF, JPEG, ) Ψηφιακή μορφή + λειτουργίες (π.χ. GeoPDF)

8 Διαδικτυακή Χαρτογραφία 8 Ο διαδικτυακός χάρτης απαιτεί δημοσιοποίηση Στατικός χάρτης Δυναμικός χάρτης Χάρτης από κατανεμημένες πηγές Διαδραστικός χάρτης Χάρτης με δυνατότητες ανάλυσης ΣΓΠ Επεξεργάσιμος χάρτης Αυξάνονται οι δυνατότητες, αυξάνεται και η πολυπλοκότητα

9 Διαδικτυακή Χαρτογραφία 9 Πλεονεκτήματα διαδικτυακών χαρτών Ευκολότερη διάθεση και ανανέωση περιεχομένου Αυξημένος έλεγχος Επιλογή ορατού περιεχομένου Επιλογή πηγών περιεχομένου Διαδραστικότητα, αλληλεπίδραση και εξερεύνηση

10 Διαδικτυακή Χαρτογραφία 10 Πλεονεκτήματα διαδικτυακών χαρτών Συνεργασία χρηστών Διεπαφή για αναζήτηση και εύρεση δεδομένων Τρισδιάστατη απεικόνιση

11 Διαδικτυακή Χαρτογραφία 11 Επιπτώσεις Αυξημένη προσβασιμότητα / διαθεσιμότητα περιεχομένου και λειτουργιών, μείωση κόστους Συνεργασία και συμμετοχικές διαδικασίες Εκδημοκρατισμός της χαρτογραφίας (Morisson 1997): Σήμερα, ο χρήστης είναι ο χαρτογράφος

12 Διαδικτυακή Χαρτογραφία 12 Επιπτώσεις Η δημιουργία ενός χάρτη από τον τελικό, μη έμπειρο χρήστη, μπορεί να αποτελέσει ταυτόχρονα και μειονέκτημα: ποια θα είναι η ποιότητα του τελικού χάρτη; Σατιρικοί χάρτες

13 Διαδικτυακή Χαρτογραφία 13 Yanko Tsvetkov

14 Βασικοί ορισμοί 14 Πως υλοποιείται ένας διαδικτυακός χάρτης Η απαιτούμενη λειτουργικότητα υλοποιείται σε δύο διακριτά μέρη: Η εφαρμογή που εκτελείται στο πρόγραμμα - πελάτη (client, front-end) στον οποίο εμφανίζεται ο χάρτης Οι εφαρμογές σε έναν ή περισσότερους εξυπηρετητές (servers, back end) οι οποίοι παρέχουν διαδικτυακές υπηρεσίες και γενικά ψηφιακούς πόρους στον πελάτη σε διάφορες μορφές

15 Αρχιτεκτονική client - server Server 15 Αίτηση (request) GET HTTP Client Απάντηση (response) PUT HTML/CSS/JS XML JSON (GeoJSON) PNG/JPEG/GIF/SVG

16 Παράδειγμα <!DOCTYPE html> <html prefix="og: xmlns=" xhtml" xml:lang="el-gr" lang="el-gr" dir="ltr"> <head> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <base href=" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="keywords" content="χαροκόπειο Πανεπιστήμιο, ελληνική έκδοση." /> <meta name="description" content="καλώς ήλθατε στον ιστοχώρο του Χαροκοπείου Πανεπιστημίου. Το Χαροκόπειο Πανεπιστήμιο ιδρύθηκε το 1990 και εδράζεται σε κληροδότημα του Εθνικού Ευεργέτη Παναγή Χαροκόπου." /> <meta name="generator" content="joomla! - Open Source Content Management" /> <title>χαροκόπειο Πανεπιστήμιο - ΤΟ ΠΑΝΕΠΙΣΤΗΜΙΟ</title> <link href="/index.php/el/?format=feed&type=rss" rel="alternate" type="application/rss+xml" title="rss 2.0" /> 16

17 Τυπικά συστατικά μιας αρχιτεκτονικής πελάτη - εξυπηρετητή 17 client server Περιηγητής διαδικτύου browser Εφαρμογή desktop / mobile διαδίκτυο Εξυπηρετητής Διαδικτύου web server Εξυπηρετητής Διαδικτυακών Γεωχωρικών Υπηρεσιών map server Αρχεία Σύστημα Διαχείρισης Βάσης Δεδομένων DBMS

18 Το περιβάλλον του πελάτη 18

19 Το περιβάλλον του πελάτη Τι θεωρούμε ως πελάτη; Εφαρμογή desktop Λογισμικό ArcMap QGIS Custom Περιηγητής διαδικτύου Λογισμικό Chrome Edge Firefox Safari Opera Εφαρμογή mobile Λογισμικό 19

20 Το περιβάλλον του πελάτη 20 Περιηγητής διαδικτύου (Web Browser) Λογισμικό (εφαρμογή) που χρησιμοποιείται για την ανάκτηση, παρουσίαση και πλοήγηση σε πόρους πληροφοριών που υπάρχουν στον Παγκόσμιο Ιστό (World Wide Web) Κάθε πόρος έχει ένα αναγνωριστικό: το Uniform Resource Identifier (URI/URL) που μπορεί να αντιστοιχεί με μια ιστοσελίδα, μια εικόνα, ένα βίντεο ή άλλου είδους περιεχόμενο.

21 Το περιβάλλον του πελάτη Περιηγητής διαδικτύου ως πελάτης Chrome Safari Firefox Internet Explorer Opera Edge 21

22 Το περιβάλλον του πελάτη 22 Τι εκτελείται μέσα σε έναν περιηγητή;

23 Το περιβάλλον του πελάτη 23 Τι εκτελείται μέσα σε έναν περιηγητή; HTML για το περιεχόμενο και τη δομική του περιγραφή (περιεχόμενο: κείμενο, συνδέσεις προς αρχεία εικόνων, διανυσματικών γραφικών, βίντεο, ήχου κλπ) CSS για την διάταξη και την εμφάνιση του περιεχομένου JavaScript για την αλληλεπίδραση με το χρήση και την παροχή δυναμικών λειτουργιών

24 Το περιβάλλον του πελάτη 24 Web development resources

25 Το περιβάλλον του πελάτη 25 Σε τι χρησιμεύει ο συνδυασμός HTML/CSS/JS Ανάπτυξη της Γραφικής Διεπαφής Χρήστη (Graphical User Interface - GUI). Γραφικά στοιχεία στην οθόνη ψηφιακής συσκευής απαραίτητα για την αλληλεπίδραση του χρήστη Εμφάνιση χάρτη, πλοήγηση στο χάρτη (μεγέθυνση, σμίκρυνση), επιλογή ορατών επιπέδων, εμφάνιση ιδιοτήτων χαρτογραφικού χαρακτηριστικού, εμφάνιση υπομνήματος, συμπληρωματικών κειμένων και άλλων ειδικών λειτουργιών (μέτρηση αποστάσεων κλπ)

26

27 Το περιβάλλον του πελάτη 27 HTML HyperText Markup Language, Γλώσσα Σήμανσης Υπερκειμένου Aποτελείται από ετικέτες (tags), οι οποίες περικλείονται μέσα σε σύμβολα «μεγαλύτερο από» και «μικρότερο από» (για παράδειγμα <html>) και συνήθως λειτουργούν ανά ζεύγη (για παράδειγμα <h1> και </h1>).

28 Το περιβάλλον του πελάτη 28 HTML - παράδειγμα <html> <head> <title>hello World</title> </head> <body> <p>hello world.</p> <div>αυτός είναι ένας χάρτης του Χαροκόπειου Πανεπιστημίου</div> <img id= map src= map.gif"><br> <a href= class= mycustombutton >Επισκεφθείτε την ιστοσελίδα του Χαροκόπειου Πανεπιστημίου</a> </body> </html>

29 Το περιβάλλον του πελάτη 29 CSS Cascading Style Sheets - Διαδοχικά Φύλλα Στυλ Γλώσσα για την περιγραφή της παρουσίασης ενός εγγράφου σε γλώσσα επισήμανσης (όπως η HTML) Χρησιμοποιείται και σε αρχεία XML, SVG Μορφοποίηση χρωμάτων, μεγέθους στοιχείων, γραμματοσειράς, διάταξης και πολλών άλλων παραμέτρων εμφάνισης

30 Το περιβάλλον του πελάτη 30 CSS - παράδειγμα body { background-color:white; color:black; font-family:arial,sans-serif; margin-top: 14px; border: 12px solid; } p { color: white; background: orange; border: 1px solid black; padding: ; font-weight: bold; }

31 Το περιβάλλον του πελάτη 31 CSS - παράδειγμα #map { width: 100%; height: 100%; }.mycustombutton { color: blue; background: white; border: none; font-weight: bold; }

32 Το περιβάλλον του πελάτη 32 JavaScript Διερμηνευόμενη γλώσσα προγραμματισμού Χρησιμοποιείται στους περιηγητές Ιστού για την επικοινωνία και ανταλλαγή δεδομένων τη δυναμική αλλαγή του περιεχομένου και της εμφάνισης

33 Το περιβάλλον του πελάτη 33 JavaScript - παράδειγμα <script> var username = window.prompt( Εισάγετε όνομα ); alert( Καλωσήλθες + username + ".") </script>

34 Το περιβάλλον του πελάτη 34 H JavaScript δημιουργεί δυναμικά κώδικα HTML/CSS function addelement () { var newdiv = document.createelement("div"); var newcontent = document.createtextnode( Γειά σας!"); newdiv.appendchild(newcontent); document.body.appendchild(newdiv); newdiv.style.backgroundcolor = "#D93600"; } document.body.onload = addelement;

35 Το περιβάλλον του πελάτη 35 Οι τελευταίες εκδόσεις στις τεχνολογίες περιηγητών

36 Το περιβάλλον του πελάτη 36 Τεχνολογίες που σταδιακά εγκαταλείπονται Plugins: Java applets Adobe Flash, Shockwave content Microsoft Silverlight...

37 Το περιβάλλον του πελάτη 37 Οι περιηγητές διαφέρουν ως προς τις δυνατότητες Ένας διαδικτυακός χάρτης, ως εφαρμογή που αποτελείται από κώδικα HTML/CSS/JS, θα διαφέρει ως προς την εμφάνιση και ενδεχομένως ως προς τη λειτουργικότητα που προσφέρει ανάλογα το περιβάλλον θέασης (συνδυασμός οθόνης, λειτουργικού συστήματος και περιηγητή)

38 Το περιβάλλον του πελάτη 38 Οι περιηγητές διαφέρουν ως προς τις δυνατότητες caniuse.com

39 Το περιβάλλον του πελάτη 39 Οι περιηγητές διαφέρουν ως προς τις δυνατότητες Κάθε εφαρμογή στον περιηγητή είναι στο μεγαλύτερο ποσοστό της ανεξάρτητη του περιβάλλοντος θέασης. Αυτό μπορεί να μην συμβαίνει στο περιβάλλον του εξυπηρετητή όπου οι εφαρμογές αναπτύσσονται

40 Το περιβάλλον του πελάτη 40 Η τάση στους περιηγητές διαδικτύου (τελευταία διετία) Chrome Safari Firefox Opera Android

41 Το περιβάλλον του πελάτη 41 Η τάση στις συσκευές (τελευταία διετία) Mobile Desktop Tablet

42 Το περιβάλλον του πελάτη 42 Η τάση στα λειτουργικά συστήματα (τελευταία διετία) Windows Android ios OS X

43 Το περιβάλλον του πελάτη 43 Τι αρχεία υποστηρίζει εγγενώς ένας περιηγητής; Εικόνες ψηφιδωτές (JPEG, PNG, GIF, WebP, JPEG XR) Δισδιάστατα διανυσματικά γραφικά (SVG) Τρισδιάστατα διανυσματικά γραφικά (WebGL) Βίντεο (WebM, Ogg, MP4 ) Ήχος (MP3, Wav )

44 Το περιβάλλον του πελάτη 44 Τι είδους αρχεία μπορούν να αξιοποιηθούν σε ένα περιηγητή; Μέσω κώδικα JavaScript ένας περιηγητής μπορεί να αξιοποιήσει πληθώρα μορφότυπων: XML, GML, KML JSON, GeoJSON, TopoJSON CSV, TXT

45 Το περιβάλλον του πελάτη 45 Ο χάρτης στον περιηγητή ως εφαρμογή Γραφική διεπαφή: HTML, CSS, JavaScript Κείμενο, στοιχεία ελέγχου χάρτη HTML, CSS Χάρτης: εικόνα /ες GIF, JPEG, διανύσματα SVG Φόρτωση δεδομένων και αλληλεπίδραση (zoom, pan, identify ): JavaScript Δεδομένα: από υπηρεσίες ως εικόνες ή διανύσματα

46 Το περιβάλλον του πελάτη 46 Σχεδιασμός διαδικτυακού χάρτη Ο χάρτης μπορεί να λειτουργήσει ως γραφική διεπαφή Η αλληλεπίδραση στον χαρτογραφικό συμβολισμό Η οπτική ιεραρχία

47 Το περιβάλλον του πελάτη 47 Τα επίπεδα οπτικής ιεραρχίας στον διαδικτυακό χάρτη Το κυρίως περιεχόμενο: το κυρίως θεματικό επίπεδο του χάρτη με τα διαδραστικά στοιχεία του, υπόμνημα, γραφήματα που σχετίζονται με το θεματικό επίπεδο. Το δευτερεύον περιεχόμενο: το υπόβαθρο, μενού και πολυμεσικό περιεχόμενο Το υποστηρικτικό επίπεδο: κάνναβος, περιεχόμενο που δεν σχετίζεται άμεσα με τον χάρτη, βοηθητικό κείμενο

48 Το περιβάλλον του πελάτη 48 Τα επίπεδα οπτικής ιεραρχίας στον διαδικτυακό χάρτη

49 Το περιβάλλον του πελάτη 49 Βοηθητικές βιβλιοθήκες Javascript Δεν χρειάζεται να ανακαλύπτεται ο τροχός κάθε φορά Υπάρχει πληθώρα από βιβλιοθήκες και προγραμματιστικές διεπαφές JavaScript για διαδικτυακούς χάρτες Διευκολύνεται και επιταχύνεται σημαντικά η ανάπτυξη εφαρμογών διαδικτυακών χαρτών Εξασφαλίζουμε ότι η εφαρμογή μας συμπεριφέρεται με τον ίδιο τρόπο σε διαφορετικούς περιηγητές

50 Το περιβάλλον του πελάτη 50 Βιβλιοθήκες / διεπαφές προγραμματισμού JavaScript γενικής χρήσης jquery Dojo Raphael Bootstrap AngularJS

51 Το περιβάλλον του πελάτη 51 Βιβλιοθήκες / διεπαφές προγραμματισμού JavaScript για διαδικτυακούς χάρτες OpenLayers Leaflet GeoExt Mapbox Polymaps Kartograph

52 Το περιβάλλον του πελάτη 52 Βιβλιοθήκες / διεπαφές προγραμματισμού JavaScript για διαδικτυακούς χάρτες ArcGIS Javascript API Google Maps API Bing Maps API

53 Το περιβάλλον του πελάτη - παράδειγμα OpenLayers 53 <html> <head> <link rel="stylesheet" href=" type="text/css"> <style>.map { height: 400px; width: 100%; } </style> <script src=" type="text/javascript"></script> <title>openlayers example</title> </head> <body> <div id="map" class="map"></div> <script type="text/javascript"> var map = new ol.map({ target: 'map', layers: [ new ol.layer.tile({ source: new ol.source.osm() }) ], view: new ol.view({ center: ol.proj.fromlonlat([37.9, 23.7]), zoom: 4 }) }); </script> </body> </html>

54 Το περιβάλλον του πελάτη - παράδειγμα OpenLayers 54 OpenLayers - παράδειγμα

55 Το περιβάλλον του πελάτη 55 Ολοκληρωμένα Περιβάλλοντα Ανάπτυξης IDE: Integrated Development Environment Λογισμικά για την συγγραφή κώδικα που διευκολύνουν την ανάπτυξη εφαρμογών Εξαιρετικά διαδεδομένα για εφαρμογές desktop και mobile Σχετικά λίγες επιλογές για ανάπτυξη χαρτογραφικών διαδικτυακών εφαρμογών (π.χ Aptana Studio 3.0)

56 Το περιβάλλον του πελάτη 56 Web-based tools (commercial) Carto Builder (carto.com/builder) MapBox Studio ( ESRI (developers.arcgis.com/building-apps/#builders) AppStudio for ArcGIS (mobile) Web AppBuilder for ArcGIS (Web) ESRI Story Maps (web)

57 Το περιβάλλον του πελάτη 57 Αυτόματη παραγωγή κώδικα HTML/CSS/JS QGIS με qgis2web: plugins.qgis.org/plugins/qgis2web/, αυτόματη δημιουργία διαδικτυακού χάρτη με χρήση Leaflet ή OpenLayers

58 Το περιβάλλον του πελάτη 58 Desktop vs Mobile vs Web Οι εφαρμογές για σταθερές ή κινητές συσκευές αξιοποιούν πλήρως τις λειτουργίες που παρέχει η συσκευή. Όμως κάθε λειτουργικό σύστημα απαιτεί χωριστή ανάπτυξη εφαρμογής: Android, ios, Java, macos,.νετ (Windows) Η ανάπτυξη εφαρμογής σε browser αγνοεί τις ιδιαιτερότητες του λειτουργικού συστήματος

59 Το περιβάλλον του πελάτη 59 Η χαρτογραφική προβολή Web Mercator Web Mercator ή Google Web Mercator ή Spherical Mercator, ή WGS 84 Web Mercator ή WGS 84/Pseudo-Mercator Για την επιτάχυνση των πολύπλοκων και χρονοβόρων (ακόμα και από Η/Υ) υπολογισμών χρησιμοποιείται η απλοποιημένη Μερκατορική προβολή (Web Mercator) Η απλοποίηση των υπολογισμών προκύπτει από τη χρήση της σφαίρας (αντί του ελλειψοειδούς εκ περιστοφής) Δημιουργεί μεγαλύτερα σφάλματα τα οποία δεν είναι πάντα αισθητά στο τελικό χρήστη κυρίως στις μικρές κλίμακες Ενδέχεται στον ίδιο χάρτη και κατά τη μετάβαση σε μεγάλες κλίμακες να αλλάζει η προβολή στην κανονική Μερκατορική (κάτι που επίσης είναι ανεπαίσθητο στον τελικό χρήστη)

60 Το περιβάλλον του πελάτη 60 Η χαρτογραφική προβολή Web Mercator H Μερκατορική προβολή (ως σύμμορφη) παραμορφώνει σημαντικά τα εμβαδά (πλησιάζοντας τους πόλους) Για το λόγο αυτό έχει κατηγορηθεί ότι δίνει εξαιρετικά λανθασμένη εικόνα του μεγέθους των χωρών

61 61 Το περιβάλλον του εξυπηρετητή

62 Το περιβάλλον του εξυπηρετητή 62 Ο ρόλος του εξυπηρετητή Παρέχει τα αρχεία HTML / CSS / JS, είτε στατικά είτε δυναμικά Παρέχει χάρτες και γεωχωρικά δεδομένα, διανυσματικά ή ψηφιδωτά μέσω υπηρεσιών Παρέχει λοιπούς πόρους

63 Το περιβάλλον του εξυπηρετητή 63 Εξυπηρετητής διαδικτύου (Web Server) web server (ή HTTP server ή application server): λογισμικό που διανέμει περιεχόμενο χρησιμοποιώντας το πρωτόκολλο HTTP. Το περιεχόμενο είναι συνήθως υπό τη μορφή αρχείου HTML. Μπορεί να είναι εικόνες ή και άλλου είδους αρχείο. Το περιεχόμενο μπορεί να είναι στατικό ή να δημιουργείται δυναμικά.

64 Το περιβάλλον του εξυπηρετητή 64 Δυναμική παραγωγή κώδικα HTML / CSS / JS Παράδειγμα με γλώσσα PHP <html> <head> <title>hello World</title> </head> <body> <?php echo <p>hello world</p> ;?> </body> </html>

65 Το περιβάλλον του εξυπηρετητή 65 Λογισμικά εξυπηρετητών διαδικτύου Apache HTTP Server httpd.apache.org ΕΛ/ΛΑΚ IIS (Internet Information Services) Δωρεάν μαζί με τα Windows Apache Tomcat tomcat.apache.org ΕΛ/ΛΑΚ

66 Το περιβάλλον του εξυπηρετητή 66 Εξυπηρετητής γεωχωρικών υπηρεσιών(map Server) map server: λογισμικό που διανέμει χαρτογραφικό περιεχόμενο μέσω υπηρεσιών (πρωτόκολλο HTTP) Περιεχόμενο σε XML, GML, JSON. Μπορεί να είναι εικόνες ή και άλλου είδους αρχείο. Το χαρτογραφικό περιεχόμενο μπορεί να είναι στατικό ή να δημιουργείται δυναμικά. Τα γεωχωρικά δεδομένα μπορούν να προέρχονται από μια Βάση Δεδομένων ή από απλά αλλά κατάλληλα αρχεία (shapefiles) Δεν επιτρέπει την απευθείας πρόσβαση στα γεωχωρικά δεδομένα

67 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 67 Λογισμικά εξυπηρετητών γεωχωρικών διαδικτυακών υπηρεσιών Geoserver geoserver.org ΕΛ/ΛΑΚ Mapserver mapserver.org ΕΛ/ΛΑΚ ArcGIS Server server.arcgis.com Εμπορικό

68 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 68 Γεωχωρική διαδικτυακή υπηρεσία Μια διακριτή λειτουργικότητα που εκτελείται σε έναν εξυπηρετητή και παρέχεται μέσω μιας διεπαφής Καλείται από έναν πελάτη μέσω ενός αιτήματος Χρησιμοποιεί και αυτή το πρωτόκολλο HTTP Παρέχει πρόσβαση σε γεωχωρικά δεδομένα υπό τη μορφή raster ή vector αναπαραστάσεων Δεν παρέχει απευθείας πρόσβαση στα δεδομένα

69 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 69 Τα κυριότερα πρότυπα στις διαδικτυακές υπηρεσίες WMS και WFS Δύο από τα πλέον σημαντικά πρότυπα διαδικτυακών υπηρεσιών Αποτελούν ένα ενδιάμεσο στάδιο στη δημιουργία μιας διαδικτυακής χαρτογραφικής εφαρμογής

70 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 70 Τα κυριότερα πρότυπα στις διαδικτυακές υπηρεσίες WMS (Web Map Service): Με το πρότυπο WMS ο εξυπηρετητής παράγει χάρτες ως εικόνες (raster) από raster ή/ και vector δεδομένα WMST WFS (Web Feature Service): Με το πρότυπο WFS ο εξυπηρετητής παρέχει όχι ακριβώς τον χάρτη αλλά ξεχωριστές γεωγραφικές οντότητες ως διανύσματα (vector) μόνο από vector δεδομένα WFS-T

71 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 71 WMS (Web Map Service) Ένα πρότυπο υπηρεσίας που ορίζει τον τρόπο με τον οποίο μια εφαρμογή μπορεί να ζητήσει μία ή περισσότερες γεωαναφερμένες εικόνες από έναν εξυπηρετητή. Οι εικόνες παράγονται από γεωχωρικά δεδομένα raster ή/ και vector που μπορεί να βρίσκονται σε μία ή περισσότερες κατανεμημένες βάσεις δεδομένων (ή και ως απλά αρχεία). Σε ένα αίτημα WMS, μεταξύ άλλων παραμέτρων, μπορεί να καθορισθεί η γεωγραφική περιοχή που μας ενδιαφέρει καθώς και τα επίπεδα που επιθυμούμε να εμφανίσουμε.

72 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 72 WMS (Web Map Service) Η απάντηση σε ένα αίτημα WMS είναι μία ή περισσότερες γεωαναφερμένες εικόνες (σε μορφότυπους JPEG, PNG, GIF κλπ). Οι εικόνες αυτές μπορούν να απεικονισθούν στον περιηγητή (browser) ή σε άλλη εφαρμογή. Στο αίτημα μπορούμε να δηλώσουμε αν επιθυμούμε να υπάρχει διαφάνεια στις εικόνες που παράγονται έτσι ώστε να μπορούμε υπερθέσουμε εικόνες, τη μία πάνω στην άλλη, συνδυάζοντας χάρτες από την ίδια πηγή ή από διαφορετικές πηγές (εξυπηρετητές).

73 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 73 WMS (Web Map Service) - είδη αιτημάτων GetCapabilities - επιστρέφει πληροφορίες σχετικά με τις δυνατότητες της υπηρεσίας WMS του εξυπηρετητή (μορφότυποι εικόνων, έκδοση) και τα διαθέσιμα επίπεδα (γεωγραφική έκταση, σύστημα συντεταγμένων κλπ) GetMap - επιστρέφει ένα χάρτη υπο τη μορφή μιας εικόνας. Οι παράμετροι που το συνοδεύουν είναι: διαστάσεις χάρτη, σύστημα συντεταγμένων, στυλ, μορφότυπος εικόνας κ.α.

74 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 74 WMS (Web Map Service) - είδη αιτημάτων Προεραιτικά κάποιοι εξυπηρετητές υποστηρίζουν και τα παρακάτω αιτήματα: GetFeatureInfo - στέλνοντας μαζί ένα ζεύγος συντεταγμένων (ένα σημείο) επιστρέφει πληροφορίες σχετικά με τα γεωγραφικά αντικείμενα που βρίσκονται στο σημείο αυτό. DescribeLayer GetLegendGraphic - επιστρέφει μια εικόνα με το υπόμνημα του χάρτη

75 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 75 Επιπλέον δυνατότητες της WMS υπηρεσίας Αλλαγή του χαρτογραφικού συμβολισμού: επιλογή ενός υφιστάμενου αρχείου SLD (σε κάποιους servers δυναμική αλλαγή του συμβολισμού με το αίτημα) Καθορισμός της γεωγραφικής έκτασης που ενδιαφέρει κάθε φορά Καθορισμός ενός ή περισσότερων χαρτογραφικών επιπέδων που υπάρχουν στον εξυπηρετητή Καθορισμός ΣΓΑ του χάρτη

76 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 76 WMS: παράδειγμα από GetMap ερώτημα bbox=-130,24,-66,50 &request=getmap &styles=population &Format=image/png &layers=topp:states &width=550 &height=250 &srs=epsg:4326

77 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 77 WMS getmap ερώτημα bbox=-130,24,-66,50&styles=population& Format=image/ png&request=getmap&layers=topp:states &width=550&height=250&srs=epsg:4326 Αίτημα για χάρτη Φόρτωση δεδομένων Φιλτράρισμα δεδομένων Εφαρμογή κανόνων συμβολισμού Δημιουργία εικόνας Δεδομένα Αρχείο SLD PNG

78 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 78 Το αποτέλεσμα από το WMS getmap ερώτημα PNG

79 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή Μία υπηρεσία WMS για τον ελληνικό χώρο 79

80 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 80 Πως κάνει το αίτημα ο πελάτης στον εξυπηρετητή Ανάλογα την εφαρμογή HTML/CSS/JS που τρέχει σε έναν περιηγητή, ο χάρτης μπορεί να ζητηθεί ως μία ενιαία εικόνα σε ένα αίτημα ως χωριστά πλακίδια (tiles) σε πολλά ασύγχρονα αιτήματα

81 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 81 WMS - Δυναμική δημιουργία ή προετοιμασία; Αν τα γεωχωρικά δεδομένα από τα οποία δημιουργείται ο χάρτης αλλάζουν συχνά, αφήνουμε την υπηρεσία να παράγει το χάρτη σε κάθε αίτημα του πελάτη Αν τα γεωχωρικά δεδομένα δεν αλλάζουν, οι χάρτες μπορούν να προκατασκευασθούν μειώνοντας σημαντικά το χρόνο απόκρισης. Η προκατασκευή γίνεται με τη δημιουργία cache (κρυφής μνήμης). Παράδειγμα λογισμικού: GeoWebCache

82 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 82 WMSΤ: Pre-rendered tiles WMST: Απλοποιημένη υπηρεσία WMS Για κάθε ένα επίπεδο μεγέθυνσης, δημιουργούνται εικόνες - πλακίδια (tiles) Σε κάθε αίτημα του πελάτη επιστρέφεται ένα ή περισσότερα προετοιμασμένα πλακίδια Προέρχεται από το πρότυπο TMS (Tiled Map Service)

83 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 83 Tiling scheme

84 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 84 Tiling scheme Υπάρχει ένα προκαθορισμένο σχήμα οργάνωσης και διαίρεσης του γεωγραφικού χώρου σε πλακίδια που χρησιμοποιούν οι πιο γνωστοί πάροχοι διαδικτυακών χαρτών (Google Maps, Bing Maps ) Αυτό το σχήμα είναι κοινό στον πελάτη (Javascript) και στον εξυπηρετητή (GeoServer )

85 Επίπεδο Μέτρα / εικονοστοιχείο Κλίμακα (προσεγγιστικά) Αριθμός πλακιδίων :500 million :250 million :150 million :70 million :35 million :15 million :10 million :4 million :2 million :1 million : : : : : : : : : :

86 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 86 WFS (Web Feature Service) Αλλάζει τον τρόπο με τον οποίο η γεωγραφική πληροφορία δημιουργείται, επεξεργάζεται και διαμοιράζεται στον Παγκόσμιο Ιστό. Αντί του συνήθους διαμοιρασμού σε επίπεδο αρχείων, για παράδειγμα μέσω του πρωτοκόλλου, η υπηρεσία WFS προσφέρει άμεση πρόσβαση στο επίπεδο του γεωγραφικού αντικειμένου, τόσο ως προς τα γεωμετρικά του χαρακτηριστικά όσο και ως προς τις συνοδευτικές του ιδιότητες. Το πρότυπο περιέχει καθορισμούς για διαδικασίες ανακάλυψης, δημιουργίας ερωτήματος, κλειδώματος οντοτήτων, συναλλαγών καθώς και διαδικασίες διαχείρισης αποθηκευμένων παραμετροποιημένων ερωτημάτων. Με το πρότυπο WFS ο εξυπηρετητής επιστρέφει διανυσματικά δεδομένα

87 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 87 WFS (Web Feature Service) - είδη αιτημάτων GetCapabilities - ερώτημα προς τον εξυπηρετητή το οποίο επιστρέφει τις διαθέσιμες δυνατότητες. DescribeFeatureType - ανάκτηση του σχήματος XML ώστε ο πελάτης να μπορεί να καταλάβει τα αποτελέσματα του ερωτήματος GetFeature. GetFeature - με αυτήν την επιλογή γίνεται το καθεαυτό ερώτημα για γεωγραφικά αντικείμενα. Συνοδεύεται και από άλλες παραμέτρους όπως τη γεωγραφική έκταση, σύστημα συντεταγμένων κλπ. Επιστρέφει τα αποτελέσματα υπό τη μορφή GML που περιέχει τόσο τη γεωμετρία όσο και τις ιδιότητες (attributes) των γεωγραφικών αντικειμένων.

88 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 88 WFS getfeature ερώτημα Αίτημα (GML) <?xml version="1.0" encoding="utf-8"?> <wfs:getfeature service="wfs" version="2.0.0" xmlns:wfs=" xmlns:fes=" xmlns:sf=" xmlns:xsi=" xsi:schemalocation=" schemas.opengis.net/wfs/2.0/wfs.xsd"> <wfs:query typenames="sf:bugsites"> <fes:filter> <fes:resourceid rid="bugsites.3"/> </fes:filter> </wfs:query> </wfs:getfeature> Φόρτωση δεδομένων Φιλτράρισμα δεδομένων Κωδικοποίηση αποτελέσματος <wfs:featurecollection xmlns:xs=" xmlns:sf=" xmlns:wfs=" xmlns:gml=" xmlns:xsi=" numbermatched="1" numberreturned="1" timestamp=" t23:06:05.368z" xsi:schemalocation=" wfs.xsd test.hua.gr:8080/geoserver/wfs? service=wfs&version=2.0.0&request=describe FeatureType&typeName=sf%3Abugsites geoserver/schemas/gml/3.2.1/ gml.xsd"><wfs:member><sf:bugsites gml:id="bugsites. 3"><sf:the_geom><gml:Point srsname="urn:ogc:def:crs:epsg::26713" srsdimension="2"><gml:pos> </ gml:pos></gml:point></sf:the_geom><sf:cat>3</ sf:cat><sf:str1>beetle site</sf:str1></sf:bugsites></ wfs:member></wfs:featurecollection> Δεδομένα GML

89 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 89 WFS-Transaction (WFS-T) Ενώ η υπηρεσία WFS επιτρέπει την ανάκτηση οντοτήτων, μια υπηρεσία WFS-T επιτρέπει τη δημιουργία, διαγραφή και ενημέρωση / επεξεργασία των οντοτήτων

90 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 90 Κριτήρια δημιουργίας και χρήσης υπηρεσιών WMTS ή TMS: Για την παραγωγή στατικών χαρτών από raster δεδομένα για τα οποία δεν μας ενδιαφέρει η τιμή του εικονοστοιχείου, π.χ. μωσαϊκό από αεροφωτογραφίες, μωσαϊκό από σαρωμένους χάρτες WMS: Για την παραγωγή δυναμικών ή στατικών χαρτών από raster δεδομένα για τα οποία μας ενδιαφέρει η τιμή του εικονοστοιχείου Για την παραγωγή δυναμικών ή στατικών χαρτών από vector δεδομένα για τα οποία μας ενδιαφέρουν οι ιδιότητες των οντοτήτων

91 Γεωχωρικές διαδικτυακές υπηρεσίες στον εξυπηρετητή 91 Κριτήρια δημιουργίας και χρήσης υπηρεσιών WFS: Για την παραγωγή δυναμικών χαρτών από vector δεδομένα για τα οποία μας ενδιαφέρει το σύνολό τους ή ένα υποσύνολο κάθε φορά καθώς και οι ιδιότητές τους. WFS-T Για την παραγωγή επεξεργάσιμων, δυναμικών χαρτών από vector δεδομένα

92 client Περιηγητής διαδικτύου Λογισμικό (Chrome ) HTML/CSS JavaScript XML, JSON, GeoJSON Γραφικά (SVG, Εικόνες) Βίντεο, ήχος Εφαρμογή desktop / mobile Λογισμικό (QGIS, ArcMap ) διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο server Εξυπηρετητής Διαδικτύου Λογισμικό (Apache, IIS ) Αρχεία HTML/CSS/JavaScript Στατικά Εκτελέσιμα αρχεία (PHP ) Εξυπηρετητής Διαδικτυακών Γεωχωρικών Υπηρεσιών Λογισμικό (Geoserver, ArcGIS Server ) Αρχεία με γεωχωρικά δεδομένα Αρχεία με περιγραφικά δεδομένα Αρχεία με άλλα δεδομένα Σύστημα Διαχείρισης Βάσης Δεδομένων Λογισμικό (MySQL, PostGRES ) Γεωχωρικά, Μη γεωχωρικά 92

93 client Περιηγητής διαδικτύου Λογισμικό (Chrome ) HTML/CSS JavaScript XML, JSON, GeoJSON Γραφικά (SVG, Εικόνες) Βίντεο, ήχος Σενάριο 1ο: Η συνηθισμένη περίπτωση πρόσβασης σε έναν web server από τον browser διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο server Εξυπηρετητής Διαδικτύου Λογισμικό (Apache, IIS ) Αρχεία HTML/CSS/JavaScript Στατικά Εκτελέσιμα αρχεία (PHP ) Αρχεία με γεωχωρικά δεδομένα Αρχεία με περιγραφικά δεδομένα Αρχεία με άλλα δεδομένα Σύστημα Διαχείρισης Βάσης Δεδομένων Λογισμικό (MySQL, PostGRES ) Γεωχωρικά, Μη γεωχωρικά 93

94 client Περιηγητής διαδικτύου Λογισμικό (Chrome ) HTML/CSS JavaScript XML, JSON, GeoJSON Γραφικά (SVG, Εικόνες) Βίντεο, ήχος Σενάριο 2ο: Πρόσβαση στον map server από μια εφαρμογή στον browser διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο διαδίκτυο server Εξυπηρετητής Διαδικτυακών Γεωχωρικών Υπηρεσιών Λογισμικό (Geoserver, ArcGIS Server ) Αρχεία με γεωχωρικά δεδομένα Αρχεία με περιγραφικά δεδομένα Αρχεία με άλλα δεδομένα Σύστημα Διαχείρισης Βάσης Δεδομένων Λογισμικό (MySQL, PostGRES ) Γεωχωρικά, Μη γεωχωρικά 94

95 Οι διεθνείς οργανισμοί και τα πρότυπα 95 Πρότυπα και οργανισμοί Το ανοικτό λογισμικό αυξάνει τη διαθεσιμότητα των εργαλείων σε χρήστες και προγραμματιστές Τα ανοικτά πρότυπα είναι απαραίτητα για την επίτευξη της διαλειτουργικότητας (interoperability) Δύο διεθνείς οργανισμοί: OSGeo και OGC

96 Οι διεθνείς οργανισμοί και τα πρότυπα 96 OSGeo ( Open Source Geospatial Foundation (OSGeo) Μη κερδοσκοπικός οργανισμός με αποστολή την ενθάρρυνση των ανοικτών τεχνολογιών στη γεωπληροφορική Τα projects είναι όλα διαθέσιμα χωρίς κόστος με άδεια ανοικτού κώδικα

97 Οι διεθνείς οργανισμοί και τα πρότυπα 97 OSGeo projects Content Management Systems GeoNode Desktop Applications GRASS GIS QGIS Geospatial Libraries PostGIS Metadata Catalogs GeoNetwork Λογισμικό Web Mapping GeoServer MapServer OpenLayers

98 Οι διεθνείς οργανισμοί και τα πρότυπα 98 OGC (Open Geospatial Consortium) International not for profit organization Making quality open standards freely available for anyone

99 Οι διεθνείς οργανισμοί και τα πρότυπα 99 Πρότυπα από τον OGC ( Geography Markup Language (GML) KML Styled Layer Descriptor (SLD)

100 Οι διεθνείς οργανισμοί και τα πρότυπα 100 Πρότυπα διαδικτυακών υπηρεσιών από τον OGC Web Coverage Processing Service (WCPS) Web Coverage Service (WCS) Web Feature Service (WFS) Web Map Context (WMC) Web Map Service (WMS) Web Map Tile Service (WMTS) Web Processing Service (WPS) Web Service Common (WSC)

101 Ερευνητικά θέματα 101 Τάσεις στην ερευνητική και εφαρμοσμένη διαδικτυακή χαρτογραφία Mapping with vector data (vector tiles) Geovisualization Web 2.0, Semantic Web, GeoWeb Crowd-sourcing, Volunteered Geographic Information Geotagging Mash-ups Visualization of / for social media Big Data Tracking and modeling human behaviour Citizens as volunteered sensors

102 Ερευνητικά θέματα 102 Ενδεικτική βιβλιογραφία και πηγές Kraak and Allan Brown (eds), Web Cartography, Francis and Taylor, New York, 2001 Στεφανάκης Ε, Τεχνολογίες δημοσιοποίησης χαρτογραφικού περιεχομένου στον Παγκόσμιο Ιστό, Αθήνα 2009 Neumann A., 2008, Web Mapping and Web Cartography, In Encyclopedia of GIS (Shekar S., Xiong H., eds.), New York: Springer Science, Mozilla Developer Network: Geoserver: OpenLayers: