Merge pull request #3308 from ahocevar/release-v3.3.0

Release v3.3.0

.gitignore

@@ -1,6 +1,7 @@
 *.pyc
-/build
+/build/
 /examples/*.html.png
 /examples/example-list.js
 /examples/example-list.xml
 /node_modules/
+/dist/

.jshintrc

@@ -1,4 +1,5 @@
 {
-	"-W030": true,
-	"-W083": true
+  "-W030": true,
+  "-W083": true,
+  "-W069": true
 }

.npmignore

@@ -0,0 +1,5 @@
+*.pyc
+/build/
+/examples/*.html.png
+/examples/example-list.js
+/examples/example-list.xml

AUTHORS.md

@@ -1,58 +0,0 @@
-OpenLayers contributors:
-
-* Antoine Abt
-* Mike Adair
-* Jeff Adams
-* Seb Benthall
-* Bruno Binet
-* Stéphane Brunner
-* Howard Butler
-* Bertil Chaupis
-* John Cole
-* Tim Coulter
-* Robert Coup
-* Jeff Dege
-* Roald de Wit
-* Schuyler Erle
-* Christian López Espínola
-* John Frank
-* Sean Gilles
-* Pierre Giraud
-* Ivan Grcic
-* Andreas Hocevar
-* Marc Jansen
-* Ian Johnson
-* Frédéric Junod
-* Eric Lemoine
-* Philip Lindsay
-* Martijn van Oosterhout
-* David Overstrom
-* Tom Payne
-* Corey Puffault
-* Peter William Robins
-* Gregers Rygg
-* Tim Schaub
-* Christopher Schmidt
-* Tobias Schwinger
-* Cameron Shorter
-* Pedro Simonetti
-* Paul Spencer
-* Paul Smith
-* Glen Stampoultzis
-* James Stembridge
-* Erik Uzureau
-* Bart van den Eijnden
-* Ivan Willig
-* Thomas Wood
-* Bill Woodall
-* Steve Woodbridge
-* David Zwarg
-
-Some portions of OpenLayers are used under the Apache 2.0 license, available
-in doc/licenses/APACHE-2.0.txt.
-
-Some portions of OpenLayers are used under the MIT license, availabie in
-doc/licenses/MIT-LICENSE.txt.
-
-Some portions of OpenLayers are Copyright 2001 Robert Penner, and are used
-under the BSD license, available in doc/licenses/BSD-LICENSE.txt

CONTRIBUTING.md

@@ -42,7 +42,7 @@ as described below.
 The minimum requirements are:
 
 * Git
-* [Node.js](http://nodejs.org/) 
+* [Node.js](http://nodejs.org/) (0.10.x or higher)
 * Python 2.6 or 2.7 with a couple of extra modules (see below)
 * Java 7 (JRE and JDK)
 
@@ -132,7 +132,7 @@ To run the tests on the console (headless testing with PhantomJS) use the `test`
 
     $ ./build.py test
 
-See also the test-specific [README](../blob/master/test/README.md).
+See also the test-specific [README](../master/test/README.md).
 
 ## Running the integration tests
 
@@ -239,6 +239,14 @@ style of the existing OpenLayers 3 code, which includes:
 
  * Do not use assignments inside expressions.
 
+ * Avoid the use of `goog.array.clone` with arrays (use slice instead).
+
+ * Use `array.length = 0` instead of `goog.array.clear`.
+
+ * Use bracket notation instead of `goog.object.set` and `goog.object.get` (with
+   two arguments).
+
+ * Use uppercase for `@const` variables.
 
 ### Pass the integration tests run automatically by the Travis CI system
 

LICENSE.md

@@ -1,5 +1,4 @@
-Copyright 2005-2014 OpenLayers Contributors. All rights reserved. See
-AUTHORS.md for full list.
+Copyright 2005-2014 OpenLayers Contributors. All rights reserved.
 
 Redistribution and use in source and binary forms, with or without modification,
 are permitted provided that the following conditions are met:

README.md

@@ -1,11 +1,14 @@
 # OpenLayers 3
 
-[![Travis CI Status](https://secure.travis-ci.org/openlayers/ol3.png)](http://travis-ci.org/#!/openlayers/ol3)
+[![Travis CI Status](https://secure.travis-ci.org/openlayers/ol3.svg)](http://travis-ci.org/#!/openlayers/ol3)
 
 Welcome to [OpenLayers 3](http://openlayers.org/)!
 
+## Examples
 Check out the [hosted examples](http://openlayers.org/en/master/examples/), the [workshop](http://openlayers.org/ol3-workshop/) or poke around the evolving [API docs](http://openlayers.org/en/master/apidoc/).
 
-Please don't ask questions in the github issue tracker but use [the mailing list](https://groups.google.com/forum/#!forum/ol3-dev) instead.
+## Questions
+Please don't ask questions in the github issue tracker but use [stackoverflow with tag openlayers](http://stackoverflow.com/questions/tagged/openlayers) or [the mailing list](https://groups.google.com/forum/#!forum/ol3-dev) instead.
 
+## Contributing
 Please see our guide on [contributing](CONTRIBUTING.md) if you're interested in getting involved.

bin/BeautifulSoup.py

@@ -1095,7 +1095,7 @@ class BeautifulStoneSoup(Tag, SGMLParser):
             p = self.tagStack[i]
             if (not p or p.name == name) and not isNestable:
                 #Non-nestable tags get popped to the top or to their
-                #last occurance.
+                #last occurrence.
                 popTo = name
                 break
             if (nestingResetTriggers != None
@@ -1242,14 +1242,14 @@ class BeautifulSoup(BeautifulStoneSoup):
 
     * Tag nesting rules:
 
-      Most tags can't be nested at all. For instance, the occurance of
+      Most tags can't be nested at all. For instance, the occurrence of
       a <p> tag should implicitly close the previous <p> tag.
 
        <p>Para1<p>Para2
         should be transformed into:
        <p>Para1</p><p>Para2
 
-      Some tags can be nested arbitrarily. For instance, the occurance
+      Some tags can be nested arbitrarily. For instance, the occurrence
       of a <blockquote> tag should _not_ implicitly close the previous
       <blockquote> tag.
 

bin/example-screenshot.js

@@ -140,7 +140,7 @@
 
   console.log('Capturing ' + lenHtmlFiles + ' example screenshots.');
 
-  // The main interval function that is executed regularily and renders a
+  // The main interval function that is executed regularly and renders a
   // page to a file
   var interval = setInterval(function() {
     if (!loadInProgress && pageindex < lenHtmlFiles) {

build.py

@@ -32,7 +32,11 @@ class ThreadPool:
                 try:
                     function(*args, **kargs)
                 except:
+                    print("ERROR")
+                    for count, thing in enumerate(args):
+                        print '{0}. {1}'.format(count, thing)
                     print(sys.exc_info()[0])
+                    print("ERROR")
                     self.tasks.errors = True
                 self.tasks.task_done()
 
@@ -146,6 +150,7 @@ SRC = [path
        if path.endswith('.js')
        if path not in SHADER_SRC]
 
+NPM_INSTALL = 'build/npm-install-timestamp'
 
 def report_sizes(t):
     stringio = StringIO()
@@ -167,7 +172,8 @@ virtual('ci', 'lint', 'build', 'test',
     'build/examples/all.combined.js', 'check-examples', 'apidoc')
 
 
-virtual('build', 'build/ol.css', 'build/ol.js', 'build/ol-debug.js')
+virtual('build', 'build/ol.css', 'build/ol.js', 'build/ol-debug.js',
+    'build/ol.js.map')
 
 
 virtual('check', 'lint', 'build/ol.js', 'test')
@@ -176,18 +182,34 @@ virtual('check', 'lint', 'build/ol.js', 'test')
 virtual('todo', 'fixme')
 
 
-@target('build/ol.css', 'css/ol.css')
+@target(NPM_INSTALL, 'package.json')
+def npm_install(t):
+    t.run('npm', 'install')
+    t.touch()
+
+
+@target('build/ol.css', 'css/ol.css', NPM_INSTALL)
 def build_ol_css(t):
     t.output('%(CLEANCSS)s', 'css/ol.css')
 
 
-@target('build/ol.js', SRC, SHADER_SRC, 'config/ol.json')
-def build_ol_new_js(t):
+def _build_js(t):
     t.run('node', 'tasks/build.js', 'config/ol.json', 'build/ol.js')
+
+
+@target('build/ol.js', SRC, SHADER_SRC, 'config/ol.json', NPM_INSTALL)
+def build_ol_js(t):
+    _build_js(t)
     report_sizes(t)
 
 
-@target('build/ol-debug.js', SRC, SHADER_SRC, 'config/ol-debug.json')
+@target('build/ol.js.map', SRC, SHADER_SRC, 'config/ol.json', NPM_INSTALL)
+def build_ol_js_map(t):
+    _build_js(t)
+
+
+@target('build/ol-debug.js', SRC, SHADER_SRC, 'config/ol-debug.json',
+        NPM_INSTALL)
 def build_ol_debug_js(t):
     t.run('node', 'tasks/build.js', 'config/ol-debug.json', 'build/ol-debug.js')
     report_sizes(t)
@@ -236,7 +258,7 @@ def examples_examples_list_js(t):
 
 
 @target('build/examples/all.combined.js', 'build/examples/all.js',
-        SRC, SHADER_SRC, 'config/examples-all.json')
+        SRC, SHADER_SRC, 'config/examples-all.json', NPM_INSTALL)
 def build_examples_all_combined_js(t):
     t.run('node', 'tasks/build.js', 'config/examples-all.json',
           'build/examples/all.combined.js')
@@ -270,6 +292,7 @@ def examples_star_json(name, match):
           "exports": [],
           "src": [
             "src/**/*.js",
+            "build/ol.ext/*.js",
             "examples/%(id)s.js" % match.groupdict()],
           "compile": {
             "js": [
@@ -281,6 +304,7 @@ def examples_star_json(name, match):
               "externs/bootstrap.js",
               "externs/closure-compiler.js",
               "externs/example.js",
+              "externs/fastclick.js",
               "externs/geojson.js",
               "externs/jquery-1.9.js",
               "externs/proj4js.js",
@@ -336,14 +360,16 @@ def examples_star_json(name, match):
               "api", "observable"
             ],
             "compilation_level": "ADVANCED",
-            "output_wrapper": "// OpenLayers 3. See http://ol3.js.org/\n(function(){%output%})();",
+            "warning_level": "VERBOSE",
+            "output_wrapper": "(function(){%output%})();",
             "use_types_for_optimization": True,
             "manage_closure_dependencies": True
           }
         })
         with open(t.name, 'wb') as f:
             f.write(content)
-    return Target(name, action=action, dependencies=[__file__])
+    return Target(name, action=action,
+                  dependencies=[__file__, NPM_INSTALL])
 
 
 @rule(r'\Abuild/examples/(?P<id>.*).combined.js\Z')
@@ -354,11 +380,12 @@ def examples_star_combined_js(name, match):
         report_sizes(t)
     dependencies = [SRC, SHADER_SRC,
                     'examples/%(id)s.js' % match.groupdict(),
-                    'build/examples/%(id)s.json' % match.groupdict()]
+                    'build/examples/%(id)s.json' % match.groupdict(),
+                    NPM_INSTALL]
     return Target(name, action=action, dependencies=dependencies)
 
 
-@target('serve', 'examples')
+@target('serve', 'examples', NPM_INSTALL)
 def serve(t):
     t.run('node', 'tasks/serve.js')
 
@@ -376,11 +403,10 @@ def build_lint_src_timestamp(t):
           t.newer(t.dependencies))
     t.touch()
 
-
 virtual('jshint', 'build/jshint-timestamp')
 
 @target('build/jshint-timestamp', SRC, EXAMPLES_SRC, SPEC, TASKS,
-        precious=True)
+        NPM_INSTALL, precious=True)
 def build_jshint_timestamp(t):
     t.run(variables.JSHINT, '--verbose', t.newer(t.dependencies))
     t.touch()
