OpenLayers: Data Integration 1 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers: Data Integration in an Open Source Map Browser Prof. Dr. Franz-Josef Behr Hochschule für Technik, Stuttgart

OpenLayers: Data Integration 2 Prof. Dr.-Ing. Franz-Josef Behr Outline Introduction OpenLayers –Features, history, components –Code example –Software development features –Types and integration of data layers Conclusion –Examples –Remarks

OpenLayers: Data Integration 3 Prof. Dr.-Ing. Franz-Josef Behr Awareness and Ignorance 05T170415Z_01_N _RTRUKOC_0_US-FOSSETT-TECH.xml

OpenLayers: Data Integration 4 Prof. Dr.-Ing. Franz-Josef Behr History Google Maps 2006 Yahoo! Maps API Microsoft Virtual Earth API Yahoo! Maps API V2 Microsoft Live Local Kosmosnimki NASA World Wind Microsoft Live Local 3D Géoportail Géoportail 3D Google Acquires Keyhole BayernViewerBayernViewer 3D OpenLayers

OpenLayers: Data Integration 5 Prof. Dr.-Ing. Franz-Josef Behr Web as platform Participa- tion Content syndication Web services Conceptual & social Technical XMLRSS JavaScriptAJAX … Web 2.0 …..…… …… Introduction: The Web 2.0 idea an emerging change in paradigm in what the World Wide Web is and how it works -> decentralisation. implies conceptual, technical and social aspects.

OpenLayers: Data Integration 6 Prof. Dr.-Ing. Franz-Josef Behr GeoWeb – the Geo part of Web 2.0 … merging of geographical (location-based) information with the abstract information of traditional web sites. Huge amount of data available High interest on tools like Google Map API: ~90 mails / day Geotagging: –“On the Flickr photo-sharing service … users have “geotagged” more than 25 million pictures, providing location data that allows them to be viewed on a map or through 3-D visualization software like Google Earth.“ 1 –platial.com: Access to > locations 1 4ae4a9&ei=5124&partner=permalink&exprod=permalink

OpenLayers: Data Integration 7 Prof. Dr.-Ing. Franz-Josef Behr [Free] Map Browsers Google Maps, Yahoo! Maps API, Microsoft Live Local, MapGuide Open Source, OpenLayer, FlashEarth, WorldKit, ka-Map, deegree iGeoPortal, –WMS, WFS, WCS, Catalogue Service, Gazetteer Service MappingWidgets, –WMS, zoom in, zoom out, pan, info, overview Chameleon, p.mapper, –based on UMN MapServer/PHP/MapScript, zoom/pan, query, etc.UMN MapServer WMS Mapper, WMS, zoomhttp://wms-map.sourceforge.net/

OpenLayers: Data Integration 8 Prof. Dr.-Ing. Franz-Josef Behr Outline Introduction OpenLayers –Features, history, components –Code example –software development process –Types and integration of data layers Conclusion

OpenLayers: Data Integration 9 Prof. Dr.-Ing. Franz-Josef Behr What is OpenLayers? an API for building web mapping applications, pure client-side object-oriented JavaScript, using components from Prototype.js and the Rico library Prototype.jsRico AJAX (Asynchronous JavaScript and XML) supports open and proprietary data standards / sources efficient tiling BSD licensed (standard licence for open source software, see

OpenLayers: Data Integration 10 Prof. Dr.-Ing. Franz-Josef Behr History of the Project Started after Where 2.0 conference in 2005 Motivated also by MetaCarta's business needs released before Where 2.0 conference in 2006 already used by > 10,000 people is going to become a project of the Open Source Geospatial Foundation. … aims to become "the Apache of web mapping APIs"

OpenLayers: Data Integration 11 Prof. Dr.-Ing. Franz-Josef Behr Components of OpenLayers Maps just a prototype!

OpenLayers: Data Integration 12 Prof. Dr.-Ing. Franz-Josef Behr Simple integration into (X)HTML Including API (remote or local) Creating map object Adding layer Placeholder

OpenLayers: Data Integration 13 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: Versioning and tracking Code and content: in the OpenLayers Subversion (SVN) repository, enabling worldwide development Project management using trac –tracking system for bugs, feature requests, version management etc (“tickets“) –interface to Subversion –allows wiki-like markup in descriptions and messages, creating links and seamless references between tickets, files, and wiki pages. –timeline gives historic view of the project.

OpenLayers: Data Integration 14 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers‘s Subversion System a version control system (successor of CVS) trunk: current version of project branches: copies of original source tags: copies without modifications sandbox: „playground“ for single developers

OpenLayers: Data Integration 15 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: Tracking system

OpenLayers: Data Integration 16 Prof. Dr.-Ing. Franz-Josef Behr Users Mailing lists participants Registered developers (contributors) Project Steering Committee (7 members, Committee Chair –facilitates discussion of proposals, responsible for memberships of the Project Steering Committee. –adjudication in cases of disputes about voting. Democratic process: Addition and removal of members from the committee, as well as selection of a Chair should be handled as a proposal to the committee. OpenLayers development: Groups involved

OpenLayers: Data Integration 17 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: Process Clear and sound development rules: 1.Proposals  OpenLayers dev mailing list  discussion and voting, for at least two business days. 2.Voting: "+1“: indicating support for the proposal and a willingness to support implementation. "-1“: to veto a proposal, must provide clear reasoning and alternate approaches to resolving the problem “-0”: indicates mild disagreement, but no effect; “0”: no opinion, “+0”: mild support, but no effect. 3.Project Steering Committee's votes will be counted. 4.Acceptance: +2 (including the proposer), no vetos (-1). 5.Veto  can be resubmitted for an override vote.

OpenLayers: Data Integration 18 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: Testing Methodology Test.AnotherWay- Framework more than 2100 automated tests ( 07/08/23/automated-testing/)

OpenLayers: Data Integration 19 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: Classes, inheritance Source: Emanuel Schütze, [ ]

OpenLayers: Data Integration 20 Prof. Dr.-Ing. Franz-Josef Behr OpenLayers development: API documentation Source: [ ]

OpenLayers: Data Integration 21 Prof. Dr.-Ing. Franz-Josef Behr Architecture Multi-tier REST-based (Representational state transfer) Internet http Webserver (Proxy) http (REST) OpenLayers Client Local files SQL Geo-DBMS http

OpenLayers: Data Integration 22 Prof. Dr.-Ing. Franz-Josef Behr Layers Classes OGC WFS GeoRSS CSV GML KML WKT OGC WMS Google Maps MSN Live Local Yahoo! Maps Multimap ka-Map WorldWind Raster Layers, tiled Vector Layers, points, lines, polygons rendered with SVG / VML

OpenLayers: Data Integration 23 Prof. Dr.-Ing. Franz-Josef Behr GeoRSS W3C 2006: “a simple model for tagging external content with geographic feature properties which are consistent with the general feature model and syntax of OGC GML.” supported by Yahoo! Maps, Google Maps, Live Local, WorldKit, MapInfo, FME, Drupal, … … Source: cadenhead.org

OpenLayers: Data Integration 24 Prof. Dr.-Ing. Franz-Josef Behr GeoRSS in OpenLayers Presently, two XML serializations are supported: GeoRSS Simple, W3C GeoRSS var georsslayer = new OpenLayers.Layer.GeoRSS(“georss.xml”, value); map.addLayer(georsslayer);

OpenLayers: Data Integration 25 Prof. Dr.-Ing. Franz-Josef Behr GeoJSON JSON = JavaScript Object Notation lightweight data- interchange format efficient use in JavaScript programs also supported by Google Maps { "type": "Feature", "id": "OpenLayers.Feature.Vector_122", "properties": { }, "geometry": { "type": "Point", "coordinates": [ , ] }, "crs": { "type": "EPSG", "properties": { "code": 4326 }

OpenLayers: Data Integration 26 Prof. Dr.-Ing. Franz-Josef Behr OGC‘s Geography Markup Language GML only version 2 support Integration of a GML Layer <feature:features xmlns:feature= fid="OpenLayers.Feature.Vector_156"> 75.2,45.3 map.addLayer(new OpenLayers.Layer.GML("GML", "gml/polygon.xml"));

OpenLayers: Data Integration 27 Prof. Dr.-Ing. Franz-Josef Behr Keyhole Markup Language - KML „I added support for KML point display in about 20 minutes, including the time to find data and write a demo HTML page loading some example data. Adding LineString support was another 15 minutes.“ polygons not yet supported Integration of a KML Layer map.addLayer( new OpenLayers.Layer.GML( "KML", "kml/mc-search.kml", {format: OpenLayers.Format.KML} ) );

OpenLayers: Data Integration 28 Prof. Dr.-Ing. Franz-Josef Behr WMS A WMS layer needs layername, URL, and parameters var map = new OpenLayers.Map('map'); var wmslayer = new OpenLayers.Layer.WMS( "WMS Stuttgart", " { layers:'gruenflaechen,oeffentl_gebaeude,private_gebaeude', VERSION: "1.1.1", units: 'meters‚ transparent: 'false', format: 'image/png' maxExtent: 'new OpenLayers.Bounds(minx,miny,maxx,maxy)', maxResolution': 'auto‚ } ); map.addLayer(wmslayer);

OpenLayers: Data Integration 29 Prof. Dr.-Ing. Franz-Josef Behr WMS GetCapabilities supported by extension 1 GetMap and GetFeatureInfo supported WMS-T support // Register click event map.events.register('click', map, function (e) { // initialize the displaying text $('nodeList').innerHTML = "Loading... "; //define the parameters for getfeatureInfo var url = wmslayer.getFullRequestString({ REQUEST: "GetFeatureInfo", EXCEPTIONS: "application/vnd.ogc.se_xml", BBOX: wms.map.getExtent().toBBOX(), X: e.xy.x, Y: e.xy.y, INFO_FORMAT: 'text/html', QUERY_LAYERS: wms.params.LAYERS, REDIUS:2, WIDTH: wmslayer.map.size.w, HEIGHT: wmslayer.map.size.h}); //get featureInfo OpenLayers.loadURL(url, '', this, setHTML); Event.stop(e); }); //display the result function setHTML(response) { $('nodeList').innerHTML = response.responseText; } 1 see

OpenLayers: Data Integration 30 Prof. Dr.-Ing. Franz-Josef Behr WFS support WFS WFS-Transactional function init(){ OpenLayers.ProxyHost="/proxy/?url="; map = new OpenLayers.Map('map'); layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", " {layers: 'basic'} ); map.addLayer(layer); layer = new OpenLayers.Layer.WFS( "Owl Survey", " {typename: "OWLS", maxfeatures: 10}, { featureClass: OpenLayers.Feature.WFS}); map.addLayer(layer); }

OpenLayers: Data Integration 31 Prof. Dr.-Ing. Franz-Josef Behr Google Maps in OpenLayers

OpenLayers: Data Integration 32 Prof. Dr.-Ing. Franz-Josef Behr var googleLayer = new OpenLayers.Layer.Google( "Google Satellite", {type: G_SATELLITE_MAP, 'maxZoomLevel':18} );

OpenLayers: Data Integration 33 Prof. Dr.-Ing. Franz-Josef Behr var satellite = new OpenLayers.Layer.Google( "Google Maps", {type: G_NORMAL_MAP, 'maxZoomLevel':18} );

OpenLayers: Data Integration 34 Prof. Dr.-Ing. Franz-Josef Behr MSN Virtual Earth in OpenLayers

OpenLayers: Data Integration 35 Prof. Dr.-Ing. Franz-Josef Behr Additionally, OpenLayers supports... Yahoo! Maps MultiMap

OpenLayers: Data Integration 36 Prof. Dr.-Ing. Franz-Josef Behr Outline Introduction OpenLayers –Features, history, components –Code example –Software development features –Types and integration of data layers Conclusion –Examples –Remarks

OpenLayers: Data Integration 37 Prof. Dr.-Ing. Franz-Josef Behr Samples: Integration of SRTM data Source: [ ]

OpenLayers: Data Integration 38 Prof. Dr.-Ing. Franz-Josef Behr Sample: OpenStreetMap aims to be a free editable map of the whole world. etmap.org/ Source: [ ]

OpenLayers: Data Integration 39 Prof. Dr.-Ing. Franz-Josef Behr Conclusion GeoWeb merges locational and abstract information. Driven by users. Several emerging geo-standards developed by general IT stakeholders (GeoRSS, KML). OpenLayers is a promising Open Source web mapping client API. Modern software development tools and processes ensure quality and progress of the work. OpenLayers is capable to integrate many data resources and formats. Powerful, easy to understand and to use.