Open layers
Download as PPTX, PDF1 like468 views
OpenLayers (OL) is an open-source JavaScript library for displaying map data in web applications. It can display data from various sources like GeoJSON, WMS, WFS and supports interactions like querying, filtering and overlaying layers. OL has evolved over the years with new versions introducing features like improved projections support, 3D rendering and compatibility with modern standards. While Leaflet is better for simpler uses due to its large plugin ecosystem, OL is more powerful and flexible for complex GIS applications and supports advanced OGC protocols out of the box.
Open layers
- 2. Open Layers (OL), history, versions, what it can do, features, compatible, leaflet vs OL , google trend, leaflet over OL, OL over Leaflet, the choice?, some practical examples, How ol grows, in short CONTENTS
- 3. OPEN LAYERS(OL) Lightweight Open source JavaScript library Displays map data in the form of tiles Provides API for web based geographic applications Provided under 2- clause BSD license (Simplified or Free)
- 4. HISTORY 2005 Before Originally based on the Prototype JS Framework for Ajax support in Ruby on Rails 2005 June 29-30, 2005 • Created by MetaCarta as per its business needs • After the O’Reilly Where 2.0 Conference 2006 June 13-14.2006 • Released as open source • After the Where 2.0 Conference Nov. 2007 onwards • owned by Open Source Geospatial Foundation Project
- 5. VERSIONS June 2006 latest V1 released July 2013 •latest V2 released •updated filter encoding and GML 12 Dec. 2016 latest V3 compatible to HTML5 and CSS3 released rewriting of OL with new API 20 Mar. 2017 latest V4 released introduced semantic versioning 6 Nov. 2018 Latest V5, no longer compatible to closure-util released standardized as ES modules, type checking, rendering tests Note: Currently V6 with new layer interface and immediate rendering API is just released
- 6. WHAT IT CAN DO displaying interaction processing the three pillars
- 7. DISPLAYING GML KML GeoRSS GeoJSON and map data from any source within OGC standards as WMS or WFS
- 8. DISPLAYING visualizing geotiff files Source: https://openlayers.org/en/latest/examples client side reprojection flight animation
- 9. layers swipe OL-Cesium integration library for 2D/3D Comparison DISPLAYING Source: https://maps.nls.uk/geo/explore/side-by-side/swipe/#zoom=10&lat=50.9946&lon=-3.1531&layers=1&right=BingHyb
- 10. INTERACTING /QUERYING draw and modify features select features query WMS with GetFeatureInfo query UTF Grid-population census
- 11. INTERACTING /QUERYING Ol is more than zooming and panningquery the client-side vector* *can also query the vector on the server through Get and Push URL
- 12. PROCESSING vector processing Using JSTS vector processing Using Turf I2maps (a geo-computing env.) JSTS: js library for processing and analyzing geometries Turf: simple, modular and fast js library for geospatial analysis framework for knowledge discovery from spatio- temporal data
- 13. OTHERS OpenLayers Timeline: creates a time related maps Timemap.js: to use different maps with simile(widget) timeline. Geolocation tracking heatmaps …and many more @ https://openlayers.org/en/latest/exampl es/ Demo: http://elasticterrain.xyz/#map
- 14. FEATURES Tiled Layers pulls tiles from OSM, Bing, MapBox, Stamen or other sources supporting OGC standards Cutting Edge, Fast & Mobile Ready pulls Canvas 2D, WebGL for graphics, and all the latest features from HTML5 and supports mobile Easy to Customize and Extend straight-forward CSS, easy to customize and extend functionality. Source: https://openlayers.org/ Projection System can deal with many projections, the default:- Web Mercator projection (EPSG:3857)
- 15. and all the browsers that support HTML5 and ECMAScript 5. For older platforms like IE <9 or Android <4.x polyfills are required COMPATIBLE recreates the missing features to support different browsers
- 18. LEAFLET OVER OL Some plugins: heatmap.js, Leaflet.MultiTileLayer, Leaflet Data Visualization Framework (DVF), Proj4Leaflet, plugins for geocoding, routing, geometries and many more Source: https://mappinggis.com/2016/11/openlayers-vs-leaflet-mejor/ retrieved on 29th Sept, 2019 easy to learn, basic GIS knowledge to display maps Better architecture and internal design better look and feel large no. of plugins (200 vs a dozen) Better visualization for cell phones API Documentation easier to understand than OL
- 19. OL OVER LEAFLET supports all webGIS protocols like WFS, GML, WMTS,MVT no plugins needed more examples and workshops Better 3D visualization Better integration of projection system more features on map controls Better for complex GIS applications
- 20. THE CHOICE? the 80/20 rule: if you can achieve your requirement by only 80% i.e you don’t have advanced requirements like canvas rotation, elastic terrain, OGC web services, go with leaflet if your requirements grow beyond 80%, choose open layers for the following reasons: get rid of variation of code quality of third party plugins feature coverage is larger than leaflet 230000 lines of code vs 7000 lines of codes (as of 2015) eliminate the risk of switching later this is what common web mapping agencies, companies do nowadays Source:https://labs.webgeodatavore.com/presentation-openlayers-foss4g-uk-2016/#/3 simplicity vs features and flexibility I suggest: As a novice of web mapping •leaflet As a professional/company •OL
- 21. some practical examples BIKESHARE MAP OF LIVERPOOL Source:https://bikesharemap.com/liverpool/#/14.004256430257946/-2.956/53.3989/
- 22. CDRC MAP SHOWS THE INDEX OF MULTIPLE DEPRIVATION OF ENGLAND Source: https://maps.cdrc.ac.uk/#/geodemographics/imde2019/default/BTTTFFT/10/-0.1500/51.5200/
- 23. SIMD MAP SHOWS THE SCOTTISH INDEX OF MULTIPLE DEPRIVATION 2016 Source: https://simd.scot/2016/#/simd2016/BTTTFTT/9/-4.0000/55.9000/
- 24. TUBECREATURE SHOWS THE LONDON TUBE DATA MAP https://tubecreature.com/#/total/current/same/*/*/FFTFTF/13/-0.1000/51.5200/
- 25. HOW OL GROWS SUPPORTED BY camptocamp swisstopo boundless terestris flightaware 1000museums adelphic bae systems zibby maptia Code sprints organized at geomapfish
- 26. IN SHORT It is a powerful tool Need research for betterment of existing features Collaboration with other js libraries Addition of new features OL powers in serving wider market reach
- 31. FUTURE more improvisation for Mobile Web sensors Cloud computing Laptops
- 32. FLIGHT ANIMATION SHOWS HOW TO USE POSTRENDER AND VECTORCONTEXT Source: https://openlayers.org/en/latest/examples/flight-animation.html
- 33. UML Class Diagram of OL
Editor's Notes
- #8: GeoRSS is a specification for encoding location as part of a Web feed. KML: Keyhole Markup Language is an XML notation for expressing geographic annotation and visualization GML: Geography Markup Language is an XML to express geographical features.
- #10: OpenLayers - Cesium integration library
- #11: UTFGrid. The UTFGrid encoding scheme encodes interactivity data for a tile in a space efficient manner. It is designed to be used in browsers, e.g. for displaying tooltips when hovering over certain features of a map tile.
- #13: Turf.js:Simple-Modular, simple-to-understand JavaScript functions that speak GeoJSON , Modular-Turf is a collection of small modules, you only need to take what you want to use, FastTakes advantage of the newest algorithms and doesn't require you to send data to a server I2maps: Provides web visualization with interactive interface of framework for knowledge discovery from spatio-temporal data
- #16: Polyfills: It's a service which accepts a request for a set of browser features and returns only the polyfills that are needed by the requesting browser. ECMAScript (or ES) is a scripting-language specification standardized by Ecma International in ECMA-262 and ISO/IEC 16262. It was created to standardize JavaScript, to foster multiple independent implementations.
- #22: Bikesharp (formerly the Bike Share Map) shows the locations of docking stations associated with bicycle sharing systems from 400+ cities around the world. Each docking station is represented by a circle, its size and colour depending on the size and number of bicycles currently in it. The maps generally update every few minutes. There is a version that replays the last 48 hours of colour and size changes. In many cities, an ebb and flow of cycle commuters can be seen.
- #23: Welcome to the Consumer Data Research Centre (CDRC)
- #26: Camptocamp,swisstopo,terestris,boundless,flightaware,1000museums,adelphic,bae systems,zibby,maptia Once a year, a code sprint gathers the most dedicated developers for a collocated week in a remote place with good bandwidth. This strengthen the community spirit and delivers brilliant technical updates. Outreach The community outreaches at special technical conferences, like FOSS4G and their local events. Let’s support sending committers to these event so that everyone gets the latest updates.
- #33: This example shows how to use postrender and vectorContext to animate flights. A great circle arc between two airports is calculated using arc.js and then the flight paths are animated with postrender. The flight data is provided by OpenFlights (a simplified data set from the Mapbox.js documentation is used)