@@ -586,7 +612,8 @@ virtual('apidoc', 'build/jsdoc-%(BRANCH)s-timestamp' % vars(variables))
 
 
 @target('build/jsdoc-%(BRANCH)s-timestamp' % vars(variables), 'host-resources',
-        SRC, SHADER_SRC, ifind('config/jsdoc/api/template'))
+        SRC, SHADER_SRC, ifind('config/jsdoc/api/template'),
+        NPM_INSTALL)
 def jsdoc_BRANCH_timestamp(t):
     t.run('%(JSDOC)s', 'config/jsdoc/api/index.md',
           '-c', 'config/jsdoc/api/conf.json',
@@ -660,8 +687,11 @@ def host_examples(t):
     t.rm_rf('build/hosted/%(BRANCH)s/ol')
     t.makedirs('build/hosted/%(BRANCH)s/ol')
     t.cp_r('src/ol', 'build/hosted/%(BRANCH)s/ol/ol')
+    t.rm_rf('build/hosted/%(BRANCH)s/ol.ext')
+    t.cp_r('build/ol.ext', 'build/hosted/%(BRANCH)s/ol.ext')
     t.run('%(PYTHON)s', closure_lib_path + '/closure/bin/build/depswriter.py',
           '--root_with_prefix', 'src ../../../ol',
+          '--root_with_prefix', 'build/ol.ext ../../../ol.ext',
           '--root', 'build/hosted/%(BRANCH)s/closure-library/closure/goog',
           '--root_with_prefix', 'build/hosted/%(BRANCH)s/closure-library/'
           'third_party ../../third_party',
@@ -683,7 +713,7 @@ def check_examples(t):
         sys.exit(1)
 
 
-@target('test', phony=True)
+@target('test', NPM_INSTALL, phony=True)
 def test(t):
     t.run('node', 'tasks/test.js')
 
@@ -774,7 +804,7 @@ Other less frequently used targets are:
 If no target is given, the build-target will be executed.
 
 The above list is not complete, please see the source code for not-mentioned
-and only seldomly called targets.
+and only seldom called targets.
     '''
 
 if __name__ == '__main__':

changelog/upgrade-notes.md

@@ -0,0 +1,12 @@
+## Upgrade notes
+
+### v3.3.0
+
+* The `ol.events.condition.mouseMove` function was replaced by `ol.events.condition.pointerMove` (see [#3281](https://github.com/openlayers/ol3/pull/3281)). For example, if you use `ol.events.condition.mouseMove` as the condition in a `Select` interaction then you now need to use `ol.events.condition.pointerMove`:
+
+  ```js
+  var selectInteraction = new ol.interaction.Select({
+    condition: ol.events.condition.pointerMove
+    // …
+  });
+  ```

changelog/v3.1.0.md

@@ -0,0 +1,234 @@
+# 3.1.0
+
+## Summary
+
+The 3.1.0 release includes a whopping 214 merged pull requests since 3.0.0.  Of note, the WebGL renderer [now supports point rendering](https://github.com/openlayers/ol3/pull/2967).  You can use [UTFGrids for interaction](https://github.com/openlayers/ol3/pull/3015)!  Styles can now specify [alternate geometries for rendering](https://github.com/openlayers/ol3/pull/3010).  Library builds [can now be loaded](https://github.com/openlayers/ol3/pull/3039) with module loaders like Browserify or RequireJS.  You can now symbolize point features with stars, squares, enneadecagons, or [any other regular(ish) polygon](https://github.com/openlayers/ol3/pull/2706).  See the full list of [changes](#changes) below.
+
+## Upgrade notes
+
+The 3.1.0 release maintains a backwards-compatible API with the 3.0.0 release, so upgrades should be painless.  Some special considerations below.
+
+ * If you are using a `ol.source.ImageStatic`, you no longer need to provide an `imageSize` option if you don't want any special scaling on your image (see [#2796](https://github.com/openlayers/ol3/pull/2796)).
+
+ * Instead of calling `obj.unByKey(key)` you can now call `ol.Observable.unByKey(key)` (see [#2794](https://github.com/openlayers/ol3/pull/2794)).
+
+ * If you were using `format.writeFeatures(features)`, note that this method returns a string for all feature formats.  We considered the previous behavior a bug (see [#3003](https://github.com/openlayers/ol3/pull/3003)).
+
+ * The `obj.dispatchChangeEvent()` method is now spelled `obj.changed()`.  This method is still unstable (see [#2684](https://github.com/openlayers/ol3/pull/2684)).
+
+## Changes
+
+ * [#3076](https://github.com/openlayers/ol3/pull/3076) - Add script to standardize changelog creation. ([@tschaub](https://github.com/tschaub))
+ * [#3074](https://github.com/openlayers/ol3/pull/3074) - Remove misplaced function annotation. ([@fredj](https://github.com/fredj))
+ * [#3075](https://github.com/openlayers/ol3/pull/3075) - Remove unneeded undefined from ol.proj.ProjectionLike definitions (r=@tschaub) ([@bartvde](https://github.com/bartvde))
+ * [#3071](https://github.com/openlayers/ol3/pull/3071) - Add task for publishing to npm. ([@tschaub](https://github.com/tschaub))
+ * [#3070](https://github.com/openlayers/ol3/pull/3070) - Define goog and assign to global when generating UMD debug builds. ([@tschaub](https://github.com/tschaub))
+ * [#3068](https://github.com/openlayers/ol3/pull/3068) - Update pre-release version. ([@tschaub](https://github.com/tschaub))
+ * [#3039](https://github.com/openlayers/ol3/pull/3039) - Support for UMD builds. ([@tschaub](https://github.com/tschaub))
+ * [#3038](https://github.com/openlayers/ol3/pull/3038) - Update attribution CSS #2803 ([@acanimal](https://github.com/acanimal))
+ * [#3061](https://github.com/openlayers/ol3/pull/3061) - Add a renderBuffer option to ol.layer.Vector ([@elemoine](https://github.com/elemoine))
+ * [#3048](https://github.com/openlayers/ol3/pull/3048) - Add a drag-features example ([@elemoine](https://github.com/elemoine))
+ * [#3060](https://github.com/openlayers/ol3/pull/3060) - Update closure-library version ([@fredj](https://github.com/fredj))
+ * [#3058](https://github.com/openlayers/ol3/pull/3058) - Use an API function to extend the extent ([@ahocevar](https://github.com/ahocevar))
+ * [#3010](https://github.com/openlayers/ol3/pull/3010) - Allow styles to override feature geometries ([@ahocevar](https://github.com/ahocevar))
+ * [#3056](https://github.com/openlayers/ol3/pull/3056) - Reuse previousExtent_ local variable ([@fredj](https://github.com/fredj))
+ * [#3055](https://github.com/openlayers/ol3/pull/3055) - ol.tilecoord.createOrUpdate: add 'opt_' prefix to optional param ([@fredj](https://github.com/fredj))
+ * [#3044](https://github.com/openlayers/ol3/pull/3044) - Mark Image style constructor properties `@api` ([@gberaudo](https://github.com/gberaudo))
+ * [#3052](https://github.com/openlayers/ol3/pull/3052) - Add a testcase for parsing GML feature with only boundedBy ([@bartvde](https://github.com/bartvde))
+ * [#3051](https://github.com/openlayers/ol3/pull/3051) - Remove // NOCOMPILE from vector-wfs ([@elemoine](https://github.com/elemoine))
+ * [#2699](https://github.com/openlayers/ol3/pull/2699) - No need for featureNS and featureType to be quoted ([@bartvde](https://github.com/bartvde))
+ * [#3047](https://github.com/openlayers/ol3/pull/3047) - Move description above annotation to avoid JSDoc warnings. ([@tschaub](https://github.com/tschaub))
+ * [#2996](https://github.com/openlayers/ol3/pull/2996) - Add getter functions for points and angle in ol.style.RegularShape ([@bartvde](https://github.com/bartvde))
+ * [#3046](https://github.com/openlayers/ol3/pull/3046) - Need exportable constructor for constructor options in olx ([@ahocevar](https://github.com/ahocevar))
+ * [#3043](https://github.com/openlayers/ol3/pull/3043) - Use // NOCOMPILE for vector-wfs ([@elemoine](https://github.com/elemoine))
+ * [#3042](https://github.com/openlayers/ol3/pull/3042) - Print example name in check-examples exception ([@gberaudo](https://github.com/gberaudo))
+ * [#3032](https://github.com/openlayers/ol3/pull/3032) - Extension points for custom controls and interactions ([@elemoine](https://github.com/elemoine))
+ * [#3033](https://github.com/openlayers/ol3/pull/3033) - Allow custom mousemove conditions for Select interaction ([@ahocevar](https://github.com/ahocevar))
+ * [#3040](https://github.com/openlayers/ol3/pull/3040) - Transform the coordinates in place ([@fredj](https://github.com/fredj))
+ * [#3036](https://github.com/openlayers/ol3/pull/3036) - Respect geometry stride in modify interaction ([@tonio](https://github.com/tonio))
+ * [#3020](https://github.com/openlayers/ol3/pull/3020) - Correct error message from generate-info.js. ([@tschaub](https://github.com/tschaub))
+ * [#3037](https://github.com/openlayers/ol3/pull/3037) - Implement rotation for ol.style.RegularShape ([@bartvde](https://github.com/bartvde))
+ * [#3015](https://github.com/openlayers/ol3/pull/3015) - UTFGrid Support ([@klokantech](https://github.com/klokantech))
+ * [#3012](https://github.com/openlayers/ol3/pull/3012) - Failing tests in IE9 ([@bartvde](https://github.com/bartvde))
+ * [#3029](https://github.com/openlayers/ol3/pull/3029) - Update closure compiler and library ([@fredj](https://github.com/fredj))
+ * [#3031](https://github.com/openlayers/ol3/pull/3031) - Add missing maxZoom property in olx.view.FitGeometryOptions ([@fredj](https://github.com/fredj))
+ * [#3028](https://github.com/openlayers/ol3/pull/3028) - ol.format.WFS cleanup ([@fredj](https://github.com/fredj))
+ * [#3024](https://github.com/openlayers/ol3/pull/3024) - Add missing gmlFormat to olx.format.WFSOptions ([@fredj](https://github.com/fredj))
+ * [#3023](https://github.com/openlayers/ol3/pull/3023) - Change loader function return type ([@fredj](https://github.com/fredj))
+ * [#3021](https://github.com/openlayers/ol3/pull/3021) - Add missing properties in olx.control.AttributionOptions typedef ([@fredj](https://github.com/fredj))
+ * [#3013](https://github.com/openlayers/ol3/pull/3013) - Improve vector source clear() performance ([@gberaudo](https://github.com/gberaudo))
+ * [#3017](https://github.com/openlayers/ol3/pull/3017) - Use writeFeatures instead of writeFeaturesNode in GPX and KML example (r=@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#3014](https://github.com/openlayers/ol3/pull/3014) - Simplify hit detection code ([@elemoine](https://github.com/elemoine))
+ * [#3006](https://github.com/openlayers/ol3/pull/3006) - gml3.js and gml2.js don't follow file naming conventions ([@bartvde](https://github.com/bartvde))
+ * [#3003](https://github.com/openlayers/ol3/pull/3003) - The writeFeatures method should always return a string (r=@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#3011](https://github.com/openlayers/ol3/pull/3011) - opt_options may not be defined, use options ([@pagameba](https://github.com/pagameba))
+ * [#3009](https://github.com/openlayers/ol3/pull/3009) - Fix hit detection bug ([@elemoine](https://github.com/elemoine))
+ * [#3002](https://github.com/openlayers/ol3/pull/3002) - Passing options to RegularShape is mandatory ([@elemoine](https://github.com/elemoine))
+ * [#2967](https://github.com/openlayers/ol3/pull/2967) - Add support for drawing points with WebGL ([@camptocamp](https://github.com/camptocamp))
+ * [#2701](https://github.com/openlayers/ol3/pull/2701) - Writing GeoJSON does not respect the feature's geometryName ([@bartvde](https://github.com/bartvde))
+ * [#3000](https://github.com/openlayers/ol3/pull/3000) - Explain that return of ol.color.asArray should not be modified ([@bartvde](https://github.com/bartvde))
+ * [#2997](https://github.com/openlayers/ol3/pull/2997) - Use new demo GeoServer location ([@ahocevar](https://github.com/ahocevar))
+ * [#2976](https://github.com/openlayers/ol3/pull/2976) - Add an example to show off ol.style.RegularShape ([@bartvde](https://github.com/bartvde))
+ * [#2992](https://github.com/openlayers/ol3/pull/2992) - Add support for finding features at a given coordinates for vector tiles - fixes ([@pgiraud](https://github.com/pgiraud))
+ * [#2987](https://github.com/openlayers/ol3/pull/2987) - Image layer renderers use source projection if given and equivalent ([@kartverket](https://github.com/kartverket))
+ * [#2975](https://github.com/openlayers/ol3/pull/2975) - Use offsetX and offsetY if available ([@fredj](https://github.com/fredj))
+ * [#2973](https://github.com/openlayers/ol3/pull/2973) - Making GetTileCoordFor methods public avaible ([@s093294](https://github.com/s093294))
+ * [#2986](https://github.com/openlayers/ol3/pull/2986) - Add support for finding features at a given coordinates for vector tiles ([@pgiraud](https://github.com/pgiraud))
+ * [#2937](https://github.com/openlayers/ol3/pull/2937) - Clip layer rendering to limited extent. ([@tschaub](https://github.com/tschaub))
+ * [#2971](https://github.com/openlayers/ol3/pull/2971) - Two ol.source.TileVector fixes ([@elemoine](https://github.com/elemoine))
+ * [#2988](https://github.com/openlayers/ol3/pull/2988) - Correct olx.style.RegularShapeOptions definition (r=@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#2981](https://github.com/openlayers/ol3/pull/2981) - Use lineDash in ol.style.Circle's and ol.style.RegularShape's stroke (r=@fredj,@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#2982](https://github.com/openlayers/ol3/pull/2982) - Allow radius1 as an alias for radius in ol.style.RegularShape ([@bartvde](https://github.com/bartvde))
+ * [#2980](https://github.com/openlayers/ol3/pull/2980) - Export ol.source.TileVector#getFeatures in built mode ([@pgiraud](https://github.com/pgiraud))
+ * [#2979](https://github.com/openlayers/ol3/pull/2979) - Support OGC srs urns without an EPSG database version ([@bartvde](https://github.com/bartvde))
+ * [#2978](https://github.com/openlayers/ol3/pull/2978) - Fix zoom levels for the MapQuest Street layer ([@ahocevar](https://github.com/ahocevar))
+ * [#2889](https://github.com/openlayers/ol3/pull/2889) - Add GetFeatureInfo format ([@fgravin](https://github.com/fgravin))
+ * [#2965](https://github.com/openlayers/ol3/pull/2965) - Fix pan with select interaction in mousemove mode. ([@tonio](https://github.com/tonio))
+ * [#2960](https://github.com/openlayers/ol3/pull/2960) - LayerGroup extent should be used if extent not set on child layer ([@bartvde](https://github.com/bartvde))
+ * [#2956](https://github.com/openlayers/ol3/pull/2956) - Revert "Remove mousewheel event name workaround" ([@fredj](https://github.com/fredj))
+ * [#2959](https://github.com/openlayers/ol3/pull/2959) - Fix typo in selector ([@ahocevar](https://github.com/ahocevar))
+ * [#2895](https://github.com/openlayers/ol3/pull/2895) - Move font-family customization to layout.css ([@fredj](https://github.com/fredj))
+ * [#2896](https://github.com/openlayers/ol3/pull/2896) - Remove duplicated style parameter ([@kalinbas](https://github.com/kalinbas))
+ * [#2938](https://github.com/openlayers/ol3/pull/2938) - Additional image static docs. ([@tschaub](https://github.com/tschaub))
+ * [#2939](https://github.com/openlayers/ol3/pull/2939) - Make stability checkbox sticky. ([@tschaub](https://github.com/tschaub))
+ * [#2949](https://github.com/openlayers/ol3/pull/2949) - Add ol.ext to hosted dir ([@elemoine](https://github.com/elemoine))
+ * [#2943](https://github.com/openlayers/ol3/pull/2943) - Mark applyTransform api stable ([@fredj](https://github.com/fredj))
+ * [#2936](https://github.com/openlayers/ol3/pull/2936) - Fix unselection of selected features ([@ahocevar](https://github.com/ahocevar))
+ * [#2935](https://github.com/openlayers/ol3/pull/2935) - Fix jsdoc comment ([@geosense](https://github.com/geosense))
+ * [#2933](https://github.com/openlayers/ol3/pull/2933) - Fix compile warning ([@elemoine](https://github.com/elemoine))
+ * [#2931](https://github.com/openlayers/ol3/pull/2931) - Improvement to view docs ([@elemoine](https://github.com/elemoine))
+ * [#2906](https://github.com/openlayers/ol3/pull/2906) - Assume a latitude, longitude order for Polyline format ([@fredj](https://github.com/fredj))
+ * [#2927](https://github.com/openlayers/ol3/pull/2927) - Make it possible to programmatically finish drawing ([@elemoine](https://github.com/elemoine))
+ * [#2928](https://github.com/openlayers/ol3/pull/2928) - Do not rename handleMapBrowserEvent internally ([@elemoine](https://github.com/elemoine))
+ * [#2924](https://github.com/openlayers/ol3/pull/2924) - Readability rearangement in canvasmaprenderer.js ([@gberaudo](https://github.com/gberaudo))
+ * [#2911](https://github.com/openlayers/ol3/pull/2911) - List events fired in the navigation. ([@tschaub](https://github.com/tschaub))
+ * [#2921](https://github.com/openlayers/ol3/pull/2921) - Small feature overlay optimization ([@gberaudo](https://github.com/gberaudo))
+ * [#2897](https://github.com/openlayers/ol3/pull/2897) - Remove pointerup listener on controls ([@fredj](https://github.com/fredj))
+ * [#2912](https://github.com/openlayers/ol3/pull/2912) - jQuery externs update ([@fredj](https://github.com/fredj))
+ * [#2888](https://github.com/openlayers/ol3/pull/2888) - Element boundedBy must not be set as geometry field on GML reading ([@fgravin](https://github.com/fgravin))
+ * [#2903](https://github.com/openlayers/ol3/pull/2903) - Improved docs for icon options ([@elemoine](https://github.com/elemoine))
+ * [#2900](https://github.com/openlayers/ol3/pull/2900) - Allow build.js task to add header. ([@tschaub](https://github.com/tschaub))
+ * [#2893](https://github.com/openlayers/ol3/pull/2893) - Don't pass an object to goog.dom.createDom for the class name ([@fredj](https://github.com/fredj))
+ * [#2781](https://github.com/openlayers/ol3/pull/2781) - Use a standard title attribute for the control buttons ([@fredj](https://github.com/fredj))
+ * [#2852](https://github.com/openlayers/ol3/pull/2852) - Add missing space between class names ([@fredj](https://github.com/fredj))
+ * [#2891](https://github.com/openlayers/ol3/pull/2891) - Introduce a load function for image sources ([@ahocevar](https://github.com/ahocevar))
+ * [#2885](https://github.com/openlayers/ol3/pull/2885) - Add wrapX option to TileJSON source ([@elemoine](https://github.com/elemoine))
+ * [#2890](https://github.com/openlayers/ol3/pull/2890) - Use correct layer property names ([@elemoine](https://github.com/elemoine))
+ * [#2887](https://github.com/openlayers/ol3/pull/2887) - Explicitly pass coordinate dimension before transforming. ([@tschaub](https://github.com/tschaub))
+ * [#2886](https://github.com/openlayers/ol3/pull/2886) - Use ternary notation ([@elemoine](https://github.com/elemoine))
+ * [#2869](https://github.com/openlayers/ol3/pull/2869) - Export useful xml functions ([@tonio](https://github.com/tonio))
+ * [#2884](https://github.com/openlayers/ol3/pull/2884) - Make WKT methods throw errors instead of calling a method that throws. ([@tschaub](https://github.com/tschaub))
+ * [#2746](https://github.com/openlayers/ol3/pull/2746) - Add versioning for GML format ([@fgravin](https://github.com/fgravin))
+ * [#2882](https://github.com/openlayers/ol3/pull/2882) - Allow olx.source.WMTSOptions#requestEncoding to be a string ([@fredj](https://github.com/fredj))
+ * [#2881](https://github.com/openlayers/ol3/pull/2881) - Add default requestEncoding in documentation ([@fredj](https://github.com/fredj))
+ * [#2877](https://github.com/openlayers/ol3/pull/2877) - Remove FIXME in src/ol/structs/rbush.js ([@fredj](https://github.com/fredj))
+ * [#2870](https://github.com/openlayers/ol3/pull/2870) - Use bulk-insertion for addFeatures ([@tsauerwein](https://github.com/tsauerwein))
+ * [#2856](https://github.com/openlayers/ol3/pull/2856) - Allow layer source to be set. ([@tschaub](https://github.com/tschaub))
+ * [#2875](https://github.com/openlayers/ol3/pull/2875) - Avoid modifying `map.logos_` with each frame. ([@tschaub](https://github.com/tschaub))
+ * [#2874](https://github.com/openlayers/ol3/pull/2874) - Avoid shrinking logos. ([@tschaub](https://github.com/tschaub))
+ * [#2872](https://github.com/openlayers/ol3/pull/2872) - Remove the beforepropertychange event from ol.Object ([@fredj](https://github.com/fredj))
+ * [#2868](https://github.com/openlayers/ol3/pull/2868) - Remove doc about dispatching events. ([@tschaub](https://github.com/tschaub))
+ * [#2871](https://github.com/openlayers/ol3/pull/2871) - Make `npm install` a dependency of node based targets. ([@tschaub](https://github.com/tschaub))
+ * [#2867](https://github.com/openlayers/ol3/pull/2867) - Support for importing CommonJS style modules (like rbush). ([@openlayers](https://github.com/openlayers))
+ * [#2865](https://github.com/openlayers/ol3/pull/2865) - Add old value to property change events ([@elemoine](https://github.com/elemoine))
+ * [#2866](https://github.com/openlayers/ol3/pull/2866) - Cluster source calls loadFeatures on vector source ([@elemoine](https://github.com/elemoine))
+ * [#2864](https://github.com/openlayers/ol3/pull/2864) - Avoid mixed content in Bing Maps (r=@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#2855](https://github.com/openlayers/ol3/pull/2855) - Move touchstart preventDefault to ol.renderer.dom.Map ([@fredj](https://github.com/fredj))
+ * [#2690](https://github.com/openlayers/ol3/pull/2690) - Vector rendering with the DOM renderer ([@ahocevar](https://github.com/ahocevar))
+ * [#2859](https://github.com/openlayers/ol3/pull/2859) - Document exportable vector source symbols. ([@tschaub](https://github.com/tschaub))
+ * [#2857](https://github.com/openlayers/ol3/pull/2857) - Update the OSM attribution. ([@tschaub](https://github.com/tschaub))
+ * [#2847](https://github.com/openlayers/ol3/pull/2847) - Constrain center in zoomify example ([@elemoine](https://github.com/elemoine))
+ * [#2838](https://github.com/openlayers/ol3/pull/2838) - ol.source.WMTS now passes tileClass option to ol.source.TileImage ([@mike-mcgann](https://github.com/mike-mcgann))
+ * [#2821](https://github.com/openlayers/ol3/pull/2821) - Add ol.geom.Polygon.fromExtent ([@elemoine](https://github.com/elemoine))
+ * [#2835](https://github.com/openlayers/ol3/pull/2835) - Use correct Stamen URL for SSL. ([@j16sdiz](https://github.com/j16sdiz))
+ * [#2839](https://github.com/openlayers/ol3/pull/2839) - Dependency updates and new package name. ([@tschaub](https://github.com/tschaub))
+ * [#2840](https://github.com/openlayers/ol3/pull/2840) - Fewer point resolution tests. ([@tschaub](https://github.com/tschaub))
+ * [#2836](https://github.com/openlayers/ol3/pull/2836) - Give priority to feature's style instead of source's style ([@oterral](https://github.com/oterral))
+ * [#2834](https://github.com/openlayers/ol3/pull/2834) - Use ADVANCED instead of ADVANCED_OPTIMIZATIONS ([@fredj](https://github.com/fredj))
+ * [#2833](https://github.com/openlayers/ol3/pull/2833) - Avoid too many files open with graceful-fs@3.0.3. ([@tschaub](https://github.com/tschaub))
+ * [#2829](https://github.com/openlayers/ol3/pull/2829) - Zoom slider refactor. ([@tschaub](https://github.com/tschaub))
+ * [#2757](https://github.com/openlayers/ol3/pull/2757) - Clear the canvas on layer extent changes. ([@tschaub](https://github.com/tschaub))
+ * [#2796](https://github.com/openlayers/ol3/pull/2796) - Determine image size on load. ([@tschaub](https://github.com/tschaub))
+ * [#2825](https://github.com/openlayers/ol3/pull/2825) - Change comments for examples_star_json build target ([@elemoine](https://github.com/elemoine))
+ * [#2822](https://github.com/openlayers/ol3/pull/2822) - Remove obsolete comment ([@gingerik](https://github.com/gingerik))
+ * [#2769](https://github.com/openlayers/ol3/pull/2769) - OverviewMap control ([@adube](https://github.com/adube))
+ * [#2820](https://github.com/openlayers/ol3/pull/2820) - Add parsing of LabelStyle in KML format ([@oterral](https://github.com/oterral))
+ * [#2819](https://github.com/openlayers/ol3/pull/2819) - Improvements to the xyz-esri-4326-512 example ([@elemoine](https://github.com/elemoine))
+ * [#2743](https://github.com/openlayers/ol3/pull/2743) - Handle ol.interaction.Draw activation/deactivation ([@elemoine](https://github.com/elemoine))
+ * [#2816](https://github.com/openlayers/ol3/pull/2816) - Exit on check-examples failure ([@gberaudo](https://github.com/gberaudo))
+ * [#2794](https://github.com/openlayers/ol3/pull/2794) - Add ol.Observable.unByKey ([@elemoine](https://github.com/elemoine))
+ * [#2815](https://github.com/openlayers/ol3/pull/2815) - Fix jquery.min.js path in xyz-esri-4326-512 example ([@fredj](https://github.com/fredj))
+ * [#2756](https://github.com/openlayers/ol3/pull/2756) - Add an example for using an Esri 512x512 tile server in EPSG:4326 (r=@elemoine) ([@bartvde](https://github.com/bartvde))
+ * [#2814](https://github.com/openlayers/ol3/pull/2814) - Add missing whitespaces in CSS calc ([@fredj](https://github.com/fredj))
+ * [#2811](https://github.com/openlayers/ol3/pull/2811) - Remove defaultProjection and object from typedef ([@fredj](https://github.com/fredj))
+ * [#2779](https://github.com/openlayers/ol3/pull/2779) - Update jQuery to 1.9.1 ([@fredj](https://github.com/fredj))
+ * [#2810](https://github.com/openlayers/ol3/pull/2810) - Remove unused properties from olx.source.TileVectorOptions ([@pagameba](https://github.com/pagameba))
+ * [#2808](https://github.com/openlayers/ol3/pull/2808) - Remove reprojectTo option from olx.source.OSMXMLOptions ([@fredj](https://github.com/fredj))
+ * [#2809](https://github.com/openlayers/ol3/pull/2809) - Miscellaneous controls cleanups ([@fredj](https://github.com/fredj))
+ * [#2805](https://github.com/openlayers/ol3/pull/2805) - Enable subclassing Interaction in public API ([@sweco-sebhar](https://github.com/sweco-sebhar))
+ * [#2798](https://github.com/openlayers/ol3/pull/2798) - Update closure-util to version 1.0.0 ([@fredj](https://github.com/fredj))
+ * [#2785](https://github.com/openlayers/ol3/pull/2785) - Use goog.* types in externs ([@ahocevar](https://github.com/ahocevar))
+ * [#2795](https://github.com/openlayers/ol3/pull/2795) - Externs ([@gingerik](https://github.com/gingerik))
+ * [#2792](https://github.com/openlayers/ol3/pull/2792) - Use valid mediatype for GPX export. ([@pgiraud](https://github.com/pgiraud))
+ * [#2784](https://github.com/openlayers/ol3/pull/2784) - Add 'tooltip'-tag to KML example. ([@marcjansen](https://github.com/marcjansen))
+ * [#2782](https://github.com/openlayers/ol3/pull/2782) - Hide the rotate control when the rotation is 0 ([@fredj](https://github.com/fredj))
+ * [#2774](https://github.com/openlayers/ol3/pull/2774) - Remove unused distinctFeatures object in ol.interaction.Modify#handlePointerDown ([@fredj](https://github.com/fredj))
+ * [#2771](https://github.com/openlayers/ol3/pull/2771) - Allow package to be published in npm registry. ([@tschaub](https://github.com/tschaub))
+ * [#2773](https://github.com/openlayers/ol3/pull/2773) - Type-related changes to ol.style.Image ([@elemoine](https://github.com/elemoine))
+ * [#2751](https://github.com/openlayers/ol3/pull/2751) - Export constructors and options of ol.source.Source children ([@gberaudo](https://github.com/gberaudo))
+ * [#2772](https://github.com/openlayers/ol3/pull/2772) - Rename updatefeature event to changefeature ([@fredj](https://github.com/fredj))
+ * [#2766](https://github.com/openlayers/ol3/pull/2766) - Make interaction "active" an ol.Object property ([@elemoine](https://github.com/elemoine))
+ * [#2765](https://github.com/openlayers/ol3/pull/2765) - Treat unknown opt types as Object in ol externs ([@elemoine](https://github.com/elemoine))
+ * [#2759](https://github.com/openlayers/ol3/pull/2759) - Fix test failures. ([@tschaub](https://github.com/tschaub))
+ * [#2762](https://github.com/openlayers/ol3/pull/2762) - Report test failures to the console. ([@tschaub](https://github.com/tschaub))
+ * [#2768](https://github.com/openlayers/ol3/pull/2768) - Write the function name correctly in the doc. ([@xamgreen](https://github.com/xamgreen))
+ * [#2764](https://github.com/openlayers/ol3/pull/2764) - Remove rtree example ([@fredj](https://github.com/fredj))
+ * [#2763](https://github.com/openlayers/ol3/pull/2763) - Miscellaneous coding style and typo fixes ([@fredj](https://github.com/fredj))
+ * [#2758](https://github.com/openlayers/ol3/pull/2758) - Correctly generate child tile ranges for XYZ tiles. ([@tschaub](https://github.com/tschaub))
+ * [#2734](https://github.com/openlayers/ol3/pull/2734) - Add maxZoom option to BingMaps ([@elemoine](https://github.com/elemoine))
+ * [#2752](https://github.com/openlayers/ol3/pull/2752) - Call loadFeatures from ol.source.ImageVector ([@elemoine](https://github.com/elemoine))
+ * [#2658](https://github.com/openlayers/ol3/pull/2658) - Set inherited values when parsing a GetCapabilities ([@oterral](https://github.com/oterral))
+ * [#2750](https://github.com/openlayers/ol3/pull/2750) - Export ol.layer.Base ([@fredj](https://github.com/fredj))
+ * [#2749](https://github.com/openlayers/ol3/pull/2749) - Export ol.source.Source ([@fredj](https://github.com/fredj))
+ * [#2742](https://github.com/openlayers/ol3/pull/2742) - Dispatch an 'updatefeature' from the vector source ([@fredj](https://github.com/fredj))
+ * [#2747](https://github.com/openlayers/ol3/pull/2747) - Fix incorrect web address. ([@lazaruslarue](https://github.com/lazaruslarue))
+ * [#2745](https://github.com/openlayers/ol3/pull/2745) - DragBox Interaction: getGeometry return type can be ol.geom.Polygon (r=@fredj) ([@bartvde](https://github.com/bartvde))
+ * [#2744](https://github.com/openlayers/ol3/pull/2744) - Fix ol.Feature 'change' event documentation ([@fredj](https://github.com/fredj))
+ * [#2741](https://github.com/openlayers/ol3/pull/2741) - issue with reading scientific notation coordinates in ol.format.GML (r=@fredj) ([@bartvde](https://github.com/bartvde))
+ * [#2739](https://github.com/openlayers/ol3/pull/2739) - Revert "Function circular renamed to createCircularOnSphere" ([@elemoine](https://github.com/elemoine))
+ * [#2616](https://github.com/openlayers/ol3/pull/2616) - Target for attribution links differs between maps ([@fredj](https://github.com/fredj))
+ * [#2740](https://github.com/openlayers/ol3/pull/2740) - Make interactions activable and deactivable ([@elemoine](https://github.com/elemoine))
+ * [#2727](https://github.com/openlayers/ol3/pull/2727) - Rename ol.geom.Polygon#circular to createCircularOnSphere ([@elemoine](https://github.com/elemoine))
+ * [#2730](https://github.com/openlayers/ol3/pull/2730) - Do not call toLowerCase when forming a change:property event ([@elemoine](https://github.com/elemoine))
+ * [#2728](https://github.com/openlayers/ol3/pull/2728) - Mark `ol.extent.getIntersection` as stable. ([@tschaub](https://github.com/tschaub))
+ * [#2726](https://github.com/openlayers/ol3/pull/2726) - Make ol.Feature#setStyle accept null ([@elemoine](https://github.com/elemoine))
+ * [#2724](https://github.com/openlayers/ol3/pull/2724) - Error when compiling individual example ([@fredj](https://github.com/fredj))
+ * [#1959](https://github.com/openlayers/ol3/pull/1959) - Add a feature box selection example ([@elemoine](https://github.com/elemoine))
+ * [#2722](https://github.com/openlayers/ol3/pull/2722) - Make ol.Map#setView do not accept undefined ([@elemoine](https://github.com/elemoine))
+ * [#2696](https://github.com/openlayers/ol3/pull/2696) - Consistent circle transform. ([@gberaudo](https://github.com/gberaudo))
+ * [#2717](https://github.com/openlayers/ol3/pull/2717) - Change the control visibility by using css class ([@fredj](https://github.com/fredj))
+ * [#2715](https://github.com/openlayers/ol3/pull/2715) - Add an EPSG:3857 map to Tissot example ([@elemoine](https://github.com/elemoine))
+ * [#2714](https://github.com/openlayers/ol3/pull/2714) - Set the opacity directly to element.style.opacity ([@fredj](https://github.com/fredj))
+ * [#2647](https://github.com/openlayers/ol3/pull/2647) - Upgrade closure library version ([@fredj](https://github.com/fredj))
+ * [#2549](https://github.com/openlayers/ol3/pull/2549) - Use goog.array.ASSUME_NATIVE_FUNCTIONS define ([@fredj](https://github.com/fredj))
+ * [#2711](https://github.com/openlayers/ol3/pull/2711) - Remove Google Maps example ([@elemoine](https://github.com/elemoine))
+ * [#2684](https://github.com/openlayers/ol3/pull/2684) - Rename ol.Observable#dispatchChangeEvent() to #changed() ([@ahocevar](https://github.com/ahocevar))
+ * [#2678](https://github.com/openlayers/ol3/pull/2678) - Mutable symbolizer properties for styles ([@ahocevar](https://github.com/ahocevar))
+ * [#2568](https://github.com/openlayers/ol3/pull/2568) - re-implement auto-configure code for ol.format.GML (r=@ahocevar) ([@bartvde](https://github.com/bartvde))
+ * [#2704](https://github.com/openlayers/ol3/pull/2704) - Use pool thread for calling bin/check-example.js. ([@gberaudo](https://github.com/gberaudo))
+ * [#2698](https://github.com/openlayers/ol3/pull/2698) - StaticVector is not an abstract base class ([@ahocevar](https://github.com/ahocevar))
+ * [#2702](https://github.com/openlayers/ol3/pull/2702) - Add vector layer in export-map example ([@fredj](https://github.com/fredj))
+ * [#2687](https://github.com/openlayers/ol3/pull/2687) - Use ol.LEGACY_IE_SUPPORT and ol.IS_LEGACY_IE define ([@fredj](https://github.com/fredj))
+ * [#2675](https://github.com/openlayers/ol3/pull/2675) - Remove undefined from ol.Map#getLayers return type ([@fredj](https://github.com/fredj))
+ * [#2692](https://github.com/openlayers/ol3/pull/2692) - Unset z-index in overlay example ([@fredj](https://github.com/fredj))
+ * [#2681](https://github.com/openlayers/ol3/pull/2681) - Make tileSize a config option for ol.source.XYZ ([@ahocevar](https://github.com/ahocevar))
+ * [#2534](https://github.com/openlayers/ol3/pull/2534) - Document ol.geom.Polygon#getLinearRing function ([@fredj](https://github.com/fredj))
+ * [#2677](https://github.com/openlayers/ol3/pull/2677) - Add TextStyle offsets getters to API. ([@gberaudo](https://github.com/gberaudo))
+ * [#2676](https://github.com/openlayers/ol3/pull/2676) - ol.FeatureOverlay: use the feature style if defined ([@fredj](https://github.com/fredj))
+ * [#2656](https://github.com/openlayers/ol3/pull/2656) - Set ol.layer.Image#getSource return type to ol.source.Image ([@fredj](https://github.com/fredj))
+ * [#2651](https://github.com/openlayers/ol3/pull/2651) - ol.layer.Vector.getSource return type specialisation. ([@gberaudo](https://github.com/gberaudo))
+ * [#2669](https://github.com/openlayers/ol3/pull/2669) - Revert "snapshot" ([@fredj](https://github.com/fredj))
+ * [#2663](https://github.com/openlayers/ol3/pull/2663) - Set tracking property to false on geolocation error ([@fredj](https://github.com/fredj))
+ * [#2662](https://github.com/openlayers/ol3/pull/2662) - Delegate transformation in ol.source.FormatVector#readFeatures to `ol.format.*` ([@gingerik](https://github.com/gingerik))
+ * [#2447](https://github.com/openlayers/ol3/pull/2447) - Correct documentation typo. ([@lazaruslarue](https://github.com/lazaruslarue))
+ * [#2660](https://github.com/openlayers/ol3/pull/2660) - New domain in the build header ([@elemoine](https://github.com/elemoine))

changelog/v3.1.1.md

@@ -0,0 +1,9 @@
+# 3.1.0
+
+## Summary
+
+This is a patch release to fix an issue with the select interaction in the 3.1.0 release.
+
+## Changes
+
+ * [#3082](https://github.com/openlayers/ol3/pull/3082) - Correct arguments for forEachGeometryAtPixel. ([@tschaub](https://github.com/tschaub))

changelog/v3.2.0.md

@@ -0,0 +1,86 @@
+# 3.2.0
+
+## Summary
+
+The 3.1.0 release includes 70 merged pull requests since 3.1.0.  Of note, the KML format [now parses `NetworkingLink` tags](https://github.com/openlayers/ol3/pull/3171).  The [measure example](http://openlayers.org/en/v3.2.0/examples/measure.html) was [reworked](https://github.com/openlayers/ol3/pull/3206) to display measurements and help messages while drawing.  A WMTS GetCapabilities format was [added](https://github.com/openlayers/ol3/pull/3026).  The WebGL renderer [now supports feature hit detection](https://github.com/openlayers/ol3/pull/3065) (on point features).  And you can now [detect](https://github.com/openlayers/ol3/pull/3172) features/colored pixels on image and tile layers!  See the full list of [changes](#changes) below.
+
+## Upgrade notes
+
+The 3.2.0 release maintains a backwards-compatible API with the 3.1.0 release, so upgrades should be painless.  Some special considerations below.
+
+ * You should not call `view.setRotation` with `undefined`, to reset the view rotation to `0` then use `view.setRotation(0)` (see [#3176](https://github.com/openlayers/ol3/pull/3176)).
+
+ * If you use `$(map.getViewport()).on('mousemove')` to detect features when the mouse is hovered on the map, you should now rely on the `pointermove` map event type and check in the `pointermove` listener that the `dragging` event property is `false` (see [#3190](https://github.com/openlayers/ol3/pull/3190)).
+
+## Changes
+
+ * [#3171](https://github.com/openlayers/ol3/pull/3171) - KML: Parsing of NetworkLink tag ([@oterral](https://github.com/oterral))
+ * [#3209](https://github.com/openlayers/ol3/pull/3209) - Coding style fixes ([@fredj](https://github.com/fredj))
+ * [#3208](https://github.com/openlayers/ol3/pull/3208) - Add setters and getters for imageLoadFunction ([@bartvde](https://github.com/bartvde))
+ * [#3019](https://github.com/openlayers/ol3/pull/3019) - Add option to allow Select interaction logic to select overlapping features ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3206](https://github.com/openlayers/ol3/pull/3206) - Add tooltip to show measure + help message while drawing ([@pgiraud](https://github.com/pgiraud))
+ * [#3205](https://github.com/openlayers/ol3/pull/3205) - Use ol.extent.createOrUpdateFromCoordinate ([@fredj](https://github.com/fredj))
+ * [#3026](https://github.com/openlayers/ol3/pull/3026) - Add support of reading WMTS Get Cap document ([@htulipe](https://github.com/htulipe))
+ * [#3201](https://github.com/openlayers/ol3/pull/3201) - Pass on opt_fast to parent clear function in ol.source.ServerVector (r=@elemoine,@gberaudo) ([@bartvde](https://github.com/bartvde))
+ * [#3199](https://github.com/openlayers/ol3/pull/3199) - Minor jsdoc fixes ([@fredj](https://github.com/fredj))
+ * [#3059](https://github.com/openlayers/ol3/pull/3059) - Cache the buffered extent value ([@fredj](https://github.com/fredj))
+ * [#3196](https://github.com/openlayers/ol3/pull/3196) - Remove unnecessary newlines ([@fredj](https://github.com/fredj))
+ * [#3099](https://github.com/openlayers/ol3/pull/3099) - Fix up parsing of OGR GML with ol.format.GML ([@bartvde](https://github.com/bartvde))
+ * [#3195](https://github.com/openlayers/ol3/pull/3195) - Coding style ([@fredj](https://github.com/fredj))
+ * [#3192](https://github.com/openlayers/ol3/pull/3192) - Add "url" option to ol.source.MapQuest ([@elemoine](https://github.com/elemoine))
+ * [#3172](https://github.com/openlayers/ol3/pull/3172) - Introduce forEachLayerAtPixel ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3178](https://github.com/openlayers/ol3/pull/3178) - GeoJSON externs fixes ([@fredj](https://github.com/fredj))
+ * [#3179](https://github.com/openlayers/ol3/pull/3179) - Disallow undefined values for ol.layer.Base ([@fredj](https://github.com/fredj))
+ * [#3161](https://github.com/openlayers/ol3/pull/3161) - Doc fix. writeFeaturesNode receives an array of Feature ([@3x0dv5](https://github.com/3x0dv5))
+ * [#3169](https://github.com/openlayers/ol3/pull/3169) - Fix default icon style in kml format ([@oterral](https://github.com/oterral))
+ * [#3190](https://github.com/openlayers/ol3/pull/3190) - Introduce `dragging` flag for MapBrowserEvent ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3135](https://github.com/openlayers/ol3/pull/3135) - Make changing the label of ZoomToExtent/FullScreen control consistent ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3186](https://github.com/openlayers/ol3/pull/3186) - Take the pixel ratio into account when clipping the layer ([@fredj](https://github.com/fredj))
+ * [#3183](https://github.com/openlayers/ol3/pull/3183) - Allow other params than 'mode' in example page query string. ([@htulipe](https://github.com/htulipe))
+ * [#2791](https://github.com/openlayers/ol3/pull/2791) - Re enable rotation button transition ([@fredj](https://github.com/fredj))
+ * [#3180](https://github.com/openlayers/ol3/pull/3180) - Add a getMap function to ol.FeatureOverlay (r=@ahocevar) ([@bartvde](https://github.com/bartvde))
+ * [#3176](https://github.com/openlayers/ol3/pull/3176) - Disallowed undefined rotation value ([@fredj](https://github.com/fredj))
+ * [#3177](https://github.com/openlayers/ol3/pull/3177) - Add example showing how to style polygon vertices ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3174](https://github.com/openlayers/ol3/pull/3174) - Use view.getRotation or view.getResolution instead of view.getState ([@fredj](https://github.com/fredj))
+ * [#3170](https://github.com/openlayers/ol3/pull/3170) - Coding style ([@fredj](https://github.com/fredj))
+ * [#3108](https://github.com/openlayers/ol3/pull/3108) - Support skipping features in the WebGL renderer ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3163](https://github.com/openlayers/ol3/pull/3163) - Use the layerStatesArray property from the frameState ([@fredj](https://github.com/fredj))
+ * [#3159](https://github.com/openlayers/ol3/pull/3159) - Don't pass specific options to the parent constructor ([@fredj](https://github.com/fredj))
+ * [#3066](https://github.com/openlayers/ol3/pull/3066) - Introduce hasFeatureAtPixel ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3065](https://github.com/openlayers/ol3/pull/3065) - Add hit-detection support for WebGL ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3128](https://github.com/openlayers/ol3/pull/3128) - Allow rendering of feature when download of icon failed ([@oterral](https://github.com/oterral))
+ * [#3156](https://github.com/openlayers/ol3/pull/3156) - Move readProjectionFrom* functions to the base classes ([@fredj](https://github.com/fredj))
+ * [#3107](https://github.com/openlayers/ol3/pull/3107) - Also listen on loading images ([@elemoine](https://github.com/elemoine))
+ * [#3153](https://github.com/openlayers/ol3/pull/3153) - Add missing GeoJSONFeature#bbox property ([@fredj](https://github.com/fredj))
+ * [#3154](https://github.com/openlayers/ol3/pull/3154) - Remove unnecessary newlines ([@fredj](https://github.com/fredj))
+ * [#3146](https://github.com/openlayers/ol3/pull/3146) - Enable tests for ol.geom.flat.reverse ([@icholy](https://github.com/icholy))
+ * [#3152](https://github.com/openlayers/ol3/pull/3152) - Update closure-library and closure-util version ([@fredj](https://github.com/fredj))
+ * [#3145](https://github.com/openlayers/ol3/pull/3145) - Add wrapX option to source.OSM and source.BingMaps ([@elemoine](https://github.com/elemoine))
+ * [#3139](https://github.com/openlayers/ol3/pull/3139) - Add ol.control.Control#setTarget ([@elemoine](https://github.com/elemoine))
+ * [#3144](https://github.com/openlayers/ol3/pull/3144) - Update CONTRIBUTING style guide with recent guidelines ([@bartvde](https://github.com/bartvde))
+ * [#3136](https://github.com/openlayers/ol3/pull/3136) - Use array.length = 0 instead of goog.array.clear ([@fredj](https://github.com/fredj))
+ * [#3140](https://github.com/openlayers/ol3/pull/3140) - Avoid use of goog.array.clone with arrays. ([@tschaub](https://github.com/tschaub))
+ * [#3122](https://github.com/openlayers/ol3/pull/3122) - Revert "Use offsetX and offsetY if available" ([@fredj](https://github.com/fredj))
+ * [#2385](https://github.com/openlayers/ol3/pull/2385) - Option to update vector layers while animating ([@ahocevar](https://github.com/ahocevar))
+ * [#3129](https://github.com/openlayers/ol3/pull/3129) - Only update the rbush item if the extent has changed ([@fredj](https://github.com/fredj))
+ * [#3117](https://github.com/openlayers/ol3/pull/3117) - Add pixelRatio support for DOM vector renderer ([@ahocevar](https://github.com/ahocevar))
+ * [#3124](https://github.com/openlayers/ol3/pull/3124) - Add a space between scale -value and -unit ([@sirtet](https://github.com/sirtet))
+ * [#3130](https://github.com/openlayers/ol3/pull/3130) - Document default value ([@fredj](https://github.com/fredj))
+ * [#3105](https://github.com/openlayers/ol3/pull/3105) - ol.geom.Geometry#getExtent re-factoring ([@fredj](https://github.com/fredj))
+ * [#3118](https://github.com/openlayers/ol3/pull/3118) - Bugfix: "Cannot read property 'firstElementChild' of null" (WFS) ([@naturalatlas](https://github.com/naturalatlas))
+ * [#3114](https://github.com/openlayers/ol3/pull/3114) - Specify node version in CONTRIBUTING.md ([@elemoine](https://github.com/elemoine))
+ * [#3106](https://github.com/openlayers/ol3/pull/3106) - Don't pass specific options to the parent constructor ([@fredj](https://github.com/fredj))
+ * [#3110](https://github.com/openlayers/ol3/pull/3110) - Use svg instead of png to get better image quality ([@PeterDaveHello](https://github.com/PeterDaveHello))
+ * [#2707](https://github.com/openlayers/ol3/pull/2707) - Generate source map of minified ol.js ([@gberaudo](https://github.com/gberaudo))
+ * [#3104](https://github.com/openlayers/ol3/pull/3104) - Don't pass renderBuffer option to the parent constructor ([@fredj](https://github.com/fredj))
+ * [#3096](https://github.com/openlayers/ol3/pull/3096) - popup example cleanup / simplification ([@fredj](https://github.com/fredj))
+ * [#3072](https://github.com/openlayers/ol3/pull/3072) - Optimize canvas hit detection by rendering features in a limited extent. ([@tschaub](https://github.com/tschaub))
+ * [#3101](https://github.com/openlayers/ol3/pull/3101) - Use bracket notation instead of goog.object functions. ([@tschaub](https://github.com/tschaub))
+ * [#3079](https://github.com/openlayers/ol3/pull/3079) - Exclude source files from docs. ([@tschaub](https://github.com/tschaub))
+ * [#3100](https://github.com/openlayers/ol3/pull/3100) - Assert that ol.layer.Tile#getPreload is always set ([@fredj](https://github.com/fredj))
+ * [#3084](https://github.com/openlayers/ol3/pull/3084) - Changes from the v3.1.x branch. ([@openlayers](https://github.com/openlayers))
+ * [#3094](https://github.com/openlayers/ol3/pull/3094) - Remove AUTHORS.md. ([@tschaub](https://github.com/tschaub))
+ * [#3089](https://github.com/openlayers/ol3/pull/3089) - Fixed URL link for test README ([@mike-mcgann](https://github.com/mike-mcgann))
+ * [#2894](https://github.com/openlayers/ol3/pull/2894) - Simplify CSS code in custom-controls example ([@fredj](https://github.com/fredj))
+ * [#3085](https://github.com/openlayers/ol3/pull/3085) - Fixed documentation typo for return value of ol.proj.Projection.isGlobal(). ([@mike-mcgann](https://github.com/mike-mcgann))
+ * [#3073](https://github.com/openlayers/ol3/pull/3073) - Make map's deviceOptions map options ([@ahocevar](https://github.com/ahocevar))

changelog/v3.2.1.md

@@ -0,0 +1,9 @@
+# 3.2.1
+
+## Summary
+
+This is a patch release that fixes a regression with the select interaction in the [3.2.0 release](https://github.com/openlayers/ol3/releases/tag/v3.2.0).
+
+## Changes
+
+ * [#3236](https://github.com/openlayers/ol3/pull/3236) - Select the uppermost feature. ([@tschaub](https://github.com/tschaub))

changelog/v3.3.0.md

@@ -0,0 +1,51 @@
+## Upgrade notes
+
+* The `ol.events.condition.mouseMove` function was replaced by `ol.events.condition.pointerMove` (see [#3281](https://github.com/openlayers/ol3/pull/3281)). For example, if you use `ol.events.condition.mouseMove` as the condition in a `Select` interaction then you now need to use `ol.events.condition.pointerMove`:
+
+  ```js
+  var selectInteraction = new ol.interaction.Select({
+    condition: ol.events.condition.pointerMove
+    // …
+  });
+  ```
+
+## Overview of all changes
+
+ * [#3263](https://github.com/openlayers/ol3/pull/3263) - Support ArcGIS Rest Services ([@cwgrant](https://github.com/cwgrant))
+ * [#3295](https://github.com/openlayers/ol3/pull/3295) - Add RESTful to WMTS GetCapabilities optionsFromCapabilities ([@sarametz](https://github.com/sarametz))
+ * [#3304](https://github.com/openlayers/ol3/pull/3304) - Remove scale line inner padding ([@fredj](https://github.com/fredj))
+ * [#3296](https://github.com/openlayers/ol3/pull/3296) - Add upgrade-notes.md file ([@elemoine](https://github.com/elemoine))
+ * [#3303](https://github.com/openlayers/ol3/pull/3303) - Add constant for us-ft units ([@ahocevar](https://github.com/ahocevar))
+ * [#3018](https://github.com/openlayers/ol3/pull/3018) - Add SelectEvent to interaction ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3301](https://github.com/openlayers/ol3/pull/3301) - Select interaction unit tests ([@bjornharrtell](https://github.com/bjornharrtell))
+ * [#3298](https://github.com/openlayers/ol3/pull/3298) - Make ol.source.Source inherit from ol.Object ([@fredj](https://github.com/fredj))
+ * [#3297](https://github.com/openlayers/ol3/pull/3297) - Add getters to ol.source.WMTS ([@fredj](https://github.com/fredj))
+ * [#3281](https://github.com/openlayers/ol3/pull/3281) - Fix mouseMove event type comparison for IE10-11, pointermove ([@adube](https://github.com/adube))
+ * [#3293](https://github.com/openlayers/ol3/pull/3293) - Add missing opacity option for ol.style.IconOptions ([@ahocevar](https://github.com/ahocevar))
+ * [#3284](https://github.com/openlayers/ol3/pull/3284) - Fix jsdoc type for arrays of listening keys ([@fredj](https://github.com/fredj))
+ * [#3278](https://github.com/openlayers/ol3/pull/3278) - Add goog.provide for ol.DrawEventType ([@elemoine](https://github.com/elemoine))
+ * [#3272](https://github.com/openlayers/ol3/pull/3272) - Added getter function to return the wrapped source within the cluster ([@acanimal](https://github.com/acanimal))
+ * [#3275](https://github.com/openlayers/ol3/pull/3275) - Add ol.layer.Heatmap#blur getter and setter ([@fredj](https://github.com/fredj))
+ * [#3142](https://github.com/openlayers/ol3/pull/3142) - WMTS Get Cap document with updated WMTS.optionsFromCapabilities function ([@sarametz](https://github.com/sarametz))
+ * [#3271](https://github.com/openlayers/ol3/pull/3271) - [wip] Fix misplaced comment blocks ([@fredj](https://github.com/fredj))
+ * [#3273](https://github.com/openlayers/ol3/pull/3273) - Remove unused createGetTileIfLoadedFunction function. ([@tschaub](https://github.com/tschaub))
+ * [#3270](https://github.com/openlayers/ol3/pull/3270) - Make ol.Overlay autoPan default to false ([@elemoine](https://github.com/elemoine))
+ * [#3268](https://github.com/openlayers/ol3/pull/3268) - Fix autoPan in examples with ol.Overlay on hover ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3256](https://github.com/openlayers/ol3/pull/3256) - Add autoPan option to ol.Overlay ([@tsauerwein](https://github.com/tsauerwein))
+ * [#3261](https://github.com/openlayers/ol3/pull/3261) - Fix forEachCorner extent, add TopLeft ([@adube](https://github.com/adube))
+ * [#3260](https://github.com/openlayers/ol3/pull/3260) - Remove unused goog.require ([@fredj](https://github.com/fredj))
+ * [#3246](https://github.com/openlayers/ol3/pull/3246) - Avoid creating unnecessary images in tile layers. ([@tschaub](https://github.com/tschaub))
+ * [#3254](https://github.com/openlayers/ol3/pull/3254) - Use lineCap, lineJoin and miterLimit stroke properties in RegularShape ([@fredj](https://github.com/fredj))
+ * [#3252](https://github.com/openlayers/ol3/pull/3252) - Avoid leaking global listenerSpy. ([@tschaub](https://github.com/tschaub))
+ * [#3248](https://github.com/openlayers/ol3/pull/3248) - Add tile loading events to image tile sources. ([@tschaub](https://github.com/tschaub))
+ * [#3240](https://github.com/openlayers/ol3/pull/3240) - Changes from the v3.2.x branch. ([@openlayers](https://github.com/openlayers))
+ * [#3233](https://github.com/openlayers/ol3/pull/3233) - Four small fixes. ([@stweil](https://github.com/stweil))
+ * [#3232](https://github.com/openlayers/ol3/pull/3232) - Fix typos found by codespell. ([@stweil](https://github.com/stweil))
+ * [#3231](https://github.com/openlayers/ol3/pull/3231) - Make ol.layer.Heatmap#radius configurable ([@fredj](https://github.com/fredj))
+ * [#3225](https://github.com/openlayers/ol3/pull/3225) - Respect attributions passed to TileJSON source. ([@tschaub](https://github.com/tschaub))
+ * [#3223](https://github.com/openlayers/ol3/pull/3223) - Resize the canvas when the tile size changes. ([@tschaub](https://github.com/tschaub))
+ * [#3224](https://github.com/openlayers/ol3/pull/3224) - Provide the ability to get the layer name from a MapQuest source ([@bartvde](https://github.com/bartvde))
+ * [#3222](https://github.com/openlayers/ol3/pull/3222) - Add geodesic option for measure ([@bartvde](https://github.com/bartvde))
+ * [#3221](https://github.com/openlayers/ol3/pull/3221) - Select the uppermost feature ([@fredj](https://github.com/fredj))
+ * [#3211](https://github.com/openlayers/ol3/pull/3211) - Bing https logo fix. ([@photostu](https://github.com/photostu))
+ * [#3215](https://github.com/openlayers/ol3/pull/3215) - Allow reuse of layer rendering code without creating a map. ([@tschaub](https://github.com/tschaub))

closure-util.json

@@ -1,3 +1,3 @@
 {
-  "library_url": "https://github.com/google/closure-library/archive/fb35d5232edef340dd9a7c6e479556829d0fa452.zip"
+  "library_url": "https://github.com/google/closure-library/archive/0011afd534469ba111786fe68300a634e08a4d80.zip"
 }

config/examples-all.json

@@ -2,6 +2,7 @@
   "exports": [],
   "src": [
     "src/**/*.js",
+    "build/ol.ext/*.js",
     "build/examples/all.js"
   ],
   "compile": {
@@ -14,6 +15,7 @@
       "externs/bootstrap.js",
       "externs/closure-compiler.js",
       "externs/example.js",
+      "externs/fastclick.js",
       "externs/geojson.js",
       "externs/jquery-1.9.js",
       "externs/proj4js.js",
@@ -67,7 +69,8 @@
       "api", "observable"
     ],
     "compilation_level": "ADVANCED",
-    "output_wrapper": "// OpenLayers 3. See http://ol3js.org/\n(function(){%output%})();",
+    "warning_level": "VERBOSE",
+    "output_wrapper": "(function(){%output%})();",
     "use_types_for_optimization": true,
     "manage_closure_dependencies": true
 

config/jsdoc/api/conf.json

@@ -34,7 +34,7 @@
         "cleverLinks": true,
         "monospaceLinks": true,
         "default": {
-            "outputSourceFiles": true
+            "outputSourceFiles": false
         },
         "applicationName": "OpenLayers 3"
     },

config/jsdoc/api/template/static/scripts/main.js

@@ -54,11 +54,25 @@ $(function () {
     _onResize();
 
     // show/hide unstable items
+    var links = $('a[href^="ol."]');
     var unstable = $('.unstable');
     var stabilityToggle = $('#stability-toggle');
     stabilityToggle.change(function() {
-        unstable.toggle(!this.checked);
+        unstable.toggleClass('hidden', this.checked);
+        var search = this.checked ? '' : '?unstable=true';
+        links.each(function(i, el) {
+            this.href = this.pathname + search + this.hash;
+        });
+        if (history.replaceState) {
+            var url = window.location.pathname + search + window.location.hash;
+            history.replaceState({}, '', url);
+        }
         return false;
     });
-    unstable.toggle(!stabilityToggle[0].checked);
+    var search = window.location.search;
+    links.each(function(i, el) {
+        this.href = this.pathname + search + this.hash;
+    });
+    stabilityToggle.prop('checked', search !== '?unstable=true');
+    unstable.toggleClass('hidden', stabilityToggle[0].checked);
 });

config/jsdoc/api/template/static/styles/jaguar.css

@@ -372,7 +372,7 @@ footer {
 .main .readme table ul li {
   margin-bottom: 0;
 }
-.unstable {
+.hidden {
   display: none;
 }
 #stability {

config/jsdoc/api/template/tmpl/navigation.tmpl

@@ -64,6 +64,23 @@ var self = this;
             }
             ?>
             </ul>
+            <ul class="fires itemMembers">
+            <?js
+            if (item.fires && item.fires.length) {
+            ?>
+            <span class="subtitle">Fires</span>
+            <?js
+                item.fires.forEach(function (v) {
+                    v = self.find({longname: v})[0] || {longname: v, name: v.split(/#?event:/)[1]};
+            ?>
+                <li data-name="<?js= v.longname ?>" class="<?js= (v.stability != 'stable' ? 'unstable' : '') ?>">
+                    <?js= self.linkto(v.longname, v.name) ?>
+                </li>
+            <?js
+                });
+            }
+            ?>
+            </ul>
         </li>
     <?js }); ?>
     </ul>

config/ol-debug.json

@@ -1,3 +1,4 @@
 {
-  "exports": ["*"]
+  "exports": ["*"],
+  "umd": true
 }

config/ol.json

@@ -1,5 +1,6 @@
 {
   "exports": ["*"],
+  "umd": true,
   "compile": {
     "externs": [
       "externs/bingmaps.js",
@@ -58,8 +59,10 @@
       "api", "observable"
     ],
     "compilation_level": "ADVANCED",
-    "output_wrapper": "(function(){%output%})();",
+    "warning_level": "VERBOSE",
     "use_types_for_optimization": true,
-    "manage_closure_dependencies": true
+    "manage_closure_dependencies": true,
+    "create_source_map": "build/ol.js.map",
+    "source_map_format": "V3"
   }
 }

css/ol.css

@@ -21,7 +21,6 @@
   font-size: 10px;
   text-align: center;
   margin: 1px;
-  padding: 0px 2px;
 }
 .ol-unsupported {
   display: none;
@@ -53,11 +52,12 @@
 .ol-rotate {
   top: .5em;
   right: .5em;
-  transition: opacity .25s;
+  transition: opacity .25s linear, visibility 0s linear;
 }
 .ol-rotate.ol-hidden {
   opacity: 0;
-  display: none;
+  visibility: hidden;
+  transition: opacity .25s linear, visibility 0s linear .25s;
 }
 .ol-zoom-extent {
   top: 4.643em;
@@ -99,7 +99,6 @@
 }
 .ol-compass {
   display: block;
-  font-family: Arial;
   font-weight: normal;
   font-size: 1.2em;
 }
@@ -115,81 +114,13 @@
   background-color: #4c6079;
   background-color: rgba(0,60,136,0.7);
 }
-.ol-zoom-extent button:after {
-    content: "E";
-}
 .ol-zoom .ol-zoom-in {
   border-radius: 2px 2px 0 0;
 }
 .ol-zoom .ol-zoom-out {
   border-radius: 0 0 2px 2px;
 }
-button.ol-full-screen-false:after {
-  content: "\2194";
-}
-button.ol-full-screen-true:after {
-  content: "\00d7";
-}
 
-/* invisible but not hidden */
-.ol-has-tooltip [role=tooltip] {
-  position: absolute;
-  clip: rect(1px 1px 1px 1px); /* < IE8 */
-  clip: rect(1px, 1px, 1px, 1px);
-  padding: 0;
-  border: 0;
-  height: 1px;
-  width: 1px;
-  overflow: hidden;
-  font-weight: normal;
-  font-size: 14px;
-  text-shadow: 0 0 2px #fff;
-}
-
-/* show a tooltip offset to below and right */
-.ol-has-tooltip:hover [role=tooltip], .ol-has-tooltip:focus [role=tooltip] {
-  -moz-box-sizing: content-box;
-  -webkit-box-sizing: content-box;
-  box-sizing: content-box;
-  clip: auto;
-  padding: 0 .4em;
-  font-size: .8em;
-  height: 1.2em;
-  width: auto;
-  line-height: 1.2em;
-  z-index: 1100;
-  max-height: 100px;
-  white-space: nowrap;
-  display: inline-block;
-  background: #FFF;
-  background: rgba(255,255,255,0.6);
-  color: #000;
-  border: 3px solid rgba(255,255,255,0);
-  border-left-width: 0;
-  border-radius: 0 4px 4px 0;
-  bottom: .3em;
-  left: 2.2em;
-}
-.ol-touch .ol-has-tooltip:hover [role=tooltip],
-.ol-touch .ol-has-tooltip:focus [role=tooltip] {
-  display: none;
-}
-.ol-zoom .ol-has-tooltip:hover [role=tooltip],
-.ol-zoom .ol-has-tooltip:focus [role=tooltip] {
-  top: 1.1em;
-}
-.ol-rotate .ol-has-tooltip:hover [role=tooltip],
-.ol-rotate .ol-has-tooltip:focus [role=tooltip],
-.ol-attribution .ol-has-tooltip:hover [role=tooltip],
-.ol-attribution .ol-has-tooltip:focus [role=tooltip],
-.ol-full-screen .ol-has-tooltip:hover [role=tooltip],
-.ol-full-screen .ol-has-tooltip:focus [role=tooltip] {
-  right: 2.2em;
-  left: auto;
-  border-radius: 4px 0 0 4px;
-  border-left-width: 3px;
-  border-right-width: 0;
-}
 
 .ol-attribution {
   text-align: right;
@@ -205,7 +136,6 @@ button.ol-full-screen-true:after {
   line-height: 1.375em;
   color: #000;
   text-shadow: 0 0 2px #fff;
-  max-width: calc(100% - 3.6em);
 }
 .ol-attribution li {
   display: inline;
@@ -217,11 +147,11 @@ button.ol-full-screen-true:after {
 }
 .ol-attribution img {
   max-height: 2em;
+  max-width: inherit;
 }
 .ol-attribution ul, .ol-attribution button {
   display: inline-block;
 }
-.ol-attribution:not(.ol-collapsed) button:hover [role=tooltip],
 .ol-attribution.ol-collapsed ul {
   display: none;
 }
@@ -281,13 +211,6 @@ button.ol-full-screen-true:after {
   width: 1.8em;
 }
 
-.ol-control button,
-.ol-attribution,
-.ol-scale-line-inner,
-.ol-has-tooltip [role=tooltip] {
-  font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
-}
-
 .ol-overviewmap {
   position: absolute;
   left: 0.5em;
@@ -313,7 +236,6 @@ button.ol-full-screen-true:after {
   left: 2px;
   position: absolute;
 }
-.ol-overviewmap:not(.ol-collapsed) button:hover [role=tooltip],
 .ol-overviewmap.ol-collapsed .ol-overviewmap-map,
 .ol-overviewmap.ol-uncollapsible button {
   display: none;

examples/animation.js

@@ -55,6 +55,9 @@ var map = new ol.Map({
     })
   ],
   renderer: exampleNS.getRendererFromQueryString(),
+  // Improve user experience by loading tiles while animating. Will make
+  // animations stutter on mobile or slow devices.
+  loadTilesWhileAnimating: true,
   target: 'map',
   controls: ol.control.defaults({
     attributionOptions: /** @type {olx.control.AttributionOptions} */ ({

examples/arcgis-tiled.html

@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Tiled ArcGIS MapServer example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Tiled ArcGIS MapServer example</h4>
+          <p id="shortdesc">Example of a tiled ArcGIS layer.</p>
+          <div id="docs">
+            <p>See the <a href="arcgis-tiled.js" target="_blank">arcgis-tiled.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">arcgis, tile, tilelayer</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=arcgis-tiled" type="text/javascript"></script>
+
+  </body>
+</html>

examples/arcgis-tiled.js

@@ -0,0 +1,28 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.MapQuest');
+goog.require('ol.source.TileArcGISRest');
+
+var url = 'http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/' +
+    'Specialty/ESRI_StateCityHighway_USA/MapServer';
+
+var layers = [
+  new ol.layer.Tile({
+    source: new ol.source.MapQuest({layer: 'sat'})
+  }),
+  new ol.layer.Tile({
+    extent: [-13884991, 2870341, -7455066, 6338219],
+    source: new ol.source.TileArcGISRest({
+      url: url
+    })
+  })
+];
+var map = new ol.Map({
+  layers: layers,
+  target: 'map',
+  view: new ol.View({
+    center: [-10997148, 4569099],
+    zoom: 4
+  })
+});

examples/bing-maps.js

@@ -29,6 +29,9 @@ for (i = 0, ii = styles.length; i < ii; ++i) {
 var map = new ol.Map({
   layers: layers,
   renderer: exampleNS.getRendererFromQueryString(),
+  // Improve user experience by loading tiles while dragging/zooming. Will make
+  // zooming choppy on mobile or slow devices.
+  loadTilesWhileInteracting: true,
   target: 'map',
   view: new ol.View({
     center: [-6655.5402445057125, 6709968.258934638],

examples/button-title.html

@@ -0,0 +1,62 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <style type="text/css">
+      .tooltip-inner {
+        white-space: nowrap;
+      }
+    </style>
+    <title>ol3 custom tooltips example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+        <div class="span12">
+          <h4 id="title">Custom tooltips</h4>
+          <p id="shortdesc">
+            This example shows how to customize the buttons tooltips with
+            <a href="http://getbootstrap.com/javascript/#tooltips">Bootstrap</a>.
+          </p>
+          <div id="docs">
+            <p>
+              See the <a href="button-title.js" target="_blank">button-title.js source</a> to see how this is done.
+            </p>
+          </div>
+          <div id="tags">
+            custom, tooltip
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=button-title" type="text/javascript"></script>
+
+  </body>
+
+</html>

examples/button-title.js

@@ -0,0 +1,27 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.OSM');
+
+var map = new ol.Map({
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.OSM()
+    })
+  ],
+  renderer: exampleNS.getRendererFromQueryString(),
+  target: 'map',
+  view: new ol.View({
+    center: [-8730000, 5930000],
+    rotation: Math.PI / 5,
+    zoom: 8
+  })
+});
+
+
+$('.ol-zoom-in, .ol-zoom-out').tooltip({
+  placement: 'right'
+});
+$('.ol-rotate-reset, .ol-attribution button[title]').tooltip({
+  placement: 'left'
+});

examples/custom-controls.html

@@ -10,39 +10,12 @@
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
     <style type="text/css">
       .rotate-north {
-        position: absolute;
         top: 65px;
-        left: 8px;
-        background: rgba(255,255,255,0.4);
-        border-radius: 4px;
-        padding: 2px;
+        left: .5em;
       }
       .ol-touch .rotate-north {
         top: 80px;
       }
-      .rotate-north a {
-        display: block;
-        color: white;
-        font-size: 16px;
-        font-family: 'Lucida Grande',Verdana,Geneva,Lucida,Arial,Helvetica,sans-serif;
-        font-weight: bold;
-        margin: 1px;
-        text-decoration: none;
-        text-align: center;
-        border-radius: 2px;
-        height: 22px;
-        width: 22px;
-        background: rgba(0,60,136,0.5);
-      }
-      .ol-touch .rotate-north a {
-        font-size: 20px;
-        height: 30px;
-        width: 30px;
-        line-height: 26px;
-      }
-      .rotate-north a:hover {
-        background: rgba(0,60,136,0.7);
-      }
     </style>
     <title>ol3 custom controls example</title>
   </head>

examples/custom-controls.js

@@ -29,23 +29,20 @@ app.RotateNorthControl = function(opt_options) {
 
   var options = opt_options || {};
 
-  var anchor = document.createElement('a');
-  anchor.href = '#rotate-north';
-  anchor.innerHTML = 'N';
+  var button = document.createElement('button');
+  button.innerHTML = 'N';
 
   var this_ = this;
   var handleRotateNorth = function(e) {
-    // prevent #rotate-north anchor from getting appended to the url
-    e.preventDefault();
     this_.getMap().getView().setRotation(0);
   };
 
-  anchor.addEventListener('click', handleRotateNorth, false);
-  anchor.addEventListener('touchstart', handleRotateNorth, false);
+  button.addEventListener('click', handleRotateNorth, false);
+  button.addEventListener('touchstart', handleRotateNorth, false);
 
   var element = document.createElement('div');
-  element.className = 'rotate-north ol-unselectable';
-  element.appendChild(anchor);
+  element.className = 'rotate-north ol-unselectable ol-control';
+  element.appendChild(button);
 
   ol.control.Control.call(this, {
     element: element,

examples/data/WMTSCapabilities.xml

@@ -1,374 +1,279 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<Capabilities xmlns="http://www.opengis.net/wmts/1.0" xmlns:ows="http://www.opengis.net/ows/1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:gml="http://www.opengis.net/gml" xsi:schemaLocation="http://www.opengis.net/wmts/1.0 http://schemas.opengis.net/wmts/1.0/wmtsGetCapabilities_response.xsd" version="1.0.0">
-	<ows:ServiceIdentification>
-		<ows:Title>Web Map Tile Service</ows:Title>
-		<ows:ServiceType>OGC WMTS</ows:ServiceType>
-		<ows:ServiceTypeVersion>1.0.0</ows:ServiceTypeVersion>
-		<ows:Fees>none</ows:Fees>
-		<ows:AccessConstraints>http://data.wien.gv.at/nutzungsbedingungen</ows:AccessConstraints>
-	</ows:ServiceIdentification>
-	<ows:ServiceProvider>
-		<ows:ProviderName>Magistrat Wien</ows:ProviderName>
-		<ows:ProviderSite xlink:href="http://www.wien.gv.at"/>
-		<ows:ServiceContact>
-			<ows:IndividualName>Gerhard Sommer</ows:IndividualName>
-		</ows:ServiceContact>
-	</ows:ServiceProvider>
-	<ows:OperationsMetadata>
-		<ows:Operation name="GetCapabilities">
-			<ows:DCP>
-				<ows:HTTP>
-					<ows:Get xlink:href="http://maps.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps1.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps2.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps3.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps4.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-				</ows:HTTP>
-			</ows:DCP>
-		</ows:Operation>
-		<ows:Operation name="GetTile">
-			<ows:DCP>
-				<ows:HTTP>
-					<ows:Get xlink:href="http://maps.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps1.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps2.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps3.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-					<ows:Get xlink:href="http://maps4.wien.gv.at/wmts">
-						<ows:Constraint name="GetEncoding">
-							<ows:AllowedValues>
-								<ows:Value>RESTful</ows:Value>
-							</ows:AllowedValues>
-						</ows:Constraint>
-					</ows:Get>
-				</ows:HTTP>
-			</ows:DCP>
-		</ows:Operation>
-	</ows:OperationsMetadata>
-	<Contents>
-		<Layer>
-			<ows:Title>Luftbild</ows:Title>
-			<ows:WGS84BoundingBox crs="urn:ogc:def:crs:OGC:2:84">
-				<ows:LowerCorner>16.17 48.10</ows:LowerCorner>
-				<ows:UpperCorner>16.58 48.33</ows:UpperCorner>
-			</ows:WGS84BoundingBox>
-			<ows:Identifier>lb</ows:Identifier>
-			<Style isDefault="true">
-				<ows:Identifier>farbe</ows:Identifier>
-			</Style>
-			<Format>image/jpeg</Format>
-			<TileMatrixSetLink>
-				<TileMatrixSet>google3857</TileMatrixSet>
-			</TileMatrixSetLink>
-			<ResourceURL format="image/jpeg" template="http://maps1.wien.gv.at/wmts/lb/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps2.wien.gv.at/wmts/lb/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps3.wien.gv.at/wmts/lb/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps4.wien.gv.at/wmts/lb/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps.wien.gv.at/wmts/lb/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-		</Layer>
-		<Layer>
-			<ows:Title>MZK Flächen</ows:Title>
-			<ows:WGS84BoundingBox crs="urn:ogc:def:crs:OGC:2:84">
-				<ows:LowerCorner>16.17 48.10</ows:LowerCorner>
-				<ows:UpperCorner>16.58 48.33</ows:UpperCorner>
-			</ows:WGS84BoundingBox>
-			<ows:Identifier>fmzk</ows:Identifier>
-			<Style isDefault="true">
-				<ows:Identifier>pastell</ows:Identifier>
-			</Style>
-			<Format>image/jpeg</Format>
-			<TileMatrixSetLink>
-				<TileMatrixSet>google3857</TileMatrixSet>
-			</TileMatrixSetLink>
-			<ResourceURL format="image/jpeg" template="http://maps1.wien.gv.at/wmts/fmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps2.wien.gv.at/wmts/fmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps3.wien.gv.at/wmts/fmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps4.wien.gv.at/wmts/fmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps.wien.gv.at/wmts/fmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-		</Layer>
-		<Layer>
-			<ows:Title>Flächenwidmungs- und Bebauungsplan</ows:Title>
-			<ows:WGS84BoundingBox crs="urn:ogc:def:crs:OGC:2:84">
-				<ows:LowerCorner>16.17 48.10</ows:LowerCorner>
-				<ows:UpperCorner>16.58 48.33</ows:UpperCorner>
-			</ows:WGS84BoundingBox>
-			<ows:Identifier>flwbplmzk</ows:Identifier>
-			<Style isDefault="true">
-				<ows:Identifier>rot</ows:Identifier>
-			</Style>
-			<Format>image/jpeg</Format>
-			<TileMatrixSetLink>
-				<TileMatrixSet>google3857</TileMatrixSet>
-			</TileMatrixSetLink>
-			<ResourceURL format="image/jpeg" template="http://maps1.wien.gv.at/wmts/flwbplmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps2.wien.gv.at/wmts/flwbplmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps3.wien.gv.at/wmts/flwbplmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps4.wien.gv.at/wmts/flwbplmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-			<ResourceURL format="image/jpeg" template="http://maps.wien.gv.at/wmts/flwbplmzk/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.jpeg" resourceType="tile"/>
-		</Layer>
-		<Layer>
-			<ows:Title>Beschriftung</ows:Title>
-			<ows:WGS84BoundingBox crs="urn:ogc:def:crs:OGC:2:84">
-				<ows:LowerCorner>16.17 48.10</ows:LowerCorner>
-				<ows:UpperCorner>16.58 48.33</ows:UpperCorner>
-			</ows:WGS84BoundingBox>
-			<ows:Identifier>beschriftung</ows:Identifier>
-			<Style isDefault="true">
-				<ows:Identifier>normal</ows:Identifier>
-			</Style>
-			<Format>image/png</Format>
-			<TileMatrixSetLink>
-				<TileMatrixSet>google3857</TileMatrixSet>
-			</TileMatrixSetLink>
-			<ResourceURL format="image/png" template="http://maps1.wien.gv.at/wmts/beschriftung/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png" resourceType="tile"/>
-			<ResourceURL format="image/png" template="http://maps2.wien.gv.at/wmts/beschriftung/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png" resourceType="tile"/>
-			<ResourceURL format="image/png" template="http://maps3.wien.gv.at/wmts/beschriftung/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png" resourceType="tile"/>
-			<ResourceURL format="image/png" template="http://maps4.wien.gv.at/wmts/beschriftung/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png" resourceType="tile"/>
-			<ResourceURL format="image/png" template="http://maps.wien.gv.at/wmts/beschriftung/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}.png" resourceType="tile"/>
-		</Layer>
-		<TileMatrixSet>
-			<!-- -180 85.05112878 -->
-			<ows:Identifier>google3857</ows:Identifier>
-			<ows:BoundingBox crs="urn:ogc:def:crs:EPSG:6.18:3:3857">
-				<ows:LowerCorner>1799448.394855 6124949.747770</ows:LowerCorner>
-				<ows:UpperCorner>1848250.442089 6162571.828177</ows:UpperCorner>
-			</ows:BoundingBox>
-			<ows:SupportedCRS>urn:ogc:def:crs:EPSG:6.18:3:3857</ows:SupportedCRS>
-			<WellKnownScaleSet>urn:ogc:def:wkss:OGC:1.0:GoogleMapsCompatible</WellKnownScaleSet>
-			<TileMatrix>
-				<ows:Identifier>0</ows:Identifier>
-				<ScaleDenominator>559082264.029</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>1</MatrixWidth>
-				<MatrixHeight>1</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>1</ows:Identifier>
-				<ScaleDenominator>279541132.015</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>2</MatrixWidth>
-				<MatrixHeight>2</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>2</ows:Identifier>
-				<ScaleDenominator>139770566.007</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>4</MatrixWidth>
-				<MatrixHeight>4</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>3</ows:Identifier>
-				<ScaleDenominator>69885283.0036</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>8</MatrixWidth>
-				<MatrixHeight>8</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>4</ows:Identifier>
-				<ScaleDenominator>34942641.5018</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>16</MatrixWidth>
-				<MatrixHeight>16</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>5</ows:Identifier>
-				<ScaleDenominator>17471320.7509</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>32</MatrixWidth>
-				<MatrixHeight>32</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>6</ows:Identifier>
-				<ScaleDenominator>8735660.37545</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>64</MatrixWidth>
-				<MatrixHeight>64</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>7</ows:Identifier>
-				<ScaleDenominator>4367830.18773</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>128</MatrixWidth>
-				<MatrixHeight>128</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>8</ows:Identifier>
-				<ScaleDenominator>2183915.09386</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>256</MatrixWidth>
-				<MatrixHeight>256</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>9</ows:Identifier>
-				<ScaleDenominator>1091957.54693</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>512</MatrixWidth>
-				<MatrixHeight>512</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>10</ows:Identifier>
-				<ScaleDenominator>545978.773466</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>1024</MatrixWidth>
-				<MatrixHeight>1024</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>11</ows:Identifier>
-				<ScaleDenominator>272989.386733</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>2048</MatrixWidth>
-				<MatrixHeight>2048</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>12</ows:Identifier>
-				<ScaleDenominator>136494.693366</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>4096</MatrixWidth>
-				<MatrixHeight>4096</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>13</ows:Identifier>
-				<ScaleDenominator>68247.3466832</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>8192</MatrixWidth>
-				<MatrixHeight>8192</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>14</ows:Identifier>
-				<ScaleDenominator>34123.6733416</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>16384</MatrixWidth>
-				<MatrixHeight>16384</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>15</ows:Identifier>
-				<ScaleDenominator>17061.8366708</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>32768</MatrixWidth>
-				<MatrixHeight>32768</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>16</ows:Identifier>
-				<ScaleDenominator>8530.91833540</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>65536</MatrixWidth>
-				<MatrixHeight>65536</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>17</ows:Identifier>
-				<ScaleDenominator>4265.45916770</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>131072</MatrixWidth>
-				<MatrixHeight>131072</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>18</ows:Identifier>
-				<ScaleDenominator>2132.72958385</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>262144</MatrixWidth>
-				<MatrixHeight>262144</MatrixHeight>
-			</TileMatrix>
-			<TileMatrix>
-				<ows:Identifier>19</ows:Identifier>
-				<ScaleDenominator>1066.36479193</ScaleDenominator>
-				<TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
-				<TileWidth>256</TileWidth>
-				<TileHeight>256</TileHeight>
-				<MatrixWidth>524288</MatrixWidth>
-				<MatrixHeight>524288</MatrixHeight>
-			</TileMatrix>
-		</TileMatrixSet>
-	</Contents>
-	<ServiceMetadataURL xlink:href="http://maps.wien.gv.at/wmts/1.0.0/WMTSCapabilities.xml"/>
+<Capabilities version="1.0.0" xmlns="http://www.opengis.net/wmts/1.0" xmlns:gml="http://www.opengis.net/gml" xmlns:ows="http://www.opengis.net/ows/1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.opengis.net/wmts/1.0 http://schemas.opengis.net/wmts/1.0/wmtsGetCapabilities_response.xsd">
+    <ows:ServiceIdentification>
+        <ows:Title>Koordinates Labs</ows:Title>
+        <ows:ServiceType>OGC WMTS</ows:ServiceType>
+        <ows:ServiceTypeVersion>1.0.0</ows:ServiceTypeVersion>
+    </ows:ServiceIdentification>
+    <ows:ServiceProvider>
+        <ows:ProviderName>Koordinates</ows:ProviderName>
+        <ows:ProviderSite xlink:href="http://labs.koordinates.com"/>
+        <ows:ServiceContact/>
+    </ows:ServiceProvider>
+    <ows:OperationsMetadata>
+        <ows:Operation name="GetCapabilities">
+            <ows:DCP>
+                <ows:HTTP>
+                    <ows:Get xlink:href="https://labs.koordinates.com/services;key=d740ea02e0c44cafb70dce31a774ca10/wmts/1.0.0/layer/7328/WMTSCapabilities.xml?">
+                        <ows:Constraint name="GetEncoding">
+                            <ows:AllowedValues>
+                                <ows:Value>KVP</ows:Value>
+                            </ows:AllowedValues>
+                        </ows:Constraint>
+                    </ows:Get>
+                </ows:HTTP>
+            </ows:DCP>
+        </ows:Operation>
+        <ows:Operation name="GetFeatureInfo">
+            <ows:DCP>
+                <ows:HTTP>
+                    <ows:Get xlink:href="https://labs.koordinates.com/services;key=d740ea02e0c44cafb70dce31a774ca10/wmts/?">
+                        <ows:Constraint name="GetEncoding">
+                            <ows:AllowedValues>
+                                <ows:Value>KVP</ows:Value>
+                            </ows:AllowedValues>
+                        </ows:Constraint>
+                    </ows:Get>
+                </ows:HTTP>
+            </ows:DCP>
+        </ows:Operation>
+    </ows:OperationsMetadata>
+    <Contents>
+        <Layer>
+            <ows:Title>New Zealand Earthquakes</ows:Title>
+            <ows:Abstract>Historical earthquake data, accessed via the [GeoNet WFS feed](http://info.geonet.org.nz/display/appdata/Advanced+Queries). The data has been filtered to only include quakes in proximity to New Zealand with an `eventtype` of &quot;Earthquake&quot; or &quot;none&quot; per the [GeoNet catalogue](http://info.geonet.org.nz/display/appdata/Catalogue+Output). Most fields have been removed. Please also note the excluded data per this [GeoNet page](http://info.geonet.org.nz/display/appdata/The+Gap). We acknowledge the New Zealand GeoNet project and its sponsors EQC, GNS Science and LINZ, for providing data used in this layer.</ows:Abstract>
+            <ows:Identifier>layer-7328</ows:Identifier>
+            <ows:BoundingBox crs="urn:ogc:def:crs:EPSG::3857">
+                <ows:LowerCorner>-20037508.342789 -6406581.708337</ows:LowerCorner>
+                <ows:UpperCorner>20037508.342789 -3653545.667928</ows:UpperCorner>
+            </ows:BoundingBox>
+            <ows:WGS84BoundingBox crs="urn:ogc:def:crs:OGC:2:84">
+                <ows:LowerCorner>-180.000000 -49.454297</ows:LowerCorner>
+                <ows:UpperCorner>180.000000 -31.160000</ows:UpperCorner>
+            </ows:WGS84BoundingBox>
+            <Style isDefault="true">
+                <ows:Title>Weighted point styles</ows:Title>
+                <ows:Identifier>style=39</ows:Identifier>
+            </Style>
+            <Format>image/png</Format>
+            <InfoFormat>application/json</InfoFormat>
+            <InfoFormat>text/html</InfoFormat>
+            <TileMatrixSetLink>
+                <TileMatrixSet>EPSG:3857</TileMatrixSet>
+            </TileMatrixSetLink>
+            <ResourceURL format="image/png" resourceType="tile" template="https://koordinates-tiles-a.global.ssl.fastly.net/services;key=d740ea02e0c44cafb70dce31a774ca10/tiles/v4/layer=7328,{style}/{TileMatrixSet}/{TileMatrix}/{TileCol}/{TileRow}.png"/>
+            <ResourceURL format="application/json" resourceType="FeatureInfo" template="https://labs.koordinates.com/services;key=d740ea02e0c44cafb70dce31a774ca10/wmts/1.0.0/layer/7328/featureinfo/{TileMatrixSet}/{TileMatrix}/{TileCol}/{TileRow}/{I}/{J}.json"/>
+            <ResourceURL format="text/html" resourceType="FeatureInfo" template="https://labs.koordinates.com/services;key=d740ea02e0c44cafb70dce31a774ca10/wmts/1.0.0/layer/7328/featureinfo/{TileMatrixSet}/{TileMatrix}/{TileCol}/{TileRow}/{I}/{J}.html"/>
+        </Layer>
+        <TileMatrixSet>
+            <ows:Title>GoogleMapsCompatible</ows:Title>
+            <ows:Abstract>The well-known 'GoogleMapsCompatible' tile matrix set defined by the OGC WMTS specification</ows:Abstract>
+            <ows:Identifier>EPSG:3857</ows:Identifier>
+            <ows:BoundingBox crs="urn:ogc:def:crs:EPSG::3857">
+                <ows:LowerCorner>-20037508.342789 -20037508.342789</ows:LowerCorner>
+                <ows:UpperCorner>20037508.342789 20037508.342789</ows:UpperCorner>
+            </ows:BoundingBox>
+            <ows:SupportedCRS>urn:ogc:def:crs:EPSG::3857</ows:SupportedCRS>
+            <WellKnownScaleSet>urn:ogc:def:wkss:OGC:1.0:GoogleMapsCompatible</WellKnownScaleSet>
+            <TileMatrix>
+                <ows:Identifier>0</ows:Identifier>
+                <ScaleDenominator>559082264.029</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>1</MatrixWidth>
+                <MatrixHeight>1</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>1</ows:Identifier>
+                <ScaleDenominator>279541132.014</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>2</MatrixWidth>
+                <MatrixHeight>2</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>2</ows:Identifier>
+                <ScaleDenominator>139770566.007</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>4</MatrixWidth>
+                <MatrixHeight>4</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>3</ows:Identifier>
+                <ScaleDenominator>69885283.0036</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>8</MatrixWidth>
+                <MatrixHeight>8</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>4</ows:Identifier>
+                <ScaleDenominator>34942641.5018</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>16</MatrixWidth>
+                <MatrixHeight>16</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>5</ows:Identifier>
+                <ScaleDenominator>17471320.7509</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>32</MatrixWidth>
+                <MatrixHeight>32</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>6</ows:Identifier>
+                <ScaleDenominator>8735660.37545</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>64</MatrixWidth>
+                <MatrixHeight>64</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>7</ows:Identifier>
+                <ScaleDenominator>4367830.18772</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>128</MatrixWidth>
+                <MatrixHeight>128</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>8</ows:Identifier>
+                <ScaleDenominator>2183915.09386</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>256</MatrixWidth>
+                <MatrixHeight>256</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>9</ows:Identifier>
+                <ScaleDenominator>1091957.54693</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>512</MatrixWidth>
+                <MatrixHeight>512</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>10</ows:Identifier>
+                <ScaleDenominator>545978.773466</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>1024</MatrixWidth>
+                <MatrixHeight>1024</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>11</ows:Identifier>
+                <ScaleDenominator>272989.386733</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>2048</MatrixWidth>
+                <MatrixHeight>2048</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>12</ows:Identifier>
+                <ScaleDenominator>136494.693366</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>4096</MatrixWidth>
+                <MatrixHeight>4096</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>13</ows:Identifier>
+                <ScaleDenominator>68247.3466832</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>8192</MatrixWidth>
+                <MatrixHeight>8192</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>14</ows:Identifier>
+                <ScaleDenominator>34123.6733416</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>16384</MatrixWidth>
+                <MatrixHeight>16384</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>15</ows:Identifier>
+                <ScaleDenominator>17061.8366708</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>32768</MatrixWidth>
+                <MatrixHeight>32768</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>16</ows:Identifier>
+                <ScaleDenominator>8530.9183354</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>65536</MatrixWidth>
+                <MatrixHeight>65536</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>17</ows:Identifier>
+                <ScaleDenominator>4265.4591677</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>131072</MatrixWidth>
+                <MatrixHeight>131072</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>18</ows:Identifier>
+                <ScaleDenominator>2132.72958385</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>262144</MatrixWidth>
+                <MatrixHeight>262144</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>19</ows:Identifier>
+                <ScaleDenominator>1066.36479192</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>524288</MatrixWidth>
+                <MatrixHeight>524288</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>20</ows:Identifier>
+                <ScaleDenominator>533.182395962</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>1048576</MatrixWidth>
+                <MatrixHeight>1048576</MatrixHeight>
+            </TileMatrix>
+            <TileMatrix>
+                <ows:Identifier>21</ows:Identifier>
+                <ScaleDenominator>266.591197981</ScaleDenominator>
+                <TopLeftCorner>-20037508.3428 20037508.3428</TopLeftCorner>
+                <TileWidth>256</TileWidth>
+                <TileHeight>256</TileHeight>
+                <MatrixWidth>2097152</MatrixWidth>
+                <MatrixHeight>2097152</MatrixHeight>
+            </TileMatrix>
+        </TileMatrixSet>
+    </Contents>
+    <ServiceMetadataURL xlink:href="https://labs.koordinates.com/services;key=d740ea02e0c44cafb70dce31a774ca10/wmts/1.0.0/layer/7328/WMTSCapabilities.xml"/>
 </Capabilities>

examples/drag-and-drop-image-vector.js

@@ -145,7 +145,10 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });

examples/drag-and-drop.js

@@ -141,7 +141,10 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });

examples/drag-features.html

@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Drag features example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Drag features example</h4>
+          <p id="shortdesc">Example of a drag features interaction.</p>
+          <div id="docs">
+            <p>See the <a href="drag-features.js" target="_blank">drag-features.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">drag, feature, vector, editing</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=drag-features" type="text/javascript"></script>
+
+  </body>
+</html>

examples/drag-features.js

@@ -0,0 +1,192 @@
+goog.require('ol.Feature');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.LineString');
+goog.require('ol.geom.Point');
+goog.require('ol.geom.Polygon');
+goog.require('ol.interaction');
+goog.require('ol.interaction.Pointer');
+goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.TileJSON');
+goog.require('ol.source.Vector');
+goog.require('ol.style.Fill');
+goog.require('ol.style.Icon');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+
+
+/**
+ * Define a namespace for the application.
+ */
+window.app = {};
+var app = window.app;
+
+
+
+/**
+ * @constructor
+ * @extends {ol.interaction.Pointer}
+ */
+app.Drag = function() {
+
+  ol.interaction.Pointer.call(this, {
+    handleDownEvent: app.Drag.prototype.handleDownEvent,
+    handleDragEvent: app.Drag.prototype.handleDragEvent,
+    handleMoveEvent: app.Drag.prototype.handleMoveEvent,
+    handleUpEvent: app.Drag.prototype.handleUpEvent
+  });
+
+  /**
+   * @type {ol.Pixel}
+   * @private
+   */
+  this.coordinate_ = null;
+
+  /**
+   * @type {string|undefined}
+   * @private
+   */
+  this.cursor_ = 'pointer';
+
+  /**
+   * @type {ol.Feature}
+   * @private
+   */
+  this.feature_ = null;
+
+  /**
+   * @type {string|undefined}
+   * @private
+   */
+  this.previousCursor_ = undefined;
+
+};
+ol.inherits(app.Drag, ol.interaction.Pointer);
+
+
+/**
+ * @param {ol.MapBrowserEvent} evt Map browser event.
+ * @return {boolean} `true` to start the drag sequence.
+ */
+app.Drag.prototype.handleDownEvent = function(evt) {
+  var map = evt.map;
+
+  var feature = map.forEachFeatureAtPixel(evt.pixel,
+      function(feature, layer) {
+        return feature;
+      });
+
+  if (feature) {
+    this.coordinate_ = evt.coordinate;
+    this.feature_ = feature;
+  }
+
+  return !!feature;
+};
+
+
+/**
+ * @param {ol.MapBrowserEvent} evt Map browser event.
+ */
+app.Drag.prototype.handleDragEvent = function(evt) {
+  var map = evt.map;
+
+  var feature = map.forEachFeatureAtPixel(evt.pixel,
+      function(feature, layer) {
+        return feature;
+      });
+
+  var deltaX = evt.coordinate[0] - this.coordinate_[0];
+  var deltaY = evt.coordinate[1] - this.coordinate_[1];
+
+  var geometry = /** @type {ol.geom.SimpleGeometry} */
+      (this.feature_.getGeometry());
+  geometry.translate(deltaX, deltaY);
+
+  this.coordinate_[0] = evt.coordinate[0];
+  this.coordinate_[1] = evt.coordinate[1];
+};
+
+
+/**
+ * @param {ol.MapBrowserEvent} evt Event.
+ */
+app.Drag.prototype.handleMoveEvent = function(evt) {
+  if (this.cursor_) {
+    var map = evt.map;
+    var feature = map.forEachFeatureAtPixel(evt.pixel,
+        function(feature, layer) {
+          return feature;
+        });
+    var element = evt.map.getTargetElement();
+    if (feature) {
+      if (element.style.cursor != this.cursor_) {
+        this.previousCursor_ = element.style.cursor;
+        element.style.cursor = this.cursor_;
+      }
+    } else if (this.previousCursor_ !== undefined) {
+      element.style.cursor = this.previousCursor_;
+      this.previousCursor_ = undefined;
+    }
+  }
+};
+
+
+/**
+ * @param {ol.MapBrowserEvent} evt Map browser event.
+ * @return {boolean} `false` to stop the drag sequence.
+ */
+app.Drag.prototype.handleUpEvent = function(evt) {
+  this.coordinate_ = null;
+  this.feature_ = null;
+  return false;
+};
+
+
+var pointFeature = new ol.Feature(new ol.geom.Point([0, 0]));
+
+var lineFeature = new ol.Feature(
+    new ol.geom.LineString([[-1e7, 1e6], [-1e6, 3e6]]));
+
+var polygonFeature = new ol.Feature(
+    new ol.geom.Polygon([[[-3e6, -1e6], [-3e6, 1e6],
+        [-1e6, 1e6], [-1e6, -1e6], [-3e6, -1e6]]]));
+
+
+var map = new ol.Map({
+  interactions: ol.interaction.defaults().extend([new app.Drag()]),
+  layers: [
+    new ol.layer.Tile({
+      source: new ol.source.TileJSON({
+        url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp'
+      })
+    }),
+    new ol.layer.Vector({
+      source: new ol.source.Vector({
+        features: [pointFeature, lineFeature, polygonFeature]
+      }),
+      style: new ol.style.Style({
+        image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
+          anchor: [0.5, 46],
+          anchorXUnits: 'fraction',
+          anchorYUnits: 'pixels',
+          opacity: 0.95,
+          src: 'data/icon.png'
+        })),
+        stroke: new ol.style.Stroke({
+          width: 3,
+          color: [255, 0, 0, 1]
+        }),
+        fill: new ol.style.Fill({
+          color: [0, 0, 255, 0.6]
+        })
+      })
+    })
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 2
+  })
+});

examples/draw-features.js

@@ -38,6 +38,7 @@ var vector = new ol.layer.Vector({
 
 var map = new ol.Map({
   layers: [raster, vector],
+  renderer: exampleNS.getRendererFromQueryString(),
   target: 'map',
   view: new ol.View({
     center: [-11000000, 4600000],

examples/dynamic-data.js

@@ -1,11 +1,14 @@
+goog.require('ol.Feature');
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.geom.MultiPoint');
+goog.require('ol.geom.Point');
 goog.require('ol.layer.Tile');
 goog.require('ol.source.MapQuest');
 goog.require('ol.style.Circle');
 goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
 
 
 var map = new ol.Map({
@@ -14,6 +17,7 @@ var map = new ol.Map({
       source: new ol.source.MapQuest({layer: 'sat'})
     })
   ],
+  renderer: exampleNS.getRendererFromQueryString(),
   target: 'map',
   view: new ol.View({
     center: [0, 0],
@@ -28,6 +32,20 @@ var imageStyle = new ol.style.Circle({
   stroke: new ol.style.Stroke({color: 'red', width: 1})
 });
 
+var headInnerImageStyle = new ol.style.Style({
+  image: new ol.style.Circle({
+    radius: 2,
+    snapToPixel: false,
+    fill: new ol.style.Fill({color: 'blue'})
+  })
+});
+
+var headOuterImageStyle = new ol.style.Circle({
+  radius: 5,
+  snapToPixel: false,
+  fill: new ol.style.Fill({color: 'black'})
+});
+
 var n = 200;
 var omegaTheta = 30000; // Rotation period in ms
 var R = 7e6;
@@ -48,6 +66,14 @@ map.on('postcompose', function(event) {
   vectorContext.setImageStyle(imageStyle);
   vectorContext.drawMultiPointGeometry(
       new ol.geom.MultiPoint(coordinates), null);
+
+  var headPoint = new ol.geom.Point(coordinates[coordinates.length - 1]);
+  var headFeature = new ol.Feature(headPoint);
+  vectorContext.drawFeature(headFeature, headInnerImageStyle);
+
+  vectorContext.setImageStyle(headOuterImageStyle);
+  vectorContext.drawMultiPointGeometry(headPoint, null);
+
   map.render();
 });
 map.render();

examples/earthquake-clusters.html

@@ -0,0 +1,75 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Earthquake Clusters</title>
+    <style>
+      #map {
+        position: relative;
+      }
+      #info {
+        position: absolute;
+        height: 1px;
+        width: 1px;
+        z-index: 100;
+      }
+      .tooltip.in {
+        opacity: 1;
+        filter: alpha(opacity=100);
+      }
+      .tooltip.top .tooltip-arrow {
+        border-top-color: white;
+      }
+      .tooltip-inner {
+        border: 2px solid white;
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Earthquake Clusters</h4>
+          <p id="shortdesc">Demonstrates the use of style geometries to render source features of a cluster.</p>
+          <div id="docs">
+            <p>
+              This example parses a KML file and renders the features as clusters on a vector layer.  The styling in this example is quite involved. Single earthquake locations (rendered as stars) have a size relative to their magnitude. Clusters have an opacity relative to the number of features in the cluster, and a size that represents the extent of the features that make up the cluster. When clicking or hovering on a cluster, the individual features that make up the cluster will be shown.
+            </p>
+            <p>To achieve this, we make heavy use of style functions and <code>ol.style.Style#geometry</code>. See the <a href="earthquake-clusters.js" target="_blank">earthquake-clusters.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">KML, vector, style, geometry, cluster</div>
+        </div>
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=earthquake-clusters" type="text/javascript"></script>
+
+  </body>
+</html>

examples/earthquake-clusters.js

@@ -0,0 +1,154 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.extent');
+goog.require('ol.interaction');
+goog.require('ol.interaction.Select');
+goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.Cluster');
+goog.require('ol.source.KML');
+goog.require('ol.source.Stamen');
+goog.require('ol.style.Circle');
+goog.require('ol.style.Fill');
+goog.require('ol.style.RegularShape');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+goog.require('ol.style.Text');
+
+
+var earthquakeFill = new ol.style.Fill({
+  color: 'rgba(255, 153, 0, 0.8)'
+});
+var earthquakeStroke = new ol.style.Stroke({
+  color: 'rgba(255, 204, 0, 0.2)',
+  width: 1
+});
+var textFill = new ol.style.Fill({
+  color: '#fff'
+});
+var textStroke = new ol.style.Stroke({
+  color: 'rgba(0, 0, 0, 0.6)',
+  width: 3
+});
+var invisibleFill = new ol.style.Fill({
+  color: 'rgba(255, 255, 255, 0.01)'
+});
+
+function createEarthquakeStyle(feature) {
+  // 2012_Earthquakes_Mag5.kml stores the magnitude of each earthquake in a
+  // standards-violating <magnitude> tag in each Placemark.  We extract it
+  // from the Placemark's name instead.
+  var name = feature.get('name');
+  var magnitude = parseFloat(name.substr(2));
+  var radius = 5 + 20 * (magnitude - 5);
+
+  return new ol.style.Style({
+    geometry: feature.getGeometry(),
+    image: new ol.style.RegularShape({
+      radius1: radius,
+      radius2: 3,
+      points: 5,
+      angle: Math.PI,
+      fill: earthquakeFill,
+      stroke: earthquakeStroke
+    })
+  });
+}
+
+var maxFeatureCount;
+function calculateClusterInfo(resolution) {
+  maxFeatureCount = 0;
+  var features = vector.getSource().getFeatures();
+  var feature, radius;
+  for (var i = features.length - 1; i >= 0; --i) {
+    feature = features[i];
+    var originalFeatures = feature.get('features');
+    var extent = ol.extent.createEmpty();
+    for (var j = 0, jj = originalFeatures.length; j < jj; ++j) {
+      ol.extent.extend(extent, originalFeatures[j].getGeometry().getExtent());
+    }
+    maxFeatureCount = Math.max(maxFeatureCount, jj);
+    radius = 0.25 * (ol.extent.getWidth(extent) + ol.extent.getHeight(extent)) /
+        resolution;
+    feature.set('radius', radius);
+  }
+}
+
+var currentResolution;
+function styleFunction(feature, resolution) {
+  if (resolution != currentResolution) {
+    calculateClusterInfo(resolution);
+    currentResolution = resolution;
+  }
+  var style;
+  var size = feature.get('features').length;
+  if (size > 1) {
+    style = [new ol.style.Style({
+      image: new ol.style.Circle({
+        radius: feature.get('radius'),
+        fill: new ol.style.Fill({
+          color: [255, 153, 0, Math.min(0.8, 0.4 + (size / maxFeatureCount))]
+        })
+      }),
+      text: new ol.style.Text({
+        text: size.toString(),
+        fill: textFill,
+        stroke: textStroke
+      })
+    })];
+  } else {
+    var originalFeature = feature.get('features')[0];
+    style = [createEarthquakeStyle(originalFeature)];
+  }
+  return style;
+}
+
+function selectStyleFunction(feature, resolution) {
+  var styles = [new ol.style.Style({
+    image: new ol.style.Circle({
+      radius: feature.get('radius'),
+      fill: invisibleFill
+    })
+  })];
+  var originalFeatures = feature.get('features');
+  var originalFeature;
+  for (var i = originalFeatures.length - 1; i >= 0; --i) {
+    originalFeature = originalFeatures[i];
+    styles.push(createEarthquakeStyle(originalFeature));
+  }
+  return styles;
+}
+
+var vector = new ol.layer.Vector({
+  source: new ol.source.Cluster({
+    distance: 40,
+    source: new ol.source.KML({
+      extractStyles: false,
+      projection: 'EPSG:3857',
+      url: 'data/kml/2012_Earthquakes_Mag5.kml'
+    })
+  }),
+  style: styleFunction
+});
+
+var raster = new ol.layer.Tile({
+  source: new ol.source.Stamen({
+    layer: 'toner'
+  })
+});
+
+var map = new ol.Map({
+  layers: [raster, vector],
+  interactions: ol.interaction.defaults().extend([new ol.interaction.Select({
+    condition: function(evt) {
+      return evt.originalEvent.type == 'mousemove' ||
+          evt.type == 'singleclick';
+    },
+    style: selectStyleFunction
+  })]),
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 2
+  })
+});

examples/epsg-4326.js

@@ -9,7 +9,7 @@ goog.require('ol.source.TileWMS');
 var layers = [
   new ol.layer.Tile({
     source: new ol.source.TileWMS({
-      url: 'http://demo.opengeo.org/geoserver/wms',
+      url: 'http://demo.boundlessgeo.com/geoserver/wms',
       params: {
         'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
       }

examples/getfeatureinfo-image.html

@@ -35,9 +35,11 @@
           <h4 id="title">GetFeatureInfo example (image layer)</h4>
           <p id="shortdesc">This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS image layer.</p>
           <div id="docs">
+            <p>Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse
+            pointer when hovering a non-transparent pixel on the map.</p>
             <p>See the <a href="getfeatureinfo-image.js" target="_blank">getfeatureinfo-image.js source</a> to see how this is done.</p>
           </div>
-          <div id="tags">getfeatureinfo</div>
+          <div id="tags">getfeatureinfo, forEachLayerAtPixel</div>
         </div>
         <div class="span4 offset4">
           <div id="info" class="alert alert-success">

examples/getfeatureinfo-image.js

@@ -5,9 +5,10 @@ goog.require('ol.source.ImageWMS');
 
 
 var wmsSource = new ol.source.ImageWMS({
-  url: 'http://demo.opengeo.org/geoserver/wms',
+  url: 'http://demo.boundlessgeo.com/geoserver/wms',
   params: {'LAYERS': 'ne:ne'},
-  serverType: 'geoserver'
+  serverType: 'geoserver',
+  crossOrigin: ''
 });
 
 var wmsLayer = new ol.layer.Image({
@@ -20,6 +21,7 @@ var view = new ol.View({
 });
 
 var map = new ol.Map({
+  renderer: exampleNS.getRendererFromQueryString(),
   layers: [wmsLayer],
   target: 'map',
   view: view
@@ -36,3 +38,14 @@ map.on('singleclick', function(evt) {
         '<iframe seamless src="' + url + '"></iframe>';
   }
 });
+
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  var pixel = map.getEventPixel(evt.originalEvent);
+  var hit = map.forEachLayerAtPixel(pixel, function(layer) {
+    return true;
+  });
+  map.getTargetElement().style.cursor = hit ? 'pointer' : '';
+});

examples/getfeatureinfo-tile.html

@@ -35,9 +35,11 @@
           <h4 id="title">WMS GetFeatureInfo example (tile layer)</h4>
           <p id="shortdesc">This example shows how to trigger WMS GetFeatureInfo requests on click for a WMS tile layer.</p>
           <div id="docs">
+            <p>Additionally <code>map.forEachLayerAtPixel</code> is used to change the mouse
+            pointer when hovering a non-transparent pixel on the map.</p>
             <p>See the <a href="getfeatureinfo-tile.js" target="_blank">getfeatureinfo-tile.js source</a> to see how this is done.</p>
           </div>
-          <div id="tags">getfeatureinfo</div>
+          <div id="tags">getfeatureinfo, forEachLayerAtPixel</div>
         </div>
         <div class="span4 offset4">
           <div id="info" class="alert alert-success">

examples/getfeatureinfo-tile.js

@@ -5,9 +5,10 @@ goog.require('ol.source.TileWMS');
 
 
 var wmsSource = new ol.source.TileWMS({
-  url: 'http://demo.opengeo.org/geoserver/wms',
+  url: 'http://demo.boundlessgeo.com/geoserver/wms',
   params: {'LAYERS': 'ne:ne'},
-  serverType: 'geoserver'
+  serverType: 'geoserver',
+  crossOrigin: ''
 });
 
 var wmsLayer = new ol.layer.Tile({
@@ -20,6 +21,7 @@ var view = new ol.View({
 });
 
 var map = new ol.Map({
+  renderer: exampleNS.getRendererFromQueryString(),
   layers: [wmsLayer],
   target: 'map',
   view: view
@@ -36,3 +38,14 @@ map.on('singleclick', function(evt) {
         '<iframe seamless src="' + url + '"></iframe>';
   }
 });
+
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  var pixel = map.getEventPixel(evt.originalEvent);
+  var hit = map.forEachLayerAtPixel(pixel, function(layer) {
+    return true;
+  });
+  map.getTargetElement().style.cursor = hit ? 'pointer' : '';
+});

examples/gpx.js

@@ -85,7 +85,10 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });
@@ -105,9 +108,7 @@ if ('download' in exportGPXElement) {
         clone.getGeometry().transform(projection, 'EPSG:4326');
         features.push(clone);
       });
-      var node = new ol.format.GPX().writeFeatures(features);
-      var string = new XMLSerializer().serializeToString(
-          /** @type {Node} */ (node));
+      var string = new ol.format.GPX().writeFeatures(features);
       var base64 = exampleNS.strToBase64(string);
       exportGPXElement.href =
           'data:text/gpx+xml;base64,' + base64;

examples/heatmap-earthquakes.html

@@ -29,7 +29,7 @@
 
       <div class="row-fluid">
 
-        <div class="span12">
+        <div class="span8">
           <h4 id="title">Earthquakes heatmap</h4>
           <p id="shortdesc">Demonstrates the use of a heatmap layer.</p>
           <div id="docs">
@@ -40,8 +40,17 @@
           </div>
           <div id="tags">heatmap, kml, vector, style</div>
         </div>
-      </div>
 
+        <div class="span4">
+          <form>
+            <label>radius size</label>
+            <input id="radius" type="range" min="1" max="50" step="1" value="5"/>
+            <label>blur size</label>
+            <input id="blur" type="range" min="1" max="50" step="1" value="15"/>
+          </form>
+        </div>
+
+      </div>
     </div>
 
     <script src="../resources/jquery.min.js" type="text/javascript"></script>

examples/heatmap-earthquakes.js

@@ -5,6 +5,8 @@ goog.require('ol.layer.Tile');
 goog.require('ol.source.KML');
 goog.require('ol.source.Stamen');
 
+var blur = $('#blur');
+var radius = $('#radius');
 
 var vector = new ol.layer.Heatmap({
   source: new ol.source.KML({
@@ -12,7 +14,8 @@ var vector = new ol.layer.Heatmap({
     projection: 'EPSG:3857',
     url: 'data/kml/2012_Earthquakes_Mag5.kml'
   }),
-  radius: 5
+  blur: parseInt(blur.val(), 10),
+  radius: parseInt(radius.val(), 10)
 });
 
 vector.getSource().on('addfeature', function(event) {
@@ -38,3 +41,12 @@ var map = new ol.Map({
     zoom: 2
   })
 });
+
+
+blur.on('input', function() {
+  vector.setBlur(parseInt(blur.val(), 10));
+});
+
+radius.on('input', function() {
+  vector.setRadius(parseInt(radius.val(), 10));
+});

examples/icon-sprite-webgl.html

@@ -0,0 +1,58 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Icon sprites with WebGL example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span8">
+          <h4 id="title">Icon sprite with WebGL example</h4>
+          <p id="shortdesc">Icon sprite with WebGL.</p>
+          <div id="docs">
+            <p>See the <a href="icon-sprite-webgl.js" target="_blank">icon-sprite-webgl.js source</a> to see how this is done.</p>
+            <p>In this example a sprite image is used for the icon styles. Using a sprite is required to get good performance with WebGL.</p>
+          </div>
+          <div id="tags">webgl, icon, sprite, vector, point</div>
+        </div>
+        <div class="span2 offset2">
+          <div id="info" class="alert alert-success">
+            &nbsp;
+          </div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=icon-sprite-webgl" type="text/javascript"></script>
+
+  </body>
+</html>

examples/icon-sprite-webgl.js

@@ -0,0 +1,142 @@
+goog.require('ol.Feature');
+goog.require('ol.FeatureOverlay');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.Point');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.Vector');
+goog.require('ol.style.Icon');
+goog.require('ol.style.Style');
+
+
+var iconInfo = [{
+  offset: [0, 0],
+  opacity: 1.0,
+  rotateWithView: true,
+  rotation: 0.0,
+  scale: 1.0,
+  size: [55, 55]
+}, {
+  offset: [110, 86],
+  opacity: 0.75,
+  rotateWithView: false,
+  rotation: Math.PI / 2.0,
+  scale: 1.25,
+  size: [55, 55]
+}, {
+  offset: [55, 0],
+  opacity: 0.5,
+  rotateWithView: true,
+  rotation: Math.PI / 3.0,
+  scale: 1.5,
+  size: [55, 86]
+}, {
+  offset: [212, 0],
+  opacity: 1.0,
+  rotateWithView: true,
+  rotation: 0.0,
+  scale: 1.0,
+  size: [44, 44]
+}];
+
+var i;
+
+var iconCount = iconInfo.length;
+var icons = new Array(iconCount);
+for (i = 0; i < iconCount; ++i) {
+  var info = iconInfo[i];
+  icons[i] = new ol.style.Icon({
+    offset: info.offset,
+    opacity: info.opacity,
+    rotateWithView: info.rotateWithView,
+    rotation: info.rotation,
+    scale: info.scale,
+    size: info.size,
+    src: 'data/Butterfly.png'
+  });
+}
+
+var featureCount = 50000;
+var features = new Array(featureCount);
+var feature, geometry;
+var e = 25000000;
+for (i = 0; i < featureCount; ++i) {
+  geometry = new ol.geom.Point(
+      [2 * e * Math.random() - e, 2 * e * Math.random() - e]);
+  feature = new ol.Feature(geometry);
+  feature.setStyle(
+      new ol.style.Style({
+        image: icons[i % (iconCount - 1)]
+      })
+  );
+  features[i] = feature;
+}
+
+var vectorSource = new ol.source.Vector({
+  features: features
+});
+var vector = new ol.layer.Vector({
+  source: vectorSource
+});
+
+// Use the "webgl" renderer by default.
+var renderer = exampleNS.getRendererFromQueryString();
+if (!renderer) {
+  renderer = 'webgl';
+}
+
+var map = new ol.Map({
+  renderer: renderer,
+  layers: [vector],
+  target: document.getElementById('map'),
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 5
+  })
+});
+
+var overlayFeatures = [];
+for (i = 0; i < featureCount; i += 30) {
+  var clone = features[i].clone();
+  clone.setStyle(null);
+  overlayFeatures.push(clone);
+}
+
+var featureOverlay = new ol.FeatureOverlay({
+  map: map,
+  style: new ol.style.Style({
+    image: icons[iconCount - 1]
+  }),
+  features: overlayFeatures
+});
+
+map.on('click', function(evt) {
+  var info = document.getElementById('info');
+  info.innerHTML =
+      'Hold on a second, while I catch those butterflies for you ...';
+
+  window.setTimeout(function() {
+    var features = [];
+    map.forEachFeatureAtPixel(evt.pixel, function(feature, layer) {
+      features.push(features);
+      return false;
+    });
+
+    if (features.length === 1) {
+      info.innerHTML = 'Got one butterfly';
+    } else if (features.length > 1) {
+      info.innerHTML = 'Got ' + features.length + ' butterflies';
+    } else {
+      info.innerHTML = 'Couldn\'t catch a single butterfly';
+    }
+  }, 1);
+});
+
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  var pixel = map.getEventPixel(evt.originalEvent);
+  var hit = map.hasFeatureAtPixel(pixel);
+  map.getTarget().style.cursor = hit ? 'pointer' : '';
+});

examples/icon.js

@@ -40,11 +40,13 @@ var vectorLayer = new ol.layer.Vector({
 
 var rasterLayer = new ol.layer.Tile({
   source: new ol.source.TileJSON({
-    url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp'
+    url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.jsonp',
+    crossOrigin: ''
   })
 });
 
 var map = new ol.Map({
+  renderer: exampleNS.getRendererFromQueryString(),
   layers: [rasterLayer, vectorLayer],
   target: document.getElementById('map'),
   view: new ol.View({
@@ -84,14 +86,12 @@ map.on('click', function(evt) {
 });
 
 // change mouse cursor when over marker
-$(map.getViewport()).on('mousemove', function(e) {
-  var pixel = map.getEventPixel(e.originalEvent);
-  var hit = map.forEachFeatureAtPixel(pixel, function(feature, layer) {
-    return true;
-  });
-  if (hit) {
-    map.getTarget().style.cursor = 'pointer';
-  } else {
-    map.getTarget().style.cursor = '';
+map.on('pointermove', function(e) {
+  if (e.dragging) {
+    $(element).popover('destroy');
+    return;
   }
+  var pixel = map.getEventPixel(e.originalEvent);
+  var hit = map.hasFeatureAtPixel(pixel);
+  map.getTarget().style.cursor = hit ? 'pointer' : '';
 });

examples/igc.js

@@ -73,7 +73,7 @@ var map = new ol.Map({
             html: 'All maps © ' +
                 '<a href="http://www.opencyclemap.org/">OpenCycleMap</a>'
           }),
-          ol.source.OSM.DATA_ATTRIBUTION
+          ol.source.OSM.ATTRIBUTION
         ],
         url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
       })
@@ -126,7 +126,10 @@ var displaySnap = function(coordinate) {
   map.render();
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var coordinate = map.getEventCoordinate(evt.originalEvent);
   displaySnap(coordinate);
 });

examples/image-vector-layer.js

@@ -80,7 +80,10 @@ var displayFeatureInfo = function(pixel) {
 
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });

examples/kml-earthquakes.js

@@ -85,7 +85,11 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    info.tooltip('hide');
+    return;
+  }
   displayFeatureInfo(map.getEventPixel(evt.originalEvent));
 });
 

examples/kml-timezones.js

@@ -92,7 +92,11 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    info.tooltip('hide');
+    return;
+  }
   displayFeatureInfo(map.getEventPixel(evt.originalEvent));
 });
 

examples/kml.js

@@ -52,7 +52,10 @@ var displayFeatureInfo = function(pixel) {
   }
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });
@@ -73,9 +76,7 @@ if ('download' in exportKMLElement) {
         clone.getGeometry().transform(projection, 'EPSG:4326');
         features.push(clone);
       });
-      var node = new ol.format.KML().writeFeatures(features);
-      var string = new XMLSerializer().serializeToString(
-          /** @type {Node} */ (node));
+      var string = new ol.format.KML().writeFeatures(features);
       var base64 = exampleNS.strToBase64(string);
       exportKMLElement.href =
           'data:application/vnd.google-earth.kml+xml;base64,' + base64;

examples/layer-extent.html

@@ -0,0 +1,68 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Limited Layer Extent</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Limited layer extent</h4>
+          <p id="shortdesc">Restricting layer rendering to a limited extent.</p>
+          <div id="docs">
+            <p>
+              This example uses the <code>layer.setExtent()</code> method to
+              modify the extent of the overlay layer.  Use the controls below
+              to limit rendering based on an extent.
+            </p>
+            <p>
+              <div class="btn-group">
+                <button type="button" class="btn btn-default" id="northwest">northwest</button>
+                <button type="button" class="btn btn-default" id="northeast">northeast</button>
+                <button type="button" class="btn btn-default" id="southeast">southeast</button>
+                <button type="button" class="btn btn-default" id="southwest">southwest</button>
+                <button type="button" class="btn btn-default" id="world">world</button>
+              </div>
+            </p>
+            <p>
+              See the <a href="layer-extent.js" target="_blank">layer-extent.js
+              source</a> for details on how this is done.
+            </p>
+          </div>
+          <div id="tags">extent, tilejson</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=layer-extent" type="text/javascript"></script>
+
+  </body>
+</html>

examples/layer-extent.js

@@ -0,0 +1,50 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.proj');
+goog.require('ol.source.TileJSON');
+
+function transform(extent) {
+  return ol.proj.transformExtent(extent, 'EPSG:4326', 'EPSG:3857');
+}
+
+var extents = {
+  northwest: transform([-180, 0, 0, 85]),
+  northeast: transform([0, 0, 180, 85]),
+  southeast: transform([0, -85, 180, 0]),
+  southwest: transform([-180, -85, 0, 0]),
+  world: transform([-180, -85, 180, 85])
+};
+
+var base = new ol.layer.Tile({
+  source: new ol.source.TileJSON({
+    url: 'http://api.tiles.mapbox.com/v3/' +
+        'mapbox.world-black.jsonp',
+    crossOrigin: 'anonymous'
+  })
+});
+
+var overlay = new ol.layer.Tile({
+  extent: extents.northwest,
+  source: new ol.source.TileJSON({
+    url: 'http://api.tiles.mapbox.com/v3/' +
+        'mapbox.world-glass.jsonp',
+    crossOrigin: 'anonymous'
+  })
+});
+
+var map = new ol.Map({
+  layers: [base, overlay],
+  renderer: exampleNS.getRendererFromQueryString(),
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 1
+  })
+});
+
+for (var key in extents) {
+  document.getElementById(key).onclick = function(event) {
+    overlay.setExtent(extents[event.target.id]);
+  };
+}

examples/lazy-source.html

@@ -0,0 +1,73 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Lazy Source</title>
+    <style>
+      button.code {
+        font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
+        font-size: 12px;
+        padding: 5px;
+        margin: 0 5px;
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Lazy source example</h4>
+          <p id="shortdesc">Example of setting a layer source after construction.</p>
+          <div id="docs">
+            <p>
+              Typically, the source for a layer is provided to the layer constructor.
+              If you need to set a layer source after construction, this can be
+              done with the <code>layer.setSource()</code> method.
+            </p>
+            <p>
+              The layer in the map above is constructed with no source.  Use the
+              links below to set/unset the layer source.  A layer is not rendered
+              until its source is set.
+            </p>
+            <p>
+              <button id="set-source" class="code">layer.setSource(source)</button>
+              <button id="unset-source" class="code">layer.setSource(null)</button>
+            </p>
+            <p>See the <a href="lazy-source.js" target="_blank">lazy-source.js source</a> for details on how this is done.</p>
+          </div>
+          <div id="tags">source</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=lazy-source" type="text/javascript"></script>
+
+  </body>
+</html>

examples/lazy-source.js

@@ -0,0 +1,26 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.MapQuest');
+
+var source = new ol.source.MapQuest({layer: 'sat'});
+
+var layer = new ol.layer.Tile();
+
+var map = new ol.Map({
+  layers: [layer],
+  renderer: exampleNS.getRendererFromQueryString(),
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 2
+  })
+});
+
+document.getElementById('set-source').onclick = function() {
+  layer.setSource(source);
+};
+
+document.getElementById('unset-source').onclick = function() {
+  layer.setSource(null);
+};

examples/localized-openstreetmap.js

@@ -16,7 +16,7 @@ var openCycleMapLayer = new ol.layer.Tile({
         html: 'All maps © ' +
             '<a href="http://www.opencyclemap.org/">OpenCycleMap</a>'
       }),
-      ol.source.OSM.DATA_ATTRIBUTION
+      ol.source.OSM.ATTRIBUTION
     ],
     url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
   })
@@ -29,7 +29,7 @@ var openSeaMapLayer = new ol.layer.Tile({
         html: 'All maps &copy; ' +
             '<a href="http://www.openseamap.org/">OpenSeaMap</a>'
       }),
-      ol.source.OSM.DATA_ATTRIBUTION
+      ol.source.OSM.ATTRIBUTION
     ],
     crossOrigin: null,
     url: 'http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png'

examples/measure.html

@@ -9,6 +9,40 @@
     <link rel="stylesheet" href="../resources/layout.css" type="text/css">
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
     <title>Measure example</title>
+    <style>
+      .tooltip {
+        position: relative;
+        background: rgba(0, 0, 0, 0.5);
+        border-radius: 4px;
+        color: white;
+        padding: 4px 8px;
+        opacity: 0.7;
+        white-space: nowrap;
+      }
+      .tooltip-measure {
+        opacity: 1;
+        font-weight: bold;
+      }
+      .tooltip-static {
+        background-color: #ffcc33;
+        color: black;
+        border: 1px solid white;
+      }
+      .tooltip-measure:before,
+      .tooltip-static:before {
+        border-top: 6px solid rgba(0, 0, 0, 0.5);
+        border-right: 6px solid transparent;
+        border-left: 6px solid transparent;
+        content: "";
+        position: absolute;
+        bottom: -6px;
+        margin-left: -7px;
+        left: 50%;
+      }
+      .tooltip-static:before {
+        border-top-color: #ffcc33;
+      }
+    </style>
   </head>
   <body>
 
@@ -41,12 +75,11 @@
                 <option value="length">Length</option>
                 <option value="area">Area</option>
               </select>
+              <label class="checkbox"><input type="checkbox" id="geodesic"/>use geodesic measures</label>
           </form>
 
-          <ol id="measureOutput" reversed></ol>
-
           <div id="docs">
-              <p><i>NOTE: Measure is done in simple way on projected plane. Earth
+              <p><i>NOTE: If use geodesic measures is not checked, measure is done in simple way on projected plane. Earth
               curvature is not taken into account</i></p>
             <p>See the <a href="measure.js" target="_blank">measure.js source</a> to see how this is done.</p>
           </div>

examples/measure.js

@@ -1,4 +1,6 @@
 goog.require('ol.Map');
+goog.require('ol.Overlay');
+goog.require('ol.Sphere');
 goog.require('ol.View');
 goog.require('ol.geom.LineString');
 goog.require('ol.geom.Polygon');
@@ -6,6 +8,7 @@ goog.require('ol.interaction');
 goog.require('ol.interaction.Draw');
 goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
+goog.require('ol.proj');
 goog.require('ol.source.MapQuest');
 goog.require('ol.source.Vector');
 goog.require('ol.style.Circle');
@@ -13,6 +16,9 @@ goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
+
+var wgs84Sphere = new ol.Sphere(6378137);
+
 var raster = new ol.layer.Tile({
   source: new ol.source.MapQuest({layer: 'sat'})
 });
@@ -40,35 +46,85 @@ var vector = new ol.layer.Vector({
 
 
 /**
- * Currently drawed feature
+ * Currently drawn feature.
  * @type {ol.Feature}
  */
 var sketch;
 
 
 /**
- * Element for currently drawed feature
+ * The help tooltip element.
  * @type {Element}
  */
-var sketchElement;
+var helpTooltipElement;
 
 
 /**
- * handle pointer move
- * @param {Event} evt
+ * Overlay to show the help messages.
+ * @type {ol.Overlay}
  */
-var mouseMoveHandler = function(evt) {
+var helpTooltip;
+
+
+/**
+ * The measure tooltip element.
+ * @type {Element}
+ */
+var measureTooltipElement;
+
+
+/**
+ * Overlay to show the measurement.
+ * @type {ol.Overlay}
+ */
+var measureTooltip;
+
+
+/**
+ * Message to show when the user is drawing a polygon.
+ * @type {string}
+ */
+var continuePolygonMsg = 'Click to continue drawing the polygon';
+
+
+/**
+ * Message to show when the user is drawing a line.
+ * @type {string}
+ */
+var continueLineMsg = 'Click to continue drawing the line';
+
+
+/**
+ * Handle pointer move.
+ * @param {ol.MapBrowserEvent} evt
+ */
+var pointerMoveHandler = function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  /** @type {string} */
+  var helpMsg = 'Click to start drawing';
+  /** @type {ol.Coordinate|undefined} */
+  var tooltipCoord = evt.coordinate;
+
   if (sketch) {
     var output;
     var geom = (sketch.getGeometry());
     if (geom instanceof ol.geom.Polygon) {
       output = formatArea(/** @type {ol.geom.Polygon} */ (geom));
-
+      helpMsg = continuePolygonMsg;
+      tooltipCoord = geom.getInteriorPoint().getCoordinates();
     } else if (geom instanceof ol.geom.LineString) {
       output = formatLength( /** @type {ol.geom.LineString} */ (geom));
+      helpMsg = continueLineMsg;
+      tooltipCoord = geom.getLastCoordinate();
     }
-    sketchElement.innerHTML = output;
+    measureTooltipElement.innerHTML = output;
+    measureTooltip.setPosition(tooltipCoord);
   }
+
+  helpTooltipElement.innerHTML = helpMsg;
+  helpTooltip.setPosition(evt.coordinate);
 };
 
 
@@ -81,42 +137,97 @@ var map = new ol.Map({
   })
 });
 
-$(map.getViewport()).on('mousemove', mouseMoveHandler);
+map.on('pointermove', pointerMoveHandler);
 
 var typeSelect = document.getElementById('type');
+var geodesicCheckbox = document.getElementById('geodesic');
 
 var draw; // global so we can remove it later
 function addInteraction() {
   var type = (typeSelect.value == 'area' ? 'Polygon' : 'LineString');
   draw = new ol.interaction.Draw({
     source: source,
-    type: /** @type {ol.geom.GeometryType} */ (type)
+    type: /** @type {ol.geom.GeometryType} */ (type),
+    style: new ol.style.Style({
+      fill: new ol.style.Fill({
+        color: 'rgba(255, 255, 255, 0.2)'
+      }),
+      stroke: new ol.style.Stroke({
+        color: 'rgba(0, 0, 0, 0.5)',
+        lineDash: [10, 10],
+        width: 2
+      }),
+      image: new ol.style.Circle({
+        radius: 5,
+        stroke: new ol.style.Stroke({
+          color: 'rgba(0, 0, 0, 0.7)'
+        }),
+        fill: new ol.style.Fill({
+          color: 'rgba(255, 255, 255, 0.2)'
+        })
+      })
+    })
   });
   map.addInteraction(draw);
 
+  createMeasureTooltip();
+  createHelpTooltip();
+
   draw.on('drawstart',
       function(evt) {
         // set sketch
         sketch = evt.feature;
-        sketchElement = document.createElement('li');
-        var outputList = document.getElementById('measureOutput');
-
-        if (outputList.childNodes) {
-          outputList.insertBefore(sketchElement, outputList.firstChild);
-        } else {
-          outputList.appendChild(sketchElement);
-        }
       }, this);
 
   draw.on('drawend',
       function(evt) {
+        measureTooltipElement.className = 'tooltip tooltip-static';
+        measureTooltip.setOffset([0, -7]);
         // unset sketch
         sketch = null;
-        sketchElement = null;
+        // unset tooltip so that a new one can be created
+        measureTooltipElement = null;
+        createMeasureTooltip();
       }, this);
 }
 
 
+/**
+ * Creates a new help tooltip
+ */
+function createHelpTooltip() {
+  if (helpTooltipElement) {
+    helpTooltipElement.parentNode.removeChild(helpTooltipElement);
+  }
+  helpTooltipElement = document.createElement('div');
+  helpTooltipElement.className = 'tooltip';
+  helpTooltip = new ol.Overlay({
+    element: helpTooltipElement,
+    offset: [15, 0],
+    positioning: 'center-left'
+  });
+  map.addOverlay(helpTooltip);
+}
+
+
+/**
+ * Creates a new measure tooltip
+ */
+function createMeasureTooltip() {
+  if (measureTooltipElement) {
+    measureTooltipElement.parentNode.removeChild(measureTooltipElement);
+  }
+  measureTooltipElement = document.createElement('div');
+  measureTooltipElement.className = 'tooltip tooltip-measure';
+  measureTooltip = new ol.Overlay({
+    element: measureTooltipElement,
+    offset: [0, -15],
+    positioning: 'bottom-center'
+  });
+  map.addOverlay(measureTooltip);
+}
+
+
 /**
  * Let user change the geometry type.
  * @param {Event} e Change event.
@@ -133,7 +244,19 @@ typeSelect.onchange = function(e) {
  * @return {string}
  */
 var formatLength = function(line) {
-  var length = Math.round(line.getLength() * 100) / 100;
+  var length;
+  if (geodesicCheckbox.checked) {
+    var coordinates = line.getCoordinates();
+    length = 0;
+    var sourceProj = map.getView().getProjection();
+    for (var i = 0, ii = coordinates.length - 1; i < ii; ++i) {
+      var c1 = ol.proj.transform(coordinates[i], sourceProj, 'EPSG:4326');
+      var c2 = ol.proj.transform(coordinates[i + 1], sourceProj, 'EPSG:4326');
+      length += wgs84Sphere.haversineDistance(c1, c2);
+    }
+  } else {
+    length = Math.round(line.getLength() * 100) / 100;
+  }
   var output;
   if (length > 100) {
     output = (Math.round(length / 1000 * 100) / 100) +
@@ -152,7 +275,16 @@ var formatLength = function(line) {
  * @return {string}
  */
 var formatArea = function(polygon) {
-  var area = polygon.getArea();
+  var area;
+  if (geodesicCheckbox.checked) {
+    var sourceProj = map.getView().getProjection();
+    var geom = /** @type {ol.geom.Polygon} */(polygon.clone().transform(
+        sourceProj, 'EPSG:4326'));
+    var coordinates = geom.getLinearRing(0).getCoordinates();
+    area = Math.abs(wgs84Sphere.geodesicArea(coordinates));
+  } else {
+    area = polygon.getArea();
+  }
   var output;
   if (area > 10000) {
     output = (Math.round(area / 1000000 * 100) / 100) +

examples/mobile-full-screen.html

@@ -18,6 +18,7 @@
     <div id="map" class="map"></div>
     <script src="../resources/jquery.min.js" type="text/javascript"></script>
     <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="http://cdnjs.cloudflare.com/ajax/libs/fastclick/1.0.3/fastclick.js" type="text/javascript"></script>
     <script src="loader.js?id=mobile-full-screen" type="text/javascript"></script>
 
     <div style="display: none;">

examples/mobile-full-screen.js

@@ -32,3 +32,11 @@ geolocation.once('change:position', function() {
   view.setCenter(geolocation.getPosition());
   view.setResolution(2.388657133911758);
 });
+
+// Use FastClick to eliminate the 300ms delay between a physical tap
+// and the firing of a click event on mobile browsers.
+// See http://updates.html5rocks.com/2013/12/300ms-tap-delay-gone-away
+// for more information.
+$(function() {
+  FastClick.attach(document.body);
+});

examples/polygon-styles.html

@@ -0,0 +1,57 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Custom styles for polygons</title>
+    <style>
+      .map {
+        background: grey;
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Custom styles for polygons</h4>
+          <p id="shortdesc">Showing the vertices of a polygon with a custom style geometry.</p>
+          <div id="docs">
+            <p>See the <a href="polygon-styles.js" target="_blank">polygon-styles.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">polygon, vector, style, GeometryFunction</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="loader.js?id=polygon-styles" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+
+  </body>
+</html>

examples/polygon-styles.js

@@ -0,0 +1,101 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.MultiPoint');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.GeoJSON');
+goog.require('ol.style.Circle');
+goog.require('ol.style.Fill');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+
+var styles = [
+  /* We are using two different styles for the polygons:
+   *  - The first style is for the polygons themselves.
+   *  - The second style is to draw the vertices of the polygons.
+   *    In a custom `geometry` function the vertices of a polygon are
+   *    returned as `MultiPoint` geometry, which will be used to render
+   *    the style.
+   */
+  new ol.style.Style({
+    stroke: new ol.style.Stroke({
+      color: 'blue',
+      width: 3
+    }),
+    fill: new ol.style.Fill({
+      color: 'rgba(0, 0, 255, 0.1)'
+    })
+  }),
+  new ol.style.Style({
+    image: new ol.style.Circle({
+      radius: 5,
+      fill: new ol.style.Fill({
+        color: 'orange'
+      })
+    }),
+    geometry: function(feature) {
+      // return the coordinates of the first ring of the polygon
+      var coordinates = feature.getGeometry().getCoordinates()[0];
+      return new ol.geom.MultiPoint(coordinates);
+    }
+  })
+];
+
+var source = new ol.source.GeoJSON(/** @type {olx.source.GeoJSONOptions} */ ({
+  object: {
+    'type': 'FeatureCollection',
+    'crs': {
+      'type': 'name',
+      'properties': {
+        'name': 'EPSG:3857'
+      }
+    },
+    'features': [
+      {
+        'type': 'Feature',
+        'geometry': {
+          'type': 'Polygon',
+          'coordinates': [[[-5e6, 6e6], [-5e6, 8e6], [-3e6, 8e6],
+              [-3e6, 6e6], [-5e6, 6e6]]]
+        }
+      },
+      {
+        'type': 'Feature',
+        'geometry': {
+          'type': 'Polygon',
+          'coordinates': [[[-2e6, 6e6], [-2e6, 8e6], [0, 8e6],
+              [0, 6e6], [-2e6, 6e6]]]
+        }
+      },
+      {
+        'type': 'Feature',
+        'geometry': {
+          'type': 'Polygon',
+          'coordinates': [[[1e6, 6e6], [1e6, 8e6], [3e6, 8e6],
+              [3e6, 6e6], [1e6, 6e6]]]
+        }
+      },
+      {
+        'type': 'Feature',
+        'geometry': {
+          'type': 'Polygon',
+          'coordinates': [[[-2e6, -1e6], [-1e6, 1e6],
+              [0, -1e6], [-2e6, -1e6]]]
+        }
+      }
+    ]
+  }
+}));
+
+var layer = new ol.layer.Vector({
+  source: source,
+  style: styles
+});
+
+var map = new ol.Map({
+  layers: [layer],
+  target: 'map',
+  view: new ol.View({
+    center: [0, 1000000],
+    zoom: 2
+  })
+});

examples/popup.html

@@ -10,10 +10,8 @@
     <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
     <style type="text/css">
       .ol-popup {
-        display: none;
         position: absolute;
         background-color: white;
-        -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.2);
         -webkit-filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
         filter: drop-shadow(0 1px 4px rgba(0,0,0,0.2));
         padding: 15px;

examples/popup.js

@@ -20,7 +20,7 @@ var closer = document.getElementById('popup-closer');
  * @return {boolean} Don't follow the href.
  */
 closer.onclick = function() {
-  container.style.display = 'none';
+  overlay.setPosition(undefined);
   closer.blur();
   return false;
 };
@@ -29,9 +29,13 @@ closer.onclick = function() {
 /**
  * Create an overlay to anchor the popup to the map.
  */
-var overlay = new ol.Overlay({
-  element: container
-});
+var overlay = new ol.Overlay(/** @type {olx.OverlayOptions} */ ({
+  element: container,
+  autoPan: true,
+  autoPanAnimation: {
+    duration: 250
+  }
+}));
 
 
 /**
@@ -60,14 +64,12 @@ var map = new ol.Map({
 /**
  * Add a click handler to the map to render the popup.
  */
-map.on('click', function(evt) {
+map.on('singleclick', function(evt) {
   var coordinate = evt.coordinate;
   var hdms = ol.coordinate.toStringHDMS(ol.proj.transform(
       coordinate, 'EPSG:3857', 'EPSG:4326'));
 
-  overlay.setPosition(coordinate);
   content.innerHTML = '<p>You clicked here:</p><code>' + hdms +
       '</code>';
-  container.style.display = 'block';
-
+  overlay.setPosition(coordinate);
 });

examples/regularshape.html

@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Regular Shape example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Regular Shape example</h4>
+          <p id="shortdesc">Example of some Regular Shape styles.</p>
+          <div id="docs">
+            <p>See the <a href="regularshape.js" target="_blank">regularshape.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">vector, symbol, regularshape, style, square, cross, star, triangle, x</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=regularshape" type="text/javascript"></script>
+
+  </body>
+</html>

examples/regularshape.js

@@ -0,0 +1,101 @@
+goog.require('ol.Feature');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.Point');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.Vector');
+goog.require('ol.style.Fill');
+goog.require('ol.style.RegularShape');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+
+
+var stroke = new ol.style.Stroke({color: 'black', width: 2});
+var fill = new ol.style.Fill({color: 'red'});
+
+var styles = {
+  'square': [new ol.style.Style({
+    image: new ol.style.RegularShape(
+        /** @type {olx.style.RegularShapeOptions} */({
+          fill: fill,
+          stroke: stroke,
+          points: 4,
+          radius: 10,
+          angle: Math.PI / 4
+        }))
+  })],
+  'triangle': [new ol.style.Style({
+    image: new ol.style.RegularShape(
+        /** @type {olx.style.RegularShapeOptions} */({
+          fill: fill,
+          stroke: stroke,
+          points: 3,
+          radius: 10,
+          rotation: Math.PI / 4,
+          angle: 0
+        }))
+  })],
+  'star': [new ol.style.Style({
+    image: new ol.style.RegularShape(
+        /** @type {olx.style.RegularShapeOptions} */({
+          fill: fill,
+          stroke: stroke,
+          points: 5,
+          radius: 10,
+          radius2: 4,
+          angle: 0
+        }))
+  })],
+  'cross': [new ol.style.Style({
+    image: new ol.style.RegularShape(
+        /** @type {olx.style.RegularShapeOptions} */({
+          fill: fill,
+          stroke: stroke,
+          points: 4,
+          radius: 10,
+          radius2: 0,
+          angle: 0
+        }))
+  })],
+  'x': [new ol.style.Style({
+    image: new ol.style.RegularShape(
+        /** @type {olx.style.RegularShapeOptions} */({
+          fill: fill,
+          stroke: stroke,
+          points: 4,
+          radius: 10,
+          radius2: 0,
+          angle: Math.PI / 4
+        }))
+  })]
+};
+
+
+var styleKeys = ['x', 'cross', 'star', 'triangle', 'square'];
+var count = 250;
+var features = new Array(count);
+var e = 4500000;
+for (var i = 0; i < count; ++i) {
+  var coordinates = [2 * e * Math.random() - e, 2 * e * Math.random() - e];
+  features[i] = new ol.Feature(new ol.geom.Point(coordinates));
+  features[i].setStyle(styles[styleKeys[Math.floor(Math.random() * 5)]]);
+}
+
+var source = new ol.source.Vector({
+  features: features
+});
+
+var vectorLayer = new ol.layer.Vector({
+  source: source
+});
+
+var map = new ol.Map({
+  layers: [
+    vectorLayer
+  ],
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 2
+  })
+});

examples/select-features.html

@@ -35,14 +35,16 @@
           <h4 id="title">Select features example</h4>
           <p id="shortdesc">Example of using the Select interaction. Choose between <code>Single-click</code>, <code>Click</code> and <code>Hover</code> as the event type for selection in the combobox below. When using <code>Single-click</code> or <code>Click</code> you can hold do <code>Shift</code> key to toggle the feature in the selection.</p>
           <p>Note: when <code>Single-click</code> is used double-clicks won't select features. This in contrast to <code>Click</code>, where a double-click will both select the feature and zoom the map (because of the <code>DoubleClickZoom</code> interaction). Note that <code>Single-click</code> is less responsive than <code>Click</code> because of the delay it uses to detect double-clicks.</p>
+          <p>In this example, a listener is registered for the Select interaction's <code>select</code> event in order to update the selection status below.
           <form class="form-inline">
             <label>Action type &nbsp;</label>
               <select id="type">
                 <option value="none" selected>None</option>
                 <option value="singleclick">Single-click</option>
                 <option value="click">Click</option>
-                <option value="mousemove">Hover</option>
+                <option value="pointermove">Hover</option>
               </select>
+              <span id="status">&nbsp;0 selected features</span>
           </form>
           <div id="docs">
             <p>See the <a href="select-features.js" target="_blank">select-features.js source</a> to see how this is done.</p>

examples/select-features.js

@@ -38,9 +38,9 @@ var selectClick = new ol.interaction.Select({
   condition: ol.events.condition.click
 });
 
-// select interaction working on "mousemove"
-var selectMouseMove = new ol.interaction.Select({
-  condition: ol.events.condition.mouseMove
+// select interaction working on "pointermove"
+var selectPointerMove = new ol.interaction.Select({
+  condition: ol.events.condition.pointerMove
 });
 
 var selectElement = document.getElementById('type');
@@ -54,13 +54,18 @@ var changeInteraction = function() {
     select = selectSingleClick;
   } else if (value == 'click') {
     select = selectClick;
-  } else if (value == 'mousemove') {
-    select = selectMouseMove;
+  } else if (value == 'pointermove') {
+    select = selectPointerMove;
   } else {
     select = null;
   }
   if (select !== null) {
     map.addInteraction(select);
+    select.on('select', function(e) {
+      $('#status').html(' ' + e.target.getFeatures().getLength() +
+          ' selected features (last operation selected ' + e.selected.length +
+          ' and deselected ' + e.deselected.length + ' features)');
+    });
   }
 };
 

examples/symbol-atlas-webgl.html

@@ -0,0 +1,58 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Symbols with WebGL example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Symbols with WebGL example</h4>
+          <p id="shortdesc">Using symbols in an atlas with WebGL.</p>
+          <div id="docs">
+            <p>When using symbol styles with WebGL, OpenLayers would render the symbol
+            on a temporary image and would create a WebGL texture for each image. For a
+            better performance, it is recommended to use atlas images (similar to
+            image sprites with CSS), so that the number of textures is reduced. OpenLayers
+            provides an <code>AtlasManager</code>, which when passed to the constructor
+            of a symbol style, will create atlases for the symbols.</p>
+            <p>See the <a href="symbol-atlas-webgl.js" target="_blank">symbol-atlas-webgl.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">webgl, symbol, atlas, vector, point</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=symbol-atlas-webgl" type="text/javascript"></script>
+
+  </body>
+</html>

examples/symbol-atlas-webgl.js

@@ -0,0 +1,123 @@
+goog.require('ol.Feature');
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.Point');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.Vector');
+goog.require('ol.style.AtlasManager');
+goog.require('ol.style.Circle');
+goog.require('ol.style.Fill');
+goog.require('ol.style.RegularShape');
+goog.require('ol.style.Stroke');
+goog.require('ol.style.Style');
+
+var atlasManager = new ol.style.AtlasManager({
+  // we increase the initial size so that all symbols fit into
+  // a single atlas image
+  initialSize: 512
+});
+
+var symbolInfo = [{
+  opacity: 1.0,
+  scale: 1.0,
+  fillColor: 'rgba(255, 153, 0, 0.4)',
+  strokeColor: 'rgba(255, 204, 0, 0.2)'
+}, {
+  opacity: 0.75,
+  scale: 1.25,
+  fillColor: 'rgba(70, 80, 224, 0.4)',
+  strokeColor: 'rgba(12, 21, 138, 0.2)'
+}, {
+  opacity: 0.5,
+  scale: 1.5,
+  fillColor: 'rgba(66, 150, 79, 0.4)',
+  strokeColor: 'rgba(20, 99, 32, 0.2)'
+}, {
+  opacity: 1.0,
+  scale: 1.0,
+  fillColor: 'rgba(176, 61, 35, 0.4)',
+  strokeColor: 'rgba(145, 43, 20, 0.2)'
+}];
+
+var radiuses = [3, 6, 9, 15, 19, 25];
+var symbolCount = symbolInfo.length * radiuses.length * 2;
+var symbols = [];
+var i, j;
+for (i = 0; i < symbolInfo.length; ++i) {
+  var info = symbolInfo[i];
+  for (j = 0; j < radiuses.length; ++j) {
+    // circle symbol
+    symbols.push(new ol.style.Circle({
+      opacity: info.opacity,
+      scale: info.scale,
+      radius: radiuses[j],
+      fill: new ol.style.Fill({
+        color: info.fillColor
+      }),
+      stroke: new ol.style.Stroke({
+        color: info.strokeColor,
+        width: 1
+      }),
+      // by passing the atlas manager to the symbol,
+      // the symbol will be added to an atlas
+      atlasManager: atlasManager
+    }));
+
+    // star symbol
+    symbols.push(new ol.style.RegularShape({
+      points: 8,
+      opacity: info.opacity,
+      scale: info.scale,
+      radius: radiuses[j],
+      radius2: radiuses[j] * 0.7,
+      angle: 1.4,
+      fill: new ol.style.Fill({
+        color: info.fillColor
+      }),
+      stroke: new ol.style.Stroke({
+        color: info.strokeColor,
+        width: 1
+      }),
+      atlasManager: atlasManager
+    }));
+  }
+}
+
+var featureCount = 50000;
+var features = new Array(featureCount);
+var feature, geometry;
+var e = 25000000;
+for (i = 0; i < featureCount; ++i) {
+  geometry = new ol.geom.Point(
+      [2 * e * Math.random() - e, 2 * e * Math.random() - e]);
+  feature = new ol.Feature(geometry);
+  feature.setStyle(
+      new ol.style.Style({
+        image: symbols[i % symbolCount]
+      })
+  );
+  features[i] = feature;
+}
+
+var vectorSource = new ol.source.Vector({
+  features: features
+});
+var vector = new ol.layer.Vector({
+  source: vectorSource
+});
+
+// Use the "webgl" renderer by default.
+var renderer = exampleNS.getRendererFromQueryString();
+if (!renderer) {
+  renderer = 'webgl';
+}
+
+var map = new ol.Map({
+  renderer: renderer,
+  layers: [vector],
+  target: document.getElementById('map'),
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 4
+  })
+});

examples/synthetic-points.js

@@ -83,7 +83,10 @@ var displaySnap = function(coordinate) {
   map.render();
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var coordinate = map.getEventCoordinate(evt.originalEvent);
   displaySnap(coordinate);
 });
@@ -116,13 +119,12 @@ map.on('postcompose', function(evt) {
   }
 });
 
-$(map.getViewport()).on('mousemove', function(e) {
-  var pixel = map.getEventPixel(e.originalEvent);
-
-  var hit = map.forEachFeatureAtPixel(pixel, function(feature, layer) {
-    return true;
-  });
-
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  var pixel = map.getEventPixel(evt.originalEvent);
+  var hit = map.hasFeatureAtPixel(pixel);
   if (hit) {
     map.getTarget().style.cursor = 'pointer';
   } else {

examples/tile-load-events.html

@@ -0,0 +1,79 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>Tile load events example</title>
+    <style>
+      .map {
+        background: #E0ECED;
+      }
+      .wrapper {
+        position: relative;
+      }
+      #progress {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        height: 2px;
+        background: rgba(0, 60, 136, 0.4);
+        width: 0;
+        transition: width 250ms;
+      }
+    </style>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12 wrapper">
+          <div id="map" class="map"></div>
+          <div id="progress"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">Tile load events example</h4>
+          <p id="shortdesc">Example using tile load events.</p>
+          <div id="docs">
+            <p>
+              Image tile sources fire events related to tile loading.  You can
+              listen for <code>tileloadstart</code>, <code>tileloadend</code>,
+              and <code>tileloaderror</code> type events to monitor tile loading
+              progress.  This example registers listeners for these events and
+              renders a tile loading progress bar at the bottom of the map.
+            </p>
+            <p>
+              See the <a href="tile-load-events.js" target="_blank">tile-load-events.js source</a>
+              for more detail on how this is done.
+            </p>
+          </div>
+          <div id="tags">tile, events, loading</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=tile-load-events" type="text/javascript"></script>
+
+  </body>
+</html>

examples/tile-load-events.js

@@ -0,0 +1,104 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.TileJSON');
+
+
+
+/**
+ * Renders a progress bar.
+ * @param {Element} el The target element.
+ * @constructor
+ */
+function Progress(el) {
+  this.el = el;
+  this.loading = 0;
+  this.loaded = 0;
+}
+
+
+/**
+ * Increment the count of loading tiles.
+ */
+Progress.prototype.addLoading = function() {
+  if (this.loading === 0) {
+    this.show();
+  }
+  ++this.loading;
+  this.update();
+};
+
+
+/**
+ * Increment the count of loaded tiles.
+ */
+Progress.prototype.addLoaded = function() {
+  setTimeout(function() {
+    ++this.loaded;
+    this.update();
+  }.bind(this), 100);
+};
+
+
+/**
+ * Update the progress bar.
+ */
+Progress.prototype.update = function() {
+  var width = (this.loaded / this.loading * 100).toFixed(1) + '%';
+  this.el.style.width = width;
+  if (this.loading === this.loaded) {
+    this.loading = 0;
+    this.loaded = 0;
+    setTimeout(this.hide.bind(this), 500);
+  }
+};
+
+
+/**
+ * Show the progress bar.
+ */
+Progress.prototype.show = function() {
+  this.el.style.visibility = 'visible';
+};
+
+
+/**
+ * Hide the progress bar.
+ */
+Progress.prototype.hide = function() {
+  if (this.loading === this.loaded) {
+    this.el.style.visibility = 'hidden';
+    this.el.style.width = 0;
+  }
+};
+
+var progress = new Progress(document.getElementById('progress'));
+
+var source = new ol.source.TileJSON({
+  url: 'http://api.tiles.mapbox.com/v3/mapbox.world-bright.jsonp',
+  crossOrigin: 'anonymous'
+});
+
+source.on('tileloadstart', function(event) {
+  progress.addLoading();
+});
+
+source.on('tileloadend', function(event) {
+  progress.addLoaded();
+});
+source.on('tileloaderror', function(event) {
+  progress.addLoaded();
+});
+
+var map = new ol.Map({
+  logo: false,
+  layers: [
+    new ol.layer.Tile({source: source})
+  ],
+  renderer: exampleNS.getRendererFromQueryString(),
+  target: 'map',
+  view: new ol.View({
+    center: [0, 0],
+    zoom: 2
+  })
+});

examples/tileutfgrid.html

@@ -0,0 +1,69 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <style type="text/css">
+      #country-name {
+        color: black;
+        font-size: 12pt;
+        font-weight: bold;
+        text-shadow: white 0.1em 0.1em 0.2em;
+      }
+    </style>
+    <title>TileUTFGrid example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">TileUTFGrid example</h4>
+          <p id="shortdesc">This example shows how to read data from a TileUTFGrid layer.</p>
+          <p>Point to a country to see its name and flag.</p>
+          <div id="docs">
+            <p>Tiles made with <a href="http://tilemill.com/">TileMill</a>. Hosting on MapBox.com or with open-source <a href="https://github.com/klokantech/tileserver-php/">TileServer</a>.</p>
+            <p>See the <a href="tileutfgrid.js" target="_blank">tileutfgrid.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">utfgrid, tileutfgrid, tilejson</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <div style="display: none;">
+      <!-- Overlay with the country info -->
+      <div id="country-info">
+        <div id="country-name">&nbsp;</div>
+        <img id="country-flag" src="" />
+      </div>
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=tileutfgrid" type="text/javascript"></script>
+
+  </body>
+</html>

examples/tileutfgrid.js

@@ -0,0 +1,71 @@
+goog.require('ol.Map');
+goog.require('ol.Overlay');
+goog.require('ol.View');
+goog.require('ol.layer.Tile');
+goog.require('ol.source.TileJSON');
+goog.require('ol.source.TileUTFGrid');
+
+var mapLayer = new ol.layer.Tile({
+  source: new ol.source.TileJSON({
+    url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.json'
+  })
+});
+
+var gridSource = new ol.source.TileUTFGrid({
+  url: 'http://api.tiles.mapbox.com/v3/mapbox.geography-class.json'
+});
+
+var gridLayer = new ol.layer.Tile({source: gridSource});
+
+var view = new ol.View({
+  center: [0, 0],
+  zoom: 1
+});
+
+var mapElement = document.getElementById('map');
+var map = new ol.Map({
+  layers: [mapLayer, gridLayer],
+  target: mapElement,
+  view: view
+});
+
+var infoElement = document.getElementById('country-info');
+var flagElement = document.getElementById('country-flag');
+var nameElement = document.getElementById('country-name');
+
+var infoOverlay = new ol.Overlay({
+  element: infoElement,
+  offset: [15, 15],
+  stopEvent: false
+});
+map.addOverlay(infoOverlay);
+
+var displayCountryInfo = function(coordinate) {
+  var viewResolution = /** @type {number} */ (view.getResolution());
+  gridSource.forDataAtCoordinateAndResolution(coordinate, viewResolution,
+      function(data) {
+        // If you want to use the template from the TileJSON,
+        //  load the mustache.js library separately and call
+        //  info.innerHTML = Mustache.render(gridSource.getTemplate(), data);
+        mapElement.style.cursor = data ? 'pointer' : '';
+        if (data) {
+          /* jshint -W069 */
+          flagElement.src = 'data:image/png;base64,' + data['flag_png'];
+          nameElement.innerHTML = data['admin'];
+          /* jshint +W069 */
+        }
+        infoOverlay.setPosition(data ? coordinate : undefined);
+      });
+};
+
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
+  var coordinate = map.getEventCoordinate(evt.originalEvent);
+  displayCountryInfo(coordinate);
+});
+
+map.on('click', function(evt) {
+  displayCountryInfo(evt.coordinate);
+});

examples/tissot.js

@@ -20,7 +20,7 @@ var map4326 = new ol.Map({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.TileWMS({
-        url: 'http://demo.opengeo.org/geoserver/wms',
+        url: 'http://demo.boundlessgeo.com/geoserver/wms',
         params: {
           'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
         }
@@ -41,7 +41,7 @@ var map3857 = new ol.Map({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.TileWMS({
-        url: 'http://demo.opengeo.org/geoserver/wms',
+        url: 'http://demo.boundlessgeo.com/geoserver/wms',
         params: {
           'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
         }

examples/vector-labels.html

@@ -12,7 +12,7 @@
       h2 {
         font-size: 1.5em;
         line-height: 15px;
-      };
+      }
 
       .scale-cnt {
         margin: 5px;

examples/vector-layer.js

@@ -114,7 +114,10 @@ var displayFeatureInfo = function(pixel) {
 
 };
 
-$(map.getViewport()).on('mousemove', function(evt) {
+map.on('pointermove', function(evt) {
+  if (evt.dragging) {
+    return;
+  }
   var pixel = map.getEventPixel(evt.originalEvent);
   displayFeatureInfo(pixel);
 });

examples/vector-wfs.js

@@ -13,7 +13,7 @@ goog.require('ol.tilegrid.XYZ');
 var vectorSource = new ol.source.ServerVector({
   format: new ol.format.GeoJSON(),
   loader: function(extent, resolution, projection) {
-    var url = 'http://demo.opengeo.org/geoserver/wfs?service=WFS&' +
+    var url = 'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&' +
         'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
         'outputFormat=text/javascript&format_options=callback:loadFeatures' +
         '&srsname=EPSG:3857&bbox=' + extent.join(',') + ',EPSG:3857';

examples/wms-image.js

@@ -13,7 +13,7 @@ var layers = [
   new ol.layer.Image({
     extent: [-13884991, 2870341, -7455066, 6338219],
     source: new ol.source.ImageWMS({
-      url: 'http://demo.opengeo.org/geoserver/wms',
+      url: 'http://demo.boundlessgeo.com/geoserver/wms',
       params: {'LAYERS': 'topp:states'},
       serverType: 'geoserver'
     })

examples/wms-tiled.js

@@ -12,7 +12,7 @@ var layers = [
   new ol.layer.Tile({
     extent: [-13884991, 2870341, -7455066, 6338219],
     source: new ol.source.TileWMS(/** @type {olx.source.TileWMSOptions} */ ({
-      url: 'http://demo.opengeo.org/geoserver/wms',
+      url: 'http://demo.boundlessgeo.com/geoserver/wms',
       params: {'LAYERS': 'topp:states', 'TILED': true},
       serverType: 'geoserver'
     }))

examples/wmts-capabilities.html

@@ -0,0 +1,49 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>WMTS GetCapabilities parsing example</title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+
+        <div class="span4">
+          <h4 id="title">WMTS GetCapabilities parsing example</h4>
+          <p id="shortdesc">Example of parsing a WMTS GetCapabilities response.</p>
+          <div id="docs">
+            <p>See the <a href="wmts-capabilities.js" target="_blank">wmts-capabilities.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">wmts, capabilities, getcapabilities</div>
+        </div>
+
+        <div class="span8">
+          <pre id="log"></pre>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=wmts-capabilities" type="text/javascript"></script>
+
+  </body>
+</html>

examples/wmts-capabilities.js

@@ -0,0 +1,8 @@
+goog.require('ol.format.WMTSCapabilities');
+
+var parser = new ol.format.WMTSCapabilities();
+
+$.ajax('data/WMTSCapabilities.xml').then(function(response) {
+  var result = parser.read(response);
+  $('#log').html(window.JSON.stringify(result, null, 2));
+});

examples/wmts-hidpi.js

@@ -29,7 +29,7 @@ var source = new ol.source.WMTS({
   style: 'normal',
   matrixSet: 'google3857',
   urls: urls,
-  requestEncoding: /** @type {ol.source.WMTSRequestEncoding} */ ('REST'),
+  requestEncoding: 'REST',
   tileGrid: new ol.tilegrid.WMTS({
     origin: [-20037508.3428, 20037508.3428],
     resolutions: [

examples/wmts-layer-from-capabilities.html

@@ -0,0 +1,51 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="chrome=1">
+    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
+    <link rel="stylesheet" href="../css/ol.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap.min.css" type="text/css">
+    <link rel="stylesheet" href="../resources/layout.css" type="text/css">
+    <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
+    <title>WMTS Layer example from capabilities </title>
+  </head>
+  <body>
+
+    <div class="navbar navbar-inverse navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container">
+          <a class="brand" href="./"><img src="../resources/logo.png"> OpenLayers 3 Examples</a>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+
+      <div class="row-fluid">
+        <div class="span12">
+          <div id="map" class="map"></div>
+        </div>
+      </div>
+
+      <div class="row-fluid">
+
+        <div class="span12">
+          <h4 id="title">WMTS Capabilities example</h4>
+          <p id="shortdesc">Example of a WMTS source created from a WMTS capabilities document.</p>
+          <div id="docs">
+            <p>See the <a href="wmts-layer-from-capabilities.js" target="_blank">wmts-layer-from-capabilities.js source</a> to see how this is done.</p>
+          </div>
+          <div id="tags">wmts, capabilities, getcapabilities</div>
+        </div>
+
+      </div>
+
+    </div>
+
+    <script src="../resources/jquery.min.js" type="text/javascript"></script>
+    <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+    <script src="loader.js?id=wmts-layer-from-capabilities" type="text/javascript"></script>
+
+  </body>
+</html>

examples/wmts-layer-from-capabilities.js

@@ -0,0 +1,37 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.format.WMTSCapabilities');
+goog.require('ol.layer.Tile');
+goog.require('ol.proj');
+goog.require('ol.source.OSM');
+goog.require('ol.source.WMTS');
+
+var parser = new ol.format.WMTSCapabilities();
+var map;
+
+$.ajax('data/WMTSCapabilities.xml').then(function(response) {
+  var result = parser.read(response);
+  var options = ol.source.WMTS.optionsFromCapabilities(result,
+      {layer: 'layer-7328', matrixSet: 'EPSG:3857'});
+
+  var projection = ol.proj.get('EPSG:3857');
+  var projectionExtent = projection.getExtent();
+  map = new ol.Map({
+    layers: [
+      new ol.layer.Tile({
+        source: new ol.source.OSM(),
+        opacity: 0.7
+      }),
+      new ol.layer.Tile({
+        opacity: 1,
+        extent: projectionExtent,
+        source: new ol.source.WMTS(options)
+      })
+    ],
+    target: 'map',
+    view: new ol.View({
+      center: [19412406.33, -5050500.21],
+      zoom: 5
+    })
+  });
+});

examples/xyz.js

@@ -27,7 +27,7 @@ var map = new ol.Map({
             html: 'Tiles &copy; <a href="http://www.opencyclemap.org/">' +
                 'OpenCycleMap</a>'
           }),
-          ol.source.OSM.DATA_ATTRIBUTION
+          ol.source.OSM.ATTRIBUTION
         ],
         url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
       })

examples/zoomify.js

@@ -45,6 +45,9 @@ var map = new ol.Map({
   view: new ol.View({
     projection: proj,
     center: imgCenter,
-    zoom: 0
+    zoom: 0,
+    // constrain the center: center cannot be set outside
+    // this extent
+    extent: [0, -imgHeight, imgWidth, 0]
   })
 });

externs/fastclick.js

@@ -0,0 +1,25 @@
+/**
+ * @fileoverview Externs for FastClick 1.0.3
+ * @see https://github.com/ftlabs/fastclick
+ * @externs
+ */
+
+/**
+ * @type {Object}
+ * @const
+ */
+var FastClick = {};
+
+/**
+ * @typedef {{
+ *   touchBoundary: (number|undefined),
+ *   tapDelay: (number|undefined)
+ * }}
+ */
+FastClick.AttachOptions;
+
+/**
+ * @param {Element} layer
+ * @param {FastClick.AttachOptions=} opt_options
+ */
+FastClick.attach = function(layer, opt_options) {};

externs/geojson.js

@@ -13,6 +13,12 @@
 var GeoJSONObject = function() {};
 
 
+/**
+ * @type {!Array.<number>|undefined}
+ */
+GeoJSONObject.prototype.bbox;
+
+
 /**
  * @type {string}
  */
@@ -28,15 +34,21 @@ GeoJSONObject.prototype.crs;
 
 /**
  * @constructor
- * @extends {GeoJSONObject}
  */
 var GeoJSONCRS = function() {};
 
 
 /**
- * @type {!GeoJSONCRSCode|!GeoJSONCRSName|!GeoJSONLink}
+ * CRS type. One of `link` or `name`.
+ * @type {string}
+ */
+GeoJSONCRS.prototype.type;
+
+
+/**
  * TODO: remove GeoJSONCRSCode when http://jira.codehaus.org/browse/GEOS-5996
  * is fixed and widely deployed.
+ * @type {!GeoJSONCRSCode|!GeoJSONCRSName|!GeoJSONLink}
  */
 GeoJSONCRS.prototype.properties;
 
@@ -60,9 +72,9 @@ var GeoJSONCRSName = function() {};
 
 
 /**
- * @type {string}
  * TODO: remove this when http://jira.codehaus.org/browse/GEOS-5996 is fixed
  * and widely deployed.
+ * @type {string}
  */
 GeoJSONCRSName.prototype.code;
 
@@ -142,16 +154,9 @@ var GeoJSONFeatureCollection = function() {};
 GeoJSONFeatureCollection.prototype.features;
 
 
-/**
- * @type {!Array.<number>|undefined}
- */
-GeoJSONFeatureCollection.prototype.bbox;
-
-
 
 /**
  * @constructor
- * @extends {GeoJSONObject}
  */
 var GeoJSONLink = function() {};
 
@@ -160,3 +165,8 @@ var GeoJSONLink = function() {};
  * @type {string}
  */
 GeoJSONLink.prototype.href;
+
+/**
+ * @type {string}
+ */
+GeoJSONLink.prototype.type;

externs/jquery-1.9.js

@@ -36,6 +36,44 @@ var jQuerySelector;
 /** @typedef {function(...)|Array.<function(...)>} */
 var jQueryCallback;
 
+/** @typedef {
+              {
+               accepts: (Object.<string, string>|undefined),
+               async: (?boolean|undefined),
+               beforeSend: (function(jQuery.jqXHR, (jQueryAjaxSettings|Object.<string, *>))|undefined),
+               cache: (?boolean|undefined),
+               complete: (function(jQuery.jqXHR, string)|undefined),
+               contents: (Object.<string, RegExp>|undefined),
+               contentType: (?string|undefined),
+               context: (Object.<?, ?>|jQueryAjaxSettings|undefined),
+               converters: (Object.<string, Function>|undefined),
+               crossDomain: (?boolean|undefined),
+               data: (Object.<?, ?>|?string|Array.<?>|undefined),
+               dataFilter: (function(string, string):Object.<?,?>|undefined),
+               dataType: (?string|undefined),
+               error: (function(jQuery.jqXHR, string, string)|undefined),
+               global: (?boolean|undefined),
+               headers: (Object.<?, ?>|undefined),
+               ifModified: (?boolean|undefined),
+               isLocal: (?boolean|undefined),
+               jsonp: (?string|undefined),
+               jsonpCallback: (?string|function()|undefined),
+               mimeType: (?string|undefined),
+               password: (?string|undefined),
+               processData: (?boolean|undefined),
+               scriptCharset: (?string|undefined),
+               statusCode: (Object.<number, function()>|undefined),
+               success: (function(?, string, jQuery.jqXHR)|undefined),
+               timeout: (?number|undefined),
+               traditional: (?boolean|undefined),
+               type: (?string|undefined),
+               url: (?string|undefined),
+               username: (?string|undefined),
+               xhr: (function():(ActiveXObject|XMLHttpRequest)|undefined),
+               xhrFields: (Object.<?, ?>|undefined)
+              }} */
+var jQueryAjaxSettings;
+
 /**
  * @constructor
  * @param {(jQuerySelector|Element|Object|Array.<Element>|jQuery|string|
@@ -86,105 +124,61 @@ jQuery.prototype.addClass = function(arg1) {};
 jQuery.prototype.after = function(arg1, content) {};
 
 /**
- * @param {(string|Object.<string,*>)} arg1
- * @param {Object.<string,*>=} settings
+ * @param {(string|jQueryAjaxSettings|Object.<string,*>)} arg1
+ * @param {(jQueryAjaxSettings|Object.<string, *>)=} settings
  * @return {jQuery.jqXHR}
  */
 jQuery.ajax = function(arg1, settings) {};
 
 /**
- * @param {(string|Object.<string,*>)} arg1
- * @param {Object.<string,*>=} settings
+ * @param {(string|jQueryAjaxSettings|Object.<string, *>)} arg1
+ * @param {(jQueryAjaxSettings|Object.<string, *>)=} settings
  * @return {jQuery.jqXHR}
  */
 $.ajax = function(arg1, settings) {};
 
 /**
- * @param {function(!jQuery.event,XMLHttpRequest,Object.<string, *>)} handler
+ * @param {function(!jQuery.event,XMLHttpRequest,(jQueryAjaxSettings|Object.<string, *>))} handler
  * @return {!jQuery}
  */
 jQuery.prototype.ajaxComplete = function(handler) {};
 
 /**
- * @param {function(!jQuery.event,jQuery.jqXHR,Object.<string, *>,*)} handler
+ * @param {function(!jQuery.event,jQuery.jqXHR,(jQueryAjaxSettings|Object.<string, *>),*)} handler
  * @return {!jQuery}
  */
 jQuery.prototype.ajaxError = function(handler) {};
 
 /**
- * @param {(string|
- *     function(Object.<string,*>,Object.<string, *>,jQuery.jqXHR))} dataTypes
- * @param {function(Object.<string,*>,Object.<string, *>,jQuery.jqXHR)=} handler
+ * @param {(string|function((jQueryAjaxSettings|Object.<string, *>),(jQueryAjaxSettings|Object.<string, *>),jQuery.jqXHR))} dataTypes
+ * @param {function((jQueryAjaxSettings|Object.<string, *>),(jQueryAjaxSettings|Object.<string, *>),jQuery.jqXHR)=} handler
  */
 jQuery.ajaxPrefilter = function(dataTypes, handler) {};
 
 /**
- * @param {(string|
- *     function(Object.<string,*>,Object.<string, *>,jQuery.jqXHR))} dataTypes
- * @param {function(Object.<string,*>,Object.<string, *>,jQuery.jqXHR)=} handler
+ * @param {(string|function((jQueryAjaxSettings|Object.<string, *>),(jQueryAjaxSettings|Object.<string, *>),jQuery.jqXHR))} dataTypes
+ * @param {function((jQueryAjaxSettings|Object.<string, *>),(jQueryAjaxSettings|Object.<string, *>),jQuery.jqXHR)=} handler
  */
 $.ajaxPrefilter = function(dataTypes, handler) {};
 
 /**
- * @param {function(!jQuery.event,jQuery.jqXHR,Object.<string, *>)} handler
+ * @param {function(!jQuery.event,jQuery.jqXHR,(jQueryAjaxSettings|Object.<string, *>))} handler
  * @return {!jQuery}
  */
 jQuery.prototype.ajaxSend = function(handler) {};
 
-/** @const */
-jQuery.ajaxSettings = {};
+/** @const {jQueryAjaxSettings|Object.<string, *>} */
+jQuery.ajaxSettings;
 
-/** @const */
+/** @const {jQueryAjaxSettings|Object.<string, *>} */
 $.ajaxSettings = {};
 
-/** @type {Object.<string, string>} */
-jQuery.ajaxSettings.accepts = {};
-
-/** @type {Object.<string, string>} */
-$.ajaxSettings.accepts = {};
-
-/** @type {boolean} */
-jQuery.ajaxSettings.async;
-
-/** @type {boolean} */
-$.ajaxSettings.async;
-
-/** @type {Object.<string, RegExp>} */
-jQuery.ajaxSettings.contents = {};
-
-/** @type {Object.<string, RegExp>} */
-$.ajaxSettings.contents = {};
-
-/** @type {string} */
-jQuery.ajaxSettings.contentType;
-
-/** @type {string} */
-$.ajaxSettings.contentType;
-
-/** @type {Object.<string, *>} */
-jQuery.ajaxSettings.converters = {};
-
-/** @type {Object.<string, *>} */
-$.ajaxSettings.converters = {};
-
 /** @type {Object.<string, boolean>} */
 jQuery.ajaxSettings.flatOptions = {};
 
 /** @type {Object.<string, boolean>} */
 $.ajaxSettings.flatOptions = {};
 
-/** @type {boolean} */
-jQuery.ajaxSettings.global;
-
-/** @type {boolean} */
-$.ajaxSettings.global;
-
-/** @type {boolean} */
-jQuery.ajaxSettings.isLocal;
-
-/** @type {boolean} */
-$.ajaxSettings.isLocal;
-
 /** @type {boolean} */
 jQuery.ajaxSettings.processData;
 
@@ -197,34 +191,10 @@ jQuery.ajaxSettings.responseFields = {};
 /** @type {Object.<string, string>} */
 $.ajaxSettings.responseFields = {};
 
-/** @type {boolean} */
-jQuery.ajaxSettings.traditional;
-
-/** @type {boolean} */
-$.ajaxSettings.traditional;
-
-/** @type {string} */
-jQuery.ajaxSettings.type;
-
-/** @type {string} */
-$.ajaxSettings.type;
-
-/** @type {string} */
-jQuery.ajaxSettings.url;
-
-/** @type {string} */
-$.ajaxSettings.url;
-
-/** @return {XMLHttpRequest|ActiveXObject} */
-jQuery.ajaxSettings.xhr = function() {};
-
-/** @return {XMLHttpRequest|ActiveXObject} */
-$.ajaxSettings.xhr = function() {};
-
-/** @param {Object.<string,*>} options */
+/** @param {jQueryAjaxSettings|Object.<string, *>} options */
 jQuery.ajaxSetup = function(options) {};
 
-/** @param {Object.<string,*>} options */
+/** @param {jQueryAjaxSettings|Object.<string, *>} options */
 $.ajaxSetup = function(options) {};
 
 /**
@@ -240,7 +210,7 @@ jQuery.prototype.ajaxStart = function(handler) {};
 jQuery.prototype.ajaxStop = function(handler) {};
 
 /**
- * @param {function(!jQuery.event,XMLHttpRequest,Object.<string, *>)} handler
+ * @param {function(!jQuery.event,XMLHttpRequest,(jQueryAjaxSettings|Object.<string, *>), ?)} handler
  * @return {!jQuery}
  */
 jQuery.prototype.ajaxSuccess = function(handler) {};
@@ -834,8 +804,9 @@ jQuery.prototype.fadeTo = function(duration, opacity, arg3, callback) {};
 jQuery.prototype.fadeToggle = function(duration, easing, callback) {};
 
 /**
- * @param {(jQuerySelector|function(number)|Element|jQuery)} arg1
+ * @param {(jQuerySelector|function(number,Element)|Element|jQuery)} arg1
  * @return {!jQuery}
+ * @see http://api.jquery.com/filter/
  */
 jQuery.prototype.filter = function(arg1) {};
 

externs/oli.js

@@ -55,10 +55,18 @@ oli.DrawEvent.prototype.feature;
 oli.ObjectEvent = function() {};
 
 
-/** @type {string} */
+/**
+ * @type {string}
+ */
 oli.ObjectEvent.prototype.key;
 
 
+/**
+ * @type {*}
+ */
+oli.ObjectEvent.prototype.oldValue;
+
+
 
 /**
  * @interface
@@ -84,6 +92,12 @@ oli.MapBrowserEvent.prototype.originalEvent;
 oli.MapBrowserEvent.prototype.pixel;
 
 
+/**
+ * @type {boolean}
+ */
+oli.MapBrowserEvent.prototype.dragging;
+
+
 
 /**
  * @interface
@@ -122,13 +136,13 @@ oli.control.Control = function() {};
 oli.control.Control.prototype.setMap = function(map) {};
 
 
+
 /**
  * @type {Object}
  */
 oli.interaction;
 
 
-
 /**
  * @interface
  */
@@ -196,6 +210,17 @@ oli.render.Event.prototype.vectorContext;
 oli.source;
 
 
+/**
+ * @interface
+ */
+oli.source.TileEvent = function() {};
+
+
+/**
+ * @type {ol.Tile}
+ */
+oli.source.TileEvent.prototype.tile;
+
 
 /**
  * @interface