Open Layers Workshop

Jorge Sanz - @xurxosanz
Alberto Romeu - @alrocar
  

Before we start, let's stop 
and see where we are...


svg version

Objectives

  1. Why to use Open Layers
  2. Understand OL concepts: map, layers,...
  3. Learn how to
    1. add WMS and cached layers
    2. add WFS and other vector layers
    3. add some interactivity to your map
    4. apply rules to your vector layers
    5. apply styles to your vector layers 

Outline

  1. The Open Layers project
  2. Open Layers basics
  3. Working with layers
  4. Working with controls
  5. Vector layers

Open Layers

 

  • Mature, well established
  • For years THE web mapping framework
  • Great support for standards
    • WMS/WFS/WMTS/TMS
    • GML/KML/GeoRSS/WMC...
  • New challenges
    and competition (Leaflet)
  • Users and developers mailing lists
  • Beginner's guide and
    cookbook available

Open Layers basics

Your first map


Dissect your map

  • markup
    • where you put the map
  • styles
    • how big is your map?
  • initialization code
    • after loading OL library
    • order is important

Open Layers resources

Working with layers

WMS Layers

  • Constructor with 3 parameters
    • Name of the layers in your viewer
    • URL of the service
    • Parameters to pass to the service
      • WMS layers to load
      • image format
      • transparency
      • ...

Cached layers

  • Images already rendered at the server
  • Several formats
  • OpenStreetMap is a typical base map
  • EPSG:3857 (see epsg-registry for details)
  • OSM accepts custom urls

Proprietary layers

  • There are some proprietary
    services available by default
    • Bing
    • Google Maps
    • ArcIMS
    • ArcGIS Server REST (9.3)
  • Others via custom code
  • Usually need to accept a Terms of Service,
    get an API key, etc.

Vector Layers

Minimum parameters of a vector layer constructor: 
  • A layer name
  • A configuration object with:
    • A list o strategies
      • When your data is requested
      • Ordered
      • Independent
    • A protocol
      • How your data is requested
      • Deal with data format

More on vector layers later

Bonus exercises

    • Visit the USGS web portal and try to represent other earthquakes documents (KML for example?)
    • Create a selection control and try to show below your map additional information stored on your earthquakes vector layer

Bonus exercises


 

Working with Controls

Controls

  • Add interactivity to the map
  • Not all provide a user interface
  • Some are loaded by default
    • Navigation
    • PanZoom
  • Examples:
    • Overview map
    • Scale line
    • Selection tools
    • Drawing tools
    • and many more
 

Vector Layers

Open Layers and vector concepts

"Dealing with vector layers and features is like a postal service"

  • Format: 
  • Protocol
    • the way you put your address on the envelope
    • independent of the format or the features
    • i.e. through national post service or USPS, writing down the address or using a barcode?
  • Strategy
    • when you send your letter to the addresses
    • i.e. as written or go to the post office every Monday?

Creating new features

  • Just create, without persisting yet
  • Create a checkbox to activate/deactivate the control
  • Create a OpenLayers.Control.DrawFeature
  • Create a function to toggle the control

Persisting features

  • We use the transactional profile of WFS
  • We need to add a couple of controls
  • Add the OpenLayers.Strategy.Save
  • Add a new EditingPanel control to the map
  • Check the changes on the GeoServer layer preview

Vector Styling

  • To apply a style we need to use filters
  • Symbolizers are similar to CSS
  • A rule joins a filter with a symbolizer
  • A style is a group of rules with a default symbolizer
  • A style map is a map of render intents with styles
Made with Slides.com