GeoJSON
Een “nieuw” vector formaat voor web-based GIS Bart van den Eijnden OSGIS
Inhoud ●
JSON
●
GeoJSON
●
Performance: transport- en parseertijd
●
Best practices in web-based GIS
●
●
OpenLayers
●
GeoExt
●
Proj4JS
Voorbeeld project: GEOZET
Over mezelf ●
1999 afgestudeerd Fysische Geografie Utrecht
●
5 jaar Geodan
●
Sinds 2005 eenmanszaak OSGIS
●
●
Gespecialiseerd in open standaarden en open source GIS Onderdeel van de OpenGeoGroep
Wat is JSON? ●
JSON = JavaScript Object Notation
●
Tekst gebaseerd
●
Leesbaar
●
Lichtgewicht
●
Ondersteuning in vrijwel elke programmeertaal
●
Meer info op: http://www.json.org
JSON voorbeeld {
"gemeentes": [ {"naam": "Deurne", "inwonertal": 30000}, {"naam": "Utrecht", "inwonertal": 300000} ] }
JSON in meer detail ●
Verkorte schrijfwijze voor nieuw object: {}
●
Verkorte schrijfwijze voor nieuw array: []
●
Key value pairs (properties)
●
Gebruik dubbele quote voor strings, escape middels \ dus \”
GeoJSON ●
●
●
Hoe encodeer ik geografische gegevens in JSON? ●
Geometrie
●
Feature
●
Collectie van features
Opgesteld in 2008 door een aantal bedrijven (o.a. MetaCarta, OpenGeo, Cadcorp) Wordt gebruikt in meer dan 20 projecten waaronder FME en Twitter
GeoJSON: geometrie types ●
Point
●
LineString
●
Polygon
●
MultiPoint
●
MultiLineString
●
MultiPolygon
●
GeometryCollection
GeoJSON objecten ●
●
● ●
type property is verplicht en bevat het geometrie type danwel “Feature” of “FeatureCollection” crs property is optioneel en bevat info over het Coordinate Reference System. Volgorde x,y(,z) bbox property is optioneel Geometrie objecten behalve de GeometryCollection dienen een coordinates property te hebben
GeoJSON: Point { "type": "Point", "coordinates": [100.0, 0.0] }
GeoJSON: LineString { "type": "LineString", "coordinates": [ [100.0, 0.0], [101.0, 1.0] ] }
GeoJSON: Polygon { "type": "Polygon", "coordinates": [ [ [100.0, 0.0], [101.0, 0.0], [101.0, 1.0], [100.0, 1.0], [100.0, 0.0] ], [ [100.2, 0.2], [100.8, 0.2], [100.8, 0.8], [100.2, 0.8], [100.2, 0.2] ] ] }
1e element: outerRing 2e en volgende elementen: innerRing
GeoJSON: GeometryCollection { "type": "GeometryCollection", "geometries": [ { "type": "Point", "coordinates": [100.0, 0.0] }, { "type": "LineString", "coordinates": [ [101.0, 0.0], [102.0, 1.0] ] } ] }
GeoJSON: real-life voorbeeld
http://osgis.nl/tmc/data/gemeentes.json
Alternatieve formaten ●
GML = Geography Markup Language = XML
●
KML = Keyhole Markup Language = XML
●
SVG = Scalable Vector Graphics = XML ●
Voordeel: vaak geen transformatie nodig in de browser (Internet Explorer vanaf 9, Firefox, Safari, Chrome)
●
EWKT = extended Well-Known Text
●
EWKB = extended Well-Known Binary
Wat bepaalt de keuze? ●
Transport-tijd ●
● ●
Hoe groter het bestand, hoe langer het transport duurt naar de client. M.a.w. hoe kleiner de payload, hoe beter. Denk aan GZIP!
Parseertijd Tijd om te renderen in de browser (eventuele transformatie)
Rendering ●
●
●
Renderen van features in de browser is nu de bottleneck: paar 100 features maximaal. In 2010 komt 2D/3D hardware acceleratie in de browser: ●
Firefox 4
●
Internet Explorer 9
●
Google Chrome
Dit wordt een revolutie voor web-based GIS: native javascript gaat richting Flash!
Payload onderzoek Bron: http://www.tokumine.com/2010/09/20/gis-data-payload-sizes/
Op de x-as: payload in bytes. Hoe kleiner hoe beter!
Gemeten parseertijden ● ●
● ●
●
Gemeentekaart CBS Laat Geoserver output generen, plaats dit op een localhost Apache Gemiddelde van 5 runs Geen Internet Explorer want alleen in VMWare beschikbaar op Mac OSX, geen eerlijke vergelijking! Let op: OpenLayers gebruikt momenteel niet de native JSON parser van de browser, zie ook: http://trac.osgeo.org/openlayers/ticket/1807
Parseertijden Mac OSX (ms) 1800
1600
1400
1200
1000 JSON GML
800
600
400
200
0 Firefox 3.6.10
Safari 5.0.2
Chrome 6.04
Opera 10.62
Probeer het zelf ●
http://osgis.nl/tmc/tmc.html?format=GEOJSON
●
http://osgis.nl/tmc/tmc.html?format=GML
Best practices ●
OpenLayers
●
GeoExt
●
Proj4JS
●
All-in-one: OpenGeo Suite!
OpenLayers ●
●
●
●
De-facto standaard javascript bibliotheek voor webmapping Ondersteunt vele typen lagen zoals Google Maps, Bing Maps, OpenStreetMap, WMS, WMTS, TMS, WMS-C, WFS Zeer ruime OGC ondersteuning: WMS, WFS, WFS-T, WMTS, Web Map Context, OWSContext, SLD, SOS Ondersteunt vele formaten: GML, KML, GeoJSON, GeoRSS, GPX
OpenLayers ●
●
Beste manier om OpenLayers te leren is middels de vele examples: http://www.openlayers.org/dev/examples/
GeoExt ● ●
●
●
GeoExt koppelt OpenLayers aan Ext JS Ext JS is een dual-licensed (GPL v3 en commercieel) javascript (GUI) framework Een voorbeeld is een GeoExt.MapPanel welke een brug vormt tussen een Ext.Panel en een OpenLayers.Map GeoExt maakt de redelijk basische OpenLayers GUI tot een fancy GUI!
GeoExt ●
MapPanel
●
LegendPanel
●
ZoomSlider
●
Layer trees (table of content)
●
Toolbars
●
Interactie met de MapFish print service (PDF output)
GeoExt voorbeeld: Styler
GeoExt voorbeeld: GeoExplorer
GeoExt voorbeeld: GeoEditor
Proj4JS ● ●
●
●
Javascript poort van Proj.4 (Frank Warmerdam) OpenLayers komt standaard met alleen transformaties tussen EPSG:4326 en de Google Web Mercator Bijna alle andere CRS-en zoals RD zijn beschikbaar via Proj4JS Je kan dus in je browser transformeren tussen CRS-en, maar het is natuurlijk efficiënter om dit aan de serverkant te doen
Voorbeeld project: GEOZET ● ●
●
●
●
Geografische zoek- en toondienst Voor Geonovum in opdracht van ICTU (Binnenlandse zaken) Generieke viewer en geocoder interface, in eerste instantie bedoeld om bekendmakingen van o.a. gemeentes in beeld te brengen. Maakt gebruikt van jQuery, Ext JS, GeoExt en OpenLayers. Accessibility is erg belangrijk!
GEOZET ●
●
Server-side clustering op provincie, gemeente en wijk niveau (in PostGIS database) Client-side clustering voor individuele bekendmakingen wanneer deze te dicht op elkaar liggen
GEOZET
GEOZET
GEOZET
Samenvatting [1/2] ●
●
●
GeoJSON is een encoding van geografische objecten in JSON GeoJSON is geen standaard van het Open Geospatial Consortium Payload van GeoJSON is relatief groot, maar verschillen zijn klein
Samenvatting [2/2] ●
●
●
Parseertijd van JSON is normaal gesproken kleiner dan van XML, maar situatie verschilt per browser Vector rendering zou in de nieuwe generatie browsers veel sneller moeten gaan De OpenGeo Suite is een one-click installer voor een hele interessante Open Source GIS stack (PostGIS, GeoServer, GeoWebCache, OpenLayers, GeoExt)
Vragen?
[email protected] 06-42233115
