openlayers 3

OL3http://erilem.net/talks/foss4g2013/ol3.html

IntroIntroducing OpenLayers 3

http://ol3js.org/

Outline1. Vision2. Design principles3. Features4. Demos5. Swisstopo application6. Status update

VisionWhere OL3 is going

2D 3D Convergence

(Image courtesy of the OSM-3D.org project)

Client-side rendering

Maps are Graphics

Where does OL3 fit?

OpenLayers 2

OpenLayers 3

Designprinciples

SoC - 1/3(Separation of Concerns)

SoC - 2/3MapMap has a rendererMap has a viewMap has layersLayers have sources

SoC - 3/3Interactions vs Controls

Interactions respond to browser events on the mapControls have a presence in the DOM

High-PerformanceFor example:

Avoid boxing/unboxing operationsBe nice with the GC and reuse objectsUse rAF and watch the frame rateRedraw as few pixels as possibleUse Closure Compiler

No opinion on the UIUse CSSProvide objects for integration with other libs(ol.Overlay)

FeaturesVarious tile sources/providers: OSM, XYZ, Stamen,TileJSON, Bing Maps, WMTS, WMSControls: Attribution, Full-screen, Mouse position,Scaleline, Zoom, Zoom sliderVector layer: rule-based styling with powerfulexpression systemParsers: GeoJSON, GPX, KML, FE, GML, WMSCapabilities, WMTS CapabilitiesAnimationsGeolocation, Device orientation

Demos

Map with controlsmap with controls example

Animationsanimation example

geo.admin.ch Third Release

New map.geo.admin.chviewer

Based on OpenLayers 3, AngularJS 1.2 & Bootstrap 3.0ComponentsMobile & desktop: all in oneRE2: 650 Ko / RE3: 250 KoIn production on 17.10.2013Code on Github

Responsiveness - phone

Responsiveness - tablet

Responsiveness - desktop

Demomap.geo.admin.ch

Status update3.0.0 beta1 about to be releasedThings in the work:

New web siteNew build systemWebGL vectorVector editing

Thanks!