Merge pull request #6008 from marcjansen/release-v3.19.0

Release v3.19.0

DEVELOPING.md

@@ -77,7 +77,7 @@ Then, just point your browser <http://localhost:3000/build/examples> in your bro
 Run examples against the `ol.js` standalone build:
 
 The examples can also be run against the `ol.js` standalone build, just like
-the examples [hosted](http://openlayers.org/en/master/examples/) on GitHub.
+the examples [hosted](https://openlayers.org/en/master/examples/) on GitHub.
 Start by executing the `host-examples` build target:
 
     $ make host-examples

README.md

@@ -4,11 +4,11 @@
 [![Coverage Status](https://coveralls.io/repos/openlayers/ol3/badge.svg?branch=master)](https://coveralls.io/r/openlayers/ol3?branch=master)
 [![OSGeo Project](https://img.shields.io/badge/OSGeo-Project-brightgreen.svg)](http://osgeo.org/)
 
-[OpenLayers 3](http://openlayers.org/) is a high-performance, feature-packed library for creating interactive maps on the web. It can display map tiles, vector data and markers loaded from any source on any web page. OpenLayers has been developed to further the use of geographic information of all kinds. It is completely free, Open Source JavaScript, released under the 2-clause BSD License (also known as the FreeBSD).
+[OpenLayers 3](https://openlayers.org/) is a high-performance, feature-packed library for creating interactive maps on the web. It can display map tiles, vector data and markers loaded from any source on any web page. OpenLayers has been developed to further the use of geographic information of all kinds. It is completely free, Open Source JavaScript, released under the 2-clause BSD License (also known as the FreeBSD).
 
 ## Getting Started
 
-- Download the [latest release](http://openlayers.org/download/)
+- Download the [latest release](https://openlayers.org/download/)
 - Install with npm: `npm install openlayers`
 - Clone the repo: `git clone git@github.com:openlayers/ol3.git`
 
@@ -18,7 +18,7 @@ OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.wh
 
 ## Documentation
 
-Check out the [hosted examples](http://openlayers.org/en/latest/examples/), the [workshop](http://openlayers.org/workshop/) or the [API documentation](http://openlayers.org/en/latest/apidoc/).
+Check out the [hosted examples](https://openlayers.org/en/latest/examples/), the [workshop](https://openlayers.org/workshop/) or the [API documentation](https://openlayers.org/en/latest/apidoc/).
 
 ## Bugs
 

changelog/upgrade-notes.md

@@ -1,5 +1,12 @@
 ## Upgrade notes
 
+### v3.19.0
+
+#### `ol.style.Fill` with `CanvasGradient` or `CanvasPattern`
+
+Previously, gradients and patterns were aligned with the canvas, so they did not
+move and rotate with the map. This was changed to a more expected behavior by anchoring the fill to the map origin (usually at map coordinate `[0, 0]`).
+
 #### `goog.DEBUG` define was renamed to `ol.DEBUG`
 
 As last step in the removal of the dependency on Google Closure Library, the `goog.DEBUG` compiler define was renamed to `ol.DEBUG`. Please change accordingly in your custom build configuration json files.
@@ -22,6 +29,7 @@ A number of internal types have been renamed.  This will not affect those who us
  * rename `ol.OverlayProperty` to `ol.Overlay.Property`
  * rename `ol.control.MousePositionProperty` to `ol.control.MousePosition.Property`
  * rename `ol.format.IGCZ` to `ol.format.IGC.Z`
+ * rename `ol.interaction.InteractionProperty` to `ol.interaction.Interaction.Property`
  * rename `ol.interaction.DrawMode` to `ol.interaction.Draw.Mode`
  * rename `ol.interaction.DrawEvent` to `ol.interaction.Draw.Event`
  * rename `ol.interaction.DrawEventType` to `ol.interaction.Draw.EventType`
@@ -42,6 +50,7 @@ A number of internal types have been renamed.  This will not affect those who us
  * rename `ol.MapProperty` to `ol.Map.Property`
  * rename `ol.ModifyEventType` to `ol.interaction.Modify.EventType`
  * rename `ol.RendererType` to `ol.renderer.Type`
+ * rename `ol.render.EventType` to `ol.render.Event.Type`
  * rename `ol.source.ImageEvent` to `ol.source.Image.Event`
  * rename `ol.source.ImageEventType` to `ol.source.Image.EventType`
  * rename `ol.source.RasterEvent` to `ol.source.Raster.Event`
@@ -63,7 +72,7 @@ The DOM renderer has been removed.  Instead, the Canvas renderer should be used.
 
 #### Changes in the way assertions are handled
 
-Previously, minified builds of the library did not have any assertions. This caused applications to fail silently or with cryptic stack traces. Starting with this release, developers get notified of many runtime errors through the new `ol.AssertionError`. This error has a `code` property. The meaning of the code can be found on http://openlayers.org/en/latest/doc/errors/. There are additional console assertion checks in debug mode when the `goog.DEBUG` compiler flag is `true`. As this is `true` by default, it is recommended that those creating custom builds set this to `false` so these assertions are stripped.'
+Previously, minified builds of the library did not have any assertions. This caused applications to fail silently or with cryptic stack traces. Starting with this release, developers get notified of many runtime errors through the new `ol.AssertionError`. This error has a `code` property. The meaning of the code can be found on https://openlayers.org/en/latest/doc/errors/. There are additional console assertion checks in debug mode when the `goog.DEBUG` compiler flag is `true`. As this is `true` by default, it is recommended that those creating custom builds set this to `false` so these assertions are stripped.'
 
 #### Removal of `ol.ENABLE_NAMED_COLORS`
 
@@ -172,7 +181,7 @@ var v3source = new ol.source.TileUTFGrid({
 
 #### Internet Explorer 9 support
 
-As of this release, OpenLayers requires a `classList` polyfill for IE 9 support. See http://cdn.polyfill.io/v2/docs/features#Element_prototype_classList.
+As of this release, OpenLayers requires a `classList` polyfill for IE 9 support. See https://cdn.polyfill.io/v2/docs/features#Element_prototype_classList.
 
 #### Immediate rendering API
 
@@ -221,7 +230,7 @@ The default cache size is `2048`.
 
 #### Internet Explorer 9 support
 
-As of this release, OpenLayers requires a `requestAnimationFrame`/`cancelAnimationFrame` polyfill for IE 9 support. See http://cdn.polyfill.io/v2/docs/features/#requestAnimationFrame.
+As of this release, OpenLayers requires a `requestAnimationFrame`/`cancelAnimationFrame` polyfill for IE 9 support. See https://cdn.polyfill.io/v2/docs/features/#requestAnimationFrame.
 
 #### Layer pre-/postcompose event changes
 
@@ -539,7 +548,7 @@ now specify an `extent` instead of `widths`. These settings are used to restrict
   });
   ```
 
-  See http://openlayers.org/en/master/examples/vector-layer.html for a real example.
+  See https://openlayers.org/en/master/examples/vector-layer.html for a real example.
 
   Note that you no longer need to set a `projection` on the source!
 
@@ -561,7 +570,7 @@ now specify an `extent` instead of `widths`. These settings are used to restrict
 
   The above code uses jQuery to send an Ajax request, but you can obviously use any Ajax library.
 
-  See http://openlayers.org/en/master/examples/igc.html for a real example.
+  See https://openlayers.org/en/master/examples/igc.html for a real example.
 
 * Note about KML
 
@@ -619,9 +628,9 @@ now specify an `extent` instead of `widths`. These settings are used to restrict
   });
   ```
 
-  See http://openlayers.org/en/master/examples/vector-osm.html for a real example.
+  See https://openlayers.org/en/master/examples/vector-osm.html for a real example.
 
-* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See http://openlayers.org/en/master/examples/vector-osm.html for an example.
+* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See https://openlayers.org/en/master/examples/vector-osm.html for an example.
 
 #### Change to `ol.style.Icon`
 

changelog/v3.14.0.md

@@ -17,7 +17,7 @@ The v3.14.0 release includes features and fixes from 93 pull requests since the
 
 #### Internet Explorer 9 support
 
-As of this release, OpenLayers requires a `requestAnimationFrame`/`cancelAnimationFrame` polyfill for IE 9 support. See http://cdn.polyfill.io/v2/docs/features/#requestAnimationFrame.
+As of this release, OpenLayers requires a `requestAnimationFrame`/`cancelAnimationFrame` polyfill for IE 9 support. See https://cdn.polyfill.io/v2/docs/features/#requestAnimationFrame.
 
 #### Layer pre-/postcompose event changes
 

changelog/v3.15.0.md

@@ -18,7 +18,7 @@ The v3.15.0 release includes features and fixes from 136 pull requests since the
 
 #### Internet Explorer 9 support
 
-As of this release, OpenLayers requires a `classList` polyfill for IE 9 support. See http://cdn.polyfill.io/v2/docs/features#Element_prototype_classList.
+As of this release, OpenLayers requires a `classList` polyfill for IE 9 support. See https://cdn.polyfill.io/v2/docs/features#Element_prototype_classList.
 
 #### Immediate rendering API
 

changelog/v3.18.0.md

@@ -14,7 +14,7 @@ The v3.18.0 release includes features and fixes from almost 120 pull requests si
 
 #### Changes in the way assertions are handled
 
-Previously, minified builds of the library did not have any assertions. This caused applications to fail silently or with cryptic stack traces. Starting with this release, developers get notified of many runtime errors through the new `ol.AssertionError`. This error has a `code` property. The meaning of the code can be found on http://openlayers.org/en/latest/doc/errors/. There are additional console assertion checks in debug mode when the `goog.DEBUG` compiler flag is `true`. As this is `true` by default, it is recommended that those creating custom builds set this to `false` so these assertions are stripped.'
+Previously, minified builds of the library did not have any assertions. This caused applications to fail silently or with cryptic stack traces. Starting with this release, developers get notified of many runtime errors through the new `ol.AssertionError`. This error has a `code` property. The meaning of the code can be found on https://openlayers.org/en/latest/doc/errors/. There are additional console assertion checks in debug mode when the `goog.DEBUG` compiler flag is `true`. As this is `true` by default, it is recommended that those creating custom builds set this to `false` so these assertions are stripped.'
 
 #### Removal of `ol.ENABLE_NAMED_COLORS`
 

changelog/v3.19.0.md

@@ -0,0 +1,203 @@
+# v3.19.0
+
+## Summary
+
+The v3.19.0 release includes features and fixes from a little more than 120 pull requests with more than 380 commits. Most of the changes are bug fixes, documentation enhancements or target the continuing removal of the dependency on Closure Library. Some notable new or enhanced features are:
+
+* Vector fills with `CanvasGradient` or `CanvasPattern` now move and rotate with the map which is far more intuitive ([#5950](https://github.com/openlayers/ol3/pull/5950))
+* Drawing in `freehand`-mode also became more intuitive ([#5970](https://github.com/openlayers/ol3/pull/5970), [#5973](https://github.com/openlayers/ol3/pull/5973), [#5975](https://github.com/openlayers/ol3/pull/5975))
+* When tiles of different resolutions are combined for a layer (which is the case before all tiles of the best resolution have been loaded), lower resolution tiles now align with higher resolution tiles resulting in a map without gaps ([#5890](https://github.com/openlayers/ol3/pull/5890))
+* Styles can now easily be cloned ([#5832](https://github.com/openlayers/ol3/pull/5832))
+
+Additionally the [openlayers.org](https://openlayers.org) homepage is now available via the `https`-protocol.
+
+## Upgrade notes
+
+#### `ol.style.Fill` with `CanvasGradient` or `CanvasPattern`
+
+Previously, gradients and patterns were aligned with the canvas, so they did not
+move and rotate with the map. This was changed to a more expected behavior by anchoring the fill to the map origin (usually at map coordinate `[0, 0]`).
+
+#### `goog.DEBUG` define was renamed to `ol.DEBUG`
+
+As last step in the removal of the dependency on Google Closure Library, the `goog.DEBUG` compiler define was renamed to `ol.DEBUG`. Please change accordingly in your custom build configuration json files.
+
+#### `ol.format.ogc.filter` namespace was renamed to `ol.format.filter`
+
+`ol.format.ogc.filter` was simplified to `ol.format.filter`; to upgrade your code, simply remove the `ogc` string from the name.
+For example: `ol.format.ogc.filter.and` to `ol.format.filter.and`.
+
+#### Changes only relevant to those who compile their applications together with the Closure Compiler
+
+A number of internal types have been renamed.  This will not affect those who use the API provided by the library, but if you are compiling your application together with OpenLayers and using type names, you'll need to do the following:
+
+ * rename `ol.CollectionProperty` to `ol.Collection.Property`
+ * rename `ol.DeviceOrientationProperty` to `ol.DeviceOrientation.Property`
+ * rename `ol.DragBoxEvent` to `ol.interaction.DragBox.Event`
+ * rename `ol.DragBoxEventType` to `ol.interaction.DragBox.EventType`
+ * rename `ol.GeolocationProperty` to `ol.Geolocation.Property`
+ * rename `ol.OverlayPositioning` to `ol.Overlay.Positioning`
+ * rename `ol.OverlayProperty` to `ol.Overlay.Property`
+ * rename `ol.control.MousePositionProperty` to `ol.control.MousePosition.Property`
+ * rename `ol.format.IGCZ` to `ol.format.IGC.Z`
+ * rename `ol.interaction.InteractionProperty` to `ol.interaction.Interaction.Property`
+ * rename `ol.interaction.DrawMode` to `ol.interaction.Draw.Mode`
+ * rename `ol.interaction.DrawEvent` to `ol.interaction.Draw.Event`
+ * rename `ol.interaction.DrawEventType` to `ol.interaction.Draw.EventType`
+ * rename `ol.interaction.ExtentEvent` to `ol.interaction.Extent.Event`
+ * rename `ol.interaction.ExtentEventType` to `ol.interaction.Extent.EventType`
+ * rename `ol.interaction.DragAndDropEvent` to `ol.interaction.DragAndDrop.Event`
+ * rename `ol.interaction.DragAndDropEventType` to `ol.interaction.DragAndDrop.EventType`
+ * rename `ol.interaction.ModifyEvent` to `ol.interaction.Modify.Event`
+ * rename `ol.interaction.SelectEvent` to `ol.interaction.Select.Event`
+ * rename `ol.interaction.SelectEventType` to `ol.interaction.Select.EventType`
+ * rename `ol.interaction.TranslateEvent` to `ol.interaction.Translate.Event`
+ * rename `ol.interaction.TranslateEventType` to `ol.interaction.Translate.EventType`
+ * rename `ol.layer.GroupProperty` to `ol.layer.Group.Property`
+ * rename `ol.layer.HeatmapLayerProperty` to `ol.layer.Heatmap.Property`
+ * rename `ol.layer.TileProperty` to `ol.layer.Tile.Property`
+ * rename `ol.layer.VectorTileRenderType` to `ol.layer.VectorTile.RenderType`
+ * rename `ol.MapEventType` to `ol.MapEvent.Type`
+ * rename `ol.MapProperty` to `ol.Map.Property`
+ * rename `ol.ModifyEventType` to `ol.interaction.Modify.EventType`
+ * rename `ol.RendererType` to `ol.renderer.Type`
+ * rename `ol.render.EventType` to `ol.render.Event.Type`
+ * rename `ol.source.ImageEvent` to `ol.source.Image.Event`
+ * rename `ol.source.ImageEventType` to `ol.source.Image.EventType`
+ * rename `ol.source.RasterEvent` to `ol.source.Raster.Event`
+ * rename `ol.source.RasterEventType` to `ol.source.Raster.EventType`
+ * rename `ol.source.TileEvent` to `ol.source.Tile.Event`
+ * rename `ol.source.TileEventType` to `ol.source.Tile.EventType`
+ * rename `ol.source.VectorEvent` to `ol.source.Vector.Event`
+ * rename `ol.source.VectorEventType` to `ol.source.Vector.EventType`
+ * rename `ol.source.wms.ServerType` to `ol.source.WMSServerType`
+ * rename `ol.source.WMTSRequestEncoding` to `ol.source.WMTS.RequestEncoding`
+ * rename `ol.style.IconAnchorUnits` to `ol.style.Icon.AnchorUnits`
+ * rename `ol.style.IconOrigin` to `ol.style.Icon.Origin`
+
+## Full list of changes
+
+ * [#6007](https://github.com/openlayers/ol3/pull/6007) - Add note to example that canvas.toBlob() is required ([@marcjansen](https://github.com/marcjansen))
+ * [#5979](https://github.com/openlayers/ol3/pull/5979) - Use FileSaver.js in export-map example ([@fredj](https://github.com/fredj))
+ * [#6004](https://github.com/openlayers/ol3/pull/6004) - Bring back the vector-osm example, using a different service ([@ahocevar](https://github.com/ahocevar))
+ * [#6002](https://github.com/openlayers/ol3/pull/6002) - Use tile pixel ratio for gutter calculation ([@ahocevar](https://github.com/ahocevar))
+ * [#5991](https://github.com/openlayers/ol3/pull/5991) - Only test ol.format.MVT if ArrayBuffer.isView is supported ([@openlayers](https://github.com/openlayers))
+ * [#6000](https://github.com/openlayers/ol3/pull/6000) - Fix mockup of tile layer to keep drawImage arguments in range ([@ahocevar](https://github.com/ahocevar))
+ * [#5997](https://github.com/openlayers/ol3/pull/5997) - Always load a gated URL polyfill when testing ([@marcjansen](https://github.com/marcjansen))
+ * [#5963](https://github.com/openlayers/ol3/pull/5963) - Remove the vertex on ol.interaction.Modify deactivation ([@fredj](https://github.com/fredj))
+ * [#5994](https://github.com/openlayers/ol3/pull/5994) - Setup a loaded image with src for TileLayer test ([@marcjansen](https://github.com/marcjansen))
+ * [#5989](https://github.com/openlayers/ol3/pull/5989) - Remove vector-osm example ([@openlayers](https://github.com/openlayers))
+ * [#5985](https://github.com/openlayers/ol3/pull/5985) - Update Mapzen urls to new scheme ([@ahocevar](https://github.com/ahocevar))
+ * [#5984](https://github.com/openlayers/ol3/pull/5984) - Less examples with mixed content ([@ahocevar](https://github.com/ahocevar))
+ * [#5986](https://github.com/openlayers/ol3/pull/5986) - Update eslint to version 3.8.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5982](https://github.com/openlayers/ol3/pull/5982) - Use a https enabled GeoServer ([@ahocevar](https://github.com/ahocevar))
+ * [#5977](https://github.com/openlayers/ol3/pull/5977) - Convenience function for drawing boxes ([@tschaub](https://github.com/tschaub))
+ * [#5978](https://github.com/openlayers/ol3/pull/5978) - Update async to version 2.1.2 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5975](https://github.com/openlayers/ol3/pull/5975) - Finish drawing on pointerup when in freehand mode ([@tschaub](https://github.com/tschaub))
+ * [#5976](https://github.com/openlayers/ol3/pull/5976) - Use https where available ([@tschaub](https://github.com/tschaub))
+ * [#5973](https://github.com/openlayers/ol3/pull/5973) - Add a freehand option to the draw interaction ([@tschaub](https://github.com/tschaub))
+ * [#5964](https://github.com/openlayers/ol3/pull/5964) - Set one-off transform instead of transforming back and forth ([@ahocevar](https://github.com/ahocevar))
+ * [#5970](https://github.com/openlayers/ol3/pull/5970) - Allow circles, squares, and boxes to be drawn in freehand mode ([@tschaub](https://github.com/tschaub))
+ * [#5972](https://github.com/openlayers/ol3/pull/5972) - Update eslint to version 3.8.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5969](https://github.com/openlayers/ol3/pull/5969) - Test all, not just one ([@ahocevar](https://github.com/ahocevar))
+ * [#5967](https://github.com/openlayers/ol3/pull/5967) - Add missing jsdoc to ol.render.canvas.Replay#fill_ function ([@fredj](https://github.com/fredj))
+ * [#5962](https://github.com/openlayers/ol3/pull/5962) - Use same proj4js version in examples and tests ([@ahocevar](https://github.com/ahocevar))
+ * [#5961](https://github.com/openlayers/ol3/pull/5961) - Remove unused error codes ([@ahocevar](https://github.com/ahocevar))
+ * [#5960](https://github.com/openlayers/ol3/pull/5960) - More renaming to have one provide per file ([@fredj](https://github.com/fredj))
+ * [#5959](https://github.com/openlayers/ol3/pull/5959) - Remove unnecessary and misleading assertion ([@ahocevar](https://github.com/ahocevar))
+ * [#5950](https://github.com/openlayers/ol3/pull/5950) - Move gradient and pattern fills with the view ([@ahocevar](https://github.com/ahocevar))
+ * [#5957](https://github.com/openlayers/ol3/pull/5957) - Update async to version 2.1.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5956](https://github.com/openlayers/ol3/pull/5956) - Update async to version 2.1.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5955](https://github.com/openlayers/ol3/pull/5955) - Add getters to BingMaps source for api key and imagerySet ([@bartvde](https://github.com/bartvde))
+ * [#5944](https://github.com/openlayers/ol3/pull/5944) - Allow readFeature and readFeatures to be called with GeoJSON geometries ([@tschaub](https://github.com/tschaub))
+ * [#5949](https://github.com/openlayers/ol3/pull/5949) - Add prose documentation for ol.AttributionLike ([@marcjansen](https://github.com/marcjansen))
+ * [#5948](https://github.com/openlayers/ol3/pull/5948) - Fix API docs of ol.Feature#getStyle ([@marcjansen](https://github.com/marcjansen))
+ * [#5946](https://github.com/openlayers/ol3/pull/5946) - Update mocha to version 3.1.2 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5941](https://github.com/openlayers/ol3/pull/5941) - Update mocha to version 3.1.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5890](https://github.com/openlayers/ol3/pull/5890) - No gaps between tiles of different resolutions ([@ahocevar](https://github.com/ahocevar))
+ * [#5935](https://github.com/openlayers/ol3/pull/5935) - Keep transformed coordinates within valid y range ([@tschaub](https://github.com/tschaub))
+ * [#5937](https://github.com/openlayers/ol3/pull/5937) - One provide per file for vector tiles ([@ahocevar](https://github.com/ahocevar))
+ * [#5933](https://github.com/openlayers/ol3/pull/5933) - Update phantomjs-prebuilt to version 2.1.13 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5932](https://github.com/openlayers/ol3/pull/5932) - Update eslint to version 3.7.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5931](https://github.com/openlayers/ol3/pull/5931) - Update jsdoc to version 3.4.2 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5923](https://github.com/openlayers/ol3/pull/5923) - Update pbf to version 3.0.2 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5926](https://github.com/openlayers/ol3/pull/5926) - Ensure correct type of event.element ([@adube](https://github.com/adube))
+ * [#5928](https://github.com/openlayers/ol3/pull/5928) - Update eslint to version 3.7.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5919](https://github.com/openlayers/ol3/pull/5919) - Update resemblejs to version 2.2.2 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5909](https://github.com/openlayers/ol3/pull/5909) - Update jquery to version 3.1.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5917](https://github.com/openlayers/ol3/pull/5917) - Accept feature projection in GeoJSON constructor ([@tschaub](https://github.com/tschaub))
+ * [#5918](https://github.com/openlayers/ol3/pull/5918) - Update mocha to version 3.1.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5916](https://github.com/openlayers/ol3/pull/5916) - Update eslint to version 3.6.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5914](https://github.com/openlayers/ol3/pull/5914) - Allow clipping by MultiPolygon ([@tschaub](https://github.com/tschaub))
+ * [#5894](https://github.com/openlayers/ol3/pull/5894) - Reuse arrays for rendered tiles and extent ([@ahocevar](https://github.com/ahocevar))
+ * [#5895](https://github.com/openlayers/ol3/pull/5895) - Always use the frameState's extent ([@ahocevar](https://github.com/ahocevar))
+ * [#5911](https://github.com/openlayers/ol3/pull/5911) - Update eslint to version 3.6.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5903](https://github.com/openlayers/ol3/pull/5903) - Rename ol.format.ogc.filter namespace to ol.format.filter ([@fredj](https://github.com/fredj))
+ * [#5913](https://github.com/openlayers/ol3/pull/5913) - Update clean-css to version 3.4.20 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5776](https://github.com/openlayers/ol3/pull/5776) - Add ol.style.Circle#setRadius ([@jonataswalker](https://github.com/jonataswalker))
+ * [#5905](https://github.com/openlayers/ol3/pull/5905) - Update pbf to version 3.0.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5904](https://github.com/openlayers/ol3/pull/5904) - Fix changelog/upgrade-notes.md formating ([@fredj](https://github.com/fredj))
+ * [#5906](https://github.com/openlayers/ol3/pull/5906) - Update glob to version 7.1.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5898](https://github.com/openlayers/ol3/pull/5898) - Update sinon to version 1.17.6 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5888](https://github.com/openlayers/ol3/pull/5888) - Remove unused functions ([@fredj](https://github.com/fredj))
+ * [#5900](https://github.com/openlayers/ol3/pull/5900) - Update coveralls to version 2.11.14 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5897](https://github.com/openlayers/ol3/pull/5897) - Show NEXRAD data in WMS Time example ([@ahocevar](https://github.com/ahocevar))
+ * [#5896](https://github.com/openlayers/ol3/pull/5896) - Remove plain string from Map renderer option ([@probins](https://github.com/probins))
+ * [#5893](https://github.com/openlayers/ol3/pull/5893) - Fix fillStyle or strokeStyle defined assertion ([@ahocevar](https://github.com/ahocevar))
+ * [#5892](https://github.com/openlayers/ol3/pull/5892) - Remove getRendererFromQueryString from examples ([@probins](https://github.com/probins))
+ * [#5889](https://github.com/openlayers/ol3/pull/5889) - Update coveralls to version 2.11.13 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5886](https://github.com/openlayers/ol3/pull/5886) - Remove unused functions ([@fredj](https://github.com/fredj))
+ * [#5885](https://github.com/openlayers/ol3/pull/5885) - Remove unused pruneTileRange function ([@bartvde](https://github.com/bartvde))
+ * [#5853](https://github.com/openlayers/ol3/pull/5853) - Allow more than one digit range in ol.TileUrlFunction.expandUrl ([@fredj](https://github.com/fredj))
+ * [#5445](https://github.com/openlayers/ol3/pull/5445) - Select interaction default styling function can now handle geometry less features ([@fblackburn](https://github.com/fblackburn))
+ * [#5884](https://github.com/openlayers/ol3/pull/5884) - Fix jsdoc tag indentation ([@fredj](https://github.com/fredj))
+ * [#5863](https://github.com/openlayers/ol3/pull/5863) - Allow CanvasPattern or CanvasGradient as stroke style ([@fredj](https://github.com/fredj))
+ * [#5838](https://github.com/openlayers/ol3/pull/5838) - Require ol where ol.DEBUG is being used ([@marcjansen](https://github.com/marcjansen))
+ * [#5878](https://github.com/openlayers/ol3/pull/5878) - Smarter handling of closed rings and closePath() instructions ([@ahocevar](https://github.com/ahocevar))
+ * [#5880](https://github.com/openlayers/ol3/pull/5880) - More work towards one provide per file ([@marcjansen](https://github.com/marcjansen))
+ * [#5857](https://github.com/openlayers/ol3/pull/5857) - Fixed issue with multi option of ol.interaction.Select ([@KlausBenndorf](https://github.com/KlausBenndorf))
+ * [#5876](https://github.com/openlayers/ol3/pull/5876) - Use clone method in kml format ([@KlausBenndorf](https://github.com/KlausBenndorf))
+ * [#5832](https://github.com/openlayers/ol3/pull/5832) - Add clone methods to styles ([@KlausBenndorf](https://github.com/KlausBenndorf))
+ * [#5869](https://github.com/openlayers/ol3/pull/5869) - Update jsdoc to version 3.4.1 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5872](https://github.com/openlayers/ol3/pull/5872) - Keep ol.Color as Array<number> ([@tschaub](https://github.com/tschaub))
+ * [#5870](https://github.com/openlayers/ol3/pull/5870) - Update eslint to version 3.5.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5867](https://github.com/openlayers/ol3/pull/5867) - Add dedicated example using CanvasPattern and CanvasGradient for styling vectors ([@marcjansen](https://github.com/marcjansen))
+ * [#5864](https://github.com/openlayers/ol3/pull/5864) - More renaming ([@fredj](https://github.com/fredj))
+ * [#5861](https://github.com/openlayers/ol3/pull/5861) - More renaming to have one provide per file ([@fredj](https://github.com/fredj))
+ * [#5860](https://github.com/openlayers/ol3/pull/5860) - Rename ol.MapProperty and ol.interaction.DragAndDropEvent* ([@fredj](https://github.com/fredj))
+ * [#5855](https://github.com/openlayers/ol3/pull/5855) - Rename ol.DragBoxEvent* to ol.interaction.DragBox.Event* ([@fredj](https://github.com/fredj))
+ * [#5859](https://github.com/openlayers/ol3/pull/5859) - Rename ol.RendererType to ol.renderer.Type ([@fredj](https://github.com/fredj))
+ * [#5846](https://github.com/openlayers/ol3/pull/5846) - Remove unused goog.require('ol') ([@probins](https://github.com/probins))
+ * [#5854](https://github.com/openlayers/ol3/pull/5854) - Use a canvas pattern in the vector-layer example ([@fredj](https://github.com/fredj))
+ * [#5852](https://github.com/openlayers/ol3/pull/5852) - ol.interaction.extent cleanup ([@fredj](https://github.com/fredj))
+ * [#5851](https://github.com/openlayers/ol3/pull/5851) - Remove unused imageByContext_ in ol.ImageTile ([@fredj](https://github.com/fredj))
+ * [#5849](https://github.com/openlayers/ol3/pull/5849) - Remove 'global' from externs/closure-compiler.js ([@fredj](https://github.com/fredj))
+ * [#5837](https://github.com/openlayers/ol3/pull/5837) - Remove ol.global ([@tschaub](https://github.com/tschaub))
+ * [#5842](https://github.com/openlayers/ol3/pull/5842) - Remove extra provide causing a circular dependency ([@ahocevar](https://github.com/ahocevar))
+ * [#5795](https://github.com/openlayers/ol3/pull/5795) - Render older loaded tiles while waiting for new tiles ([@thomasmoelhave](https://github.com/thomasmoelhave))
+ * [#5840](https://github.com/openlayers/ol3/pull/5840) - Rename source.wms.ServerType ➛ source.WMSServerType ([@marcjansen](https://github.com/marcjansen))
+ * [#5839](https://github.com/openlayers/ol3/pull/5839) - Rename source.VectorEvent(*) to source.Vector.Event(*) ([@marcjansen](https://github.com/marcjansen))
+ * [#5835](https://github.com/openlayers/ol3/pull/5835) - document and test ol.getUid sequence behavior ([@thomasmoelhave](https://github.com/thomasmoelhave))
+ * [#5834](https://github.com/openlayers/ol3/pull/5834) - Rename goog.DEBUG to ol.DEBUG ([@thomasmoelhave](https://github.com/thomasmoelhave))
+ * [#5815](https://github.com/openlayers/ol3/pull/5815) - Remove the DOM renderer ([@tschaub](https://github.com/tschaub))
+ * [#5828](https://github.com/openlayers/ol3/pull/5828) - Always close polygon rings ([@ahocevar](https://github.com/ahocevar))
+ * [#5794](https://github.com/openlayers/ol3/pull/5794) - Fix more missing requires ([@openlayers](https://github.com/openlayers))
+ * [#5820](https://github.com/openlayers/ol3/pull/5820) - Change ol.format.Format to ol.format.Feature in format/readme.md ([@fredj](https://github.com/fredj))
+ * [#5819](https://github.com/openlayers/ol3/pull/5819) - Add ArrayBuffer.isView method in externs/closure-compiler.js ([@fredj](https://github.com/fredj))
+ * [#5793](https://github.com/openlayers/ol3/pull/5793) - Closure bye bye ([@ahocevar](https://github.com/ahocevar))
+ * [#5809](https://github.com/openlayers/ol3/pull/5809) - Reuse ol.LayerState object ([@fredj](https://github.com/fredj))
+ * [#5811](https://github.com/openlayers/ol3/pull/5811) - Use ol.global.getComputedStyle instead of window.getComputedStyle ([@fredj](https://github.com/fredj))
+ * [#5810](https://github.com/openlayers/ol3/pull/5810) - ESLint rule typo ([@gberaudo](https://github.com/gberaudo))
+ * [#5807](https://github.com/openlayers/ol3/pull/5807) - Update pbf to version 3.0.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5806](https://github.com/openlayers/ol3/pull/5806) - Fix olx.style.TextOptions.rotateWithView option in externs ([@fredj](https://github.com/fredj))
+ * [#5770](https://github.com/openlayers/ol3/pull/5770) - Update ol.source.Vector comments ([@fredj](https://github.com/fredj))
+ * [#5803](https://github.com/openlayers/ol3/pull/5803) - V3.18.1 ([@openlayers](https://github.com/openlayers))
+ * [#5801](https://github.com/openlayers/ol3/pull/5801) - Remove ol.style.ImageState and use ol.ImageState instead ([@fredj](https://github.com/fredj))
+ * [#5790](https://github.com/openlayers/ol3/pull/5790) - Fix vector tile rotation on HiDPI devices ([@ahocevar](https://github.com/ahocevar))
+ * [#5798](https://github.com/openlayers/ol3/pull/5798) - Move to 90° along the circle, not 0° ([@ahocevar](https://github.com/ahocevar))
+ * [#5800](https://github.com/openlayers/ol3/pull/5800) - Wrap values in <Literal> for InBetween filter ([@tsauerwein](https://github.com/tsauerwein))
+ * [#5769](https://github.com/openlayers/ol3/pull/5769) - Only call addToDrawing if sketchFeature ([@bartvde](https://github.com/bartvde))
+ * [#5745](https://github.com/openlayers/ol3/pull/5745) - removed dependencies on goog.object.clone and fixed placemark rendering ([@tamarmot](https://github.com/tamarmot))
+ * [#5290](https://github.com/openlayers/ol3/pull/5290) - Add extent interaction ([@tbarsballe](https://github.com/tbarsballe))
+ * [#5786](https://github.com/openlayers/ol3/pull/5786) - Update eslint to version 3.4.0 🚀 ([@openlayers](https://github.com/openlayers))
+ * [#5785](https://github.com/openlayers/ol3/pull/5785) - Release v3.18.0 ([@openlayers](https://github.com/openlayers))

changelog/v3.2.0.md

@@ -2,7 +2,7 @@
 
 ## 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.
+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](https://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
 

changelog/v3.5.0.md

@@ -53,7 +53,7 @@ The 3.5.0 release includes features and fixes from a whopping 129 pull requests
   });
   ```
 
-  See http://openlayers.org/en/master/examples/vector-layer.html for a real example.
+  See https://openlayers.org/en/master/examples/vector-layer.html for a real example.
 
   Note that you no longer need to set a `projection` on the source!
 
@@ -75,7 +75,7 @@ The 3.5.0 release includes features and fixes from a whopping 129 pull requests
 
   The above code uses jQuery to send an Ajax request, but you can obviously use any Ajax library.
 
-  See http://openlayers.org/en/master/examples/igc.html for a real example.
+  See https://openlayers.org/en/master/examples/igc.html for a real example.
 
 * Note about KML
 
@@ -133,9 +133,9 @@ The 3.5.0 release includes features and fixes from a whopping 129 pull requests
   });
   ```
 
-  See http://openlayers.org/en/master/examples/vector-osm.html for a real example.
+  See https://openlayers.org/en/master/examples/vector-osm.html for a real example.
 
-* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See http://openlayers.org/en/master/examples/vector-osm.html for an example.
+* The experimental `ol.loadingstrategy.createTile` function has been renamed to `ol.loadingstrategy.tile`. The signature of the function hasn't changed. See https://openlayers.org/en/master/examples/vector-osm.html for an example.
 
 ### Change to `ol.style.Icon`
 

config/examples/example.html

@@ -66,16 +66,16 @@
           <textarea class="hidden" name="css">{{ css.source }}</textarea>
           <textarea class="hidden" name="html">{{ contents }}</textarea>
           <input type="hidden" name="wrap" value="l">
-          <input type="hidden" name="resources" value="http://openlayers.org/en/v{{ olVersion }}/css/ol.css,http://openlayers.org/en/v{{ olVersion }}/build/ol.js{{ extraResources }}">
+          <input type="hidden" name="resources" value="https://openlayers.org/en/v{{ olVersion }}/css/ol.css,https://openlayers.org/en/v{{ olVersion }}/build/ol.js{{ extraResources }}">
         </form>
         <pre><code id="example-source" class="language-markup">&lt;!DOCTYPE html&gt;
 &lt;html&gt;
   &lt;head&gt;
     &lt;title&gt;{{ title }}&lt;/title&gt;
-    &lt;link rel="stylesheet" href="http://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt;
+    &lt;link rel="stylesheet" href="https://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt;
     &lt;!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --&gt;
-    &lt;script src="http://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt;
+    &lt;script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt;
-    &lt;script src="http://openlayers.org/en/v{{ olVersion }}/build/ol.js"&gt;&lt;/script&gt;{{#if extraHead.remote}}
+    &lt;script src="https://openlayers.org/en/v{{ olVersion }}/build/ol.js"&gt;&lt;/script&gt;{{#if extraHead.remote}}
 {{ indent extraHead.remote spaces=4 }}{{/if}}{{#if css.source}}
     &lt;style&gt;
 {{ indent css.source spaces=6 }}    &lt;/style&gt;{{/if}}

doc/errors/index.md

@@ -137,10 +137,6 @@ Invalid `units`. `'degrees'`, `'imperial'`, `'nautical'`, `'metric'` or `'us'` r
 
 Invalid geometry layout. Must be `XY`, `XYZ`, `XYM` or `XYZM`.
 
-### 35
-
-Unknown GeoJSON object type. Expected `"Feature"` or `"FeatureCollection"`.
-
 ### 36
 
 Unknown SRS type. Expected `"name"` or `"EPSG"`.
@@ -165,10 +161,6 @@ Expected `feature` to have a geometry.
 
 Expected an `ol.style.Style` or an array of `ol.style.Style`.
 
-### 42
-
-Expected an `ol.Feature`, but got an `ol.RenderFeature`.
-
 ### 43
 
 Expected `layers` to be an array or an `ol.Collection`.

doc/faq.md

@@ -77,7 +77,7 @@ var map = new ol.Map({
 var swissProjection = new ol.proj.Projection({
   code: 'EPSG:21781',
   // The extent is used to determine zoom level 0. Recommended values for a
-  // projection's validity extent can be found at http://epsg.io/.
+  // projection's validity extent can be found at https://epsg.io/.
   extent: [485869.5728, 76443.1884, 837076.5648, 299941.7864],
   units: 'm'
 });
@@ -94,7 +94,7 @@ var map = new ol.Map({
 ```
 
 We recommend to lookup parameters of your projection (like the validity extent)
-over at [epsg.io](http://epsg.io/).
+over at [epsg.io](https://epsg.io/).
 
 
 ## Why is my map centered on the gulf of guinea (or africa, the ocean, null-island)?

doc/quickstart.hbs

@@ -13,14 +13,14 @@ Below you'll find a complete working example.  Create a new file, copy in the co
 <!doctype html>
 <html lang="en">
   <head>
-    <link rel="stylesheet" href="http://openlayers.org/en/{{ latest }}/css/ol.css" type="text/css">
+    <link rel="stylesheet" href="https://openlayers.org/en/{{ latest }}/css/ol.css" type="text/css">
     <style>
       .map {
         height: 400px;
         width: 100%;
       }
     </style>
-    <script src="http://openlayers.org/en/{{ latest }}/build/ol.js" type="text/javascript"></script>
+    <script src="https://openlayers.org/en/{{ latest }}/build/ol.js" type="text/javascript"></script>
     <title>OpenLayers 3 example</title>
   </head>
   <body>
@@ -55,7 +55,7 @@ To include a map a web page you will need 3 things:
 ### Include OpenLayers
 
 ```xml
-  <script src="http://openlayers.org/en/{{ latest }}/build/ol.js" type="text/javascript"></script>
+  <script src="https://openlayers.org/en/{{ latest }}/build/ol.js" type="text/javascript"></script>
 ```
 
 The first part is to include the JavaScript library. For the purpose of this tutorial, here we simply point to the openlayers.org website to get the whole library. In a production environment, we would build a custom version of the library including only the module needed for our application.
@@ -63,7 +63,7 @@ The first part is to include the JavaScript library. For the purpose of this tut
 **Optional:** If the application is intended to run on old platforms like Internet Explorer or Android 4.x, another script needs to be included before OpenLayers:
 
 ```xml
-  <script src="http://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"></script>
+  <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"></script>
 ```
 
 

doc/tutorials/custom-builds.md

@@ -95,7 +95,7 @@ var map = new ol.Map({
 });
 ```
 
-Note that this JavaScript code corresponds to OpenLayers 3's [`simple`](http://openlayers.org/en/master/examples/simple.html) example.
+Note that this JavaScript code corresponds to OpenLayers 3's [`simple`](https://openlayers.org/en/master/examples/simple.html) example.
 
 You are now ready to create your first OpenLayers 3 build. Use the following command to create the build:
 
@@ -180,7 +180,7 @@ Note that `build.js` currently requires you to enter an output file and will wri
 
 ## A more complicated example
 
-Now let's try a more complicated example: [`heatmaps-earthquakes`](http://openlayers.org/en/master/examples/heatmap-earthquakes.html). The build configuration file looks like this:
+Now let's try a more complicated example: [`heatmaps-earthquakes`](https://openlayers.org/en/master/examples/heatmap-earthquakes.html). The build configuration file looks like this:
 
 ```json
 {

doc/tutorials/raster-reprojection.md

@@ -10,7 +10,7 @@ Transformation of the map projections of the image happens directly in a web bro
 The view in any Proj4js supported coordinate reference system is possible and previously incompatible layers can now be combined and overlaid.
 
 # Usage
-The API usage is very simple. Just specify proper projection (using [EPSG](http://epsg.io) code) on `ol.View`:
+The API usage is very simple. Just specify proper projection (using [EPSG](https://epsg.io) code) on `ol.View`:
 ``` javascript
 var map = new ol.Map({
   target: 'map',
@@ -35,14 +35,14 @@ var map = new ol.Map({
 If a source (based on `ol.source.TileImage` or `ol.source.Image`) has a projection different from the current `ol.View`’s projection then the reprojection happens automatically under the hood.
 
 ### Examples
-- [Raster reprojection demo](http://openlayers.org/en/master/examples/reprojection.html)
+- [Raster reprojection demo](https://openlayers.org/en/master/examples/reprojection.html)
-- [OpenStreetMap to WGS84 reprojection](http://openlayers.org/en/master/examples/reprojection-wgs84.html)
+- [OpenStreetMap to WGS84 reprojection](https://openlayers.org/en/master/examples/reprojection-wgs84.html)
-- [Reprojection with EPSG.io database search](http://openlayers.org/en/master/examples/reprojection-by-code.html)
+- [Reprojection with EPSG.io database search](https://openlayers.org/en/master/examples/reprojection-by-code.html)
-- [Image reprojection](http://openlayers.org/en/master/examples/reprojection-image.html)
+- [Image reprojection](https://openlayers.org/en/master/examples/reprojection-image.html)
 
 ### Custom projection
 The easiest way to use a custom projection is to add the [Proj4js](http://proj4js.org/) library to your project and then define the projection using a proj4 definition string.
-Following example shows definition of a [British National Grid](http://epsg.io/27700):
+Following example shows definition of a [British National Grid](https://epsg.io/27700):
 
 ``` html
 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js"></script>
@@ -122,7 +122,7 @@ Although this is mathematically correct behavior of the inverse transformation,
 A possible general solution would be to calculate the forward transformation for every vertex as well - but this would significantly decrease performance (especially for computationally expensive transformations).
 
 Therefore a recommended workaround is to define a proper visibility extent on the `ol.layer.Tile` in the view projection.
-Setting such a limit is demonstrated in the [reprojection demo example](http://openlayers.org/en/master/examples/reprojection.html).
+Setting such a limit is demonstrated in the [reprojection demo example](https://openlayers.org/en/master/examples/reprojection.html).
 
 ### Resolution calculation
 When determining source tiles to load, the ideal source resolution needs to be calculated.

examples/.eslintrc

@@ -7,6 +7,7 @@
     "d3": false,
     "jsPDF": false,
     "jsts": false,
+    "saveAs": false,
     "topojson": false,
     "turf": false
   },

examples/arcgis-image.js

@@ -5,7 +5,7 @@ goog.require('ol.layer.Image');
 goog.require('ol.source.OSM');
 goog.require('ol.source.ImageArcGISRest');
 
-var url = 'http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/' +
+var url = 'https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/' +
     'Specialty/ESRI_StateCityHighway_USA/MapServer';
 
 var layers = [

examples/arcgis-tiled.js

@@ -4,7 +4,7 @@ goog.require('ol.layer.Tile');
 goog.require('ol.source.OSM');
 goog.require('ol.source.TileArcGISRest');
 
-var url = 'http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/' +
+var url = 'https://sampleserver1.arcgisonline.com/ArcGIS/rest/services/' +
     'Specialty/ESRI_StateCityHighway_USA/MapServer';
 
 var layers = [

examples/canvas-gradient-pattern.js

@@ -1,6 +1,7 @@
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.format.GeoJSON');
+goog.require('ol.has');
 goog.require('ol.layer.Vector');
 goog.require('ol.proj');
 goog.require('ol.source.Vector');
@@ -8,14 +9,22 @@ goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
 
-// Will contain ol.Style instances key by country.
+var canvas = document.createElement('canvas');
-var styleLookup = {};
+var context = canvas.getContext('2d');
+
+// Gradient and pattern are in canvas pixel space, so we adjust for the
+// renderer's pixel ratio
+var pixelRatio = ol.has.DEVICE_PIXEL_RATIO;
 
 // Generate a rainbow gradient
-var gradient = (function() {
+function gradient(feature, resolution) {
-  var canvas = document.createElement('canvas');
+  var extent = feature.getGeometry().getExtent();
-  var context = canvas.getContext('2d');
+  // Gradient starts on the left edge of each feature, and ends on the right.
-  var grad = context.createLinearGradient(0,0,1000,0);
+  // Coordinate origin is [0, 0], so we just divide by resolution and multiply
+  // with pixelRatio to match the renderer's pixel coordinate system.
+  var grad = context.createLinearGradient(
+      extent[0] / resolution * pixelRatio, 0,
+      extent[2] / resolution * pixelRatio, 0);
   grad.addColorStop(0, 'red');
   grad.addColorStop(1 / 6, 'orange');
   grad.addColorStop(2 / 6, 'yellow');
@@ -24,33 +33,35 @@ var gradient = (function() {
   grad.addColorStop(5 / 6, 'blue');
   grad.addColorStop(1, 'purple');
   return grad;
-}());
+}
 
-// Generate a canvasPattern with two circles
+// Generate a canvasPattern with two circles on white background
 var pattern = (function() {
-  var canvas = document.createElement('canvas');
+  canvas.width = 11 * pixelRatio;
-  var context = canvas.getContext('2d');
+  canvas.height = 11 * pixelRatio;
-  canvas.width = 11;
+  // white background
-  canvas.height = 11;
+  context.fillStyle = 'white';
+  context.fillRect(0, 0, canvas.width, canvas.height);
+  // outer circle
   context.fillStyle = 'rgba(102, 0, 102, 0.5)';
   context.beginPath();
-  context.arc(5, 5, 4, 0, 2 * Math.PI);
+  context.arc(5 * pixelRatio, 5 * pixelRatio, 4 * pixelRatio, 0, 2 * Math.PI);
   context.fill();
+  // inner circle
   context.fillStyle = 'rgb(55, 0, 170)';
   context.beginPath();
-  context.arc(5, 5, 2, 0, 2 * Math.PI);
+  context.arc(5 * pixelRatio, 5 * pixelRatio, 2 * pixelRatio, 0, 2 * Math.PI);
   context.fill();
   return context.createPattern(canvas, 'repeat');
 }());
 
-// Generate a background style that all features will reuse
+// Generate style for gradient or pattern fill
-var backgroundStyle = new ol.style.Style({
+var fill = new ol.style.Fill();
+var style = new ol.style.Style({
+  fill: fill,
   stroke: new ol.style.Stroke({
     color: '#333',
     width: 2
-  }),
-  fill: new ol.style.Fill({
-    color: '#fff'
   })
 });
 
@@ -58,33 +69,14 @@ var backgroundStyle = new ol.style.Style({
  * The styling function for the vector layer, will return an array of styles
  * which either contains the aboove gradient or pattern.
  *
- * @param {ol.Feature} feature the feature to style.
+ * @param {ol.Feature} feature The feature to style.
- * @return {Array<ol.style.Style>} the styles to use for the feature.
+ * @param {number} resolution Resolution.
+ * @return {ol.style.Style} The style to use for the feature.
  */
-var getStackedStyle = function(feature) {
+var getStackedStyle = function(feature, resolution) {
   var id = feature.getId();
-  if (!styleLookup[id]) {
+  fill.setColor(id > 'J' ? gradient(feature, resolution) : pattern);
-    var patternOrGradient;
+  return style;
-    if (id > 'J') { // some shall get the gradient, others the pattern.
-      patternOrGradient = gradient;
-    } else {
-      patternOrGradient = pattern;
-    }
-    // Store the style in the lookup, next call will just return the stored
-    // style for the feature.
-    styleLookup[id] = [
-      // 1. Use the common background style
-      //    (white fill and blackish stroke)
-      backgroundStyle,
-      // 2. On top of that, draw the pattern or gradient
-      new ol.style.Style({
-        fill: new ol.style.Fill({
-          color: patternOrGradient
-        })
-      })
-    ];
-  }
-  return styleLookup[id];
 };
 
 // Create a vector layer that makes use of the style function above…

examples/custom-icon.js

@@ -4,7 +4,7 @@ goog.require('ol.layer.Tile');
 goog.require('ol.source.OSM');
 
 var logoElement = document.createElement('a');
-logoElement.href = 'http://www.osgeo.org/';
+logoElement.href = 'https://www.osgeo.org/';
 logoElement.target = '_blank';
 
 var logoImage = document.createElement('img');

examples/data/kml/2012-02-10.kml

@@ -2,9 +2,9 @@
   <Document>
     <name>Skimap.org OpenSkiMap </name>
     <description>Created from OpenStreetMap data. Renderer v0.5</description>
-    <!-- 
+    <!--
 Copyright (c) OpenStreetMap Contributors
-http://www.openstreetmap.org/
+https://www.openstreetmap.org/
 
 This work is licensed under the
 Creative Commons Attribution-ShareAlike 2.0 License.
@@ -13,7 +13,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
     <ScreenOverlay id="CopyrightNotice">
       <name>Copyright Notice</name>
       <description>
-        <![CDATA[The data in this KML file is Copyright <a href="http://www.openstreetmap.org/">OpenStreetMap</a> Contributors. It is available under the <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons Attribution-ShareAlike (CC-BY-SA) Version 2.0 License</a>.]]>
+        <![CDATA[The data in this KML file is Copyright <a href="https://www.openstreetmap.org/">OpenStreetMap</a> Contributors. It is available under the <a href="http://creativecommons.org/licenses/by-sa/2.0/">Creative Commons Attribution-ShareAlike (CC-BY-SA) Version 2.0 License</a>.]]>
       </description>
       <Snippet>Copyright (c) OpenStreetMap Contributors. CC-BY-SA 2.0 License.</Snippet>
       <Icon>
@@ -32,7 +32,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.2</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/shapes/parking_lot.png</href>
+              <href>https://maps.google.com/mapfiles/kml/shapes/parking_lot.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -140,7 +140,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal2/icon21.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal2/icon21.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -170,7 +170,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal2/icon30.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal2/icon30.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -188,7 +188,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal2/icon28.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal2/icon28.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -325,7 +325,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal2/icon40.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal2/icon40.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -548,7 +548,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal3/icon38.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal3/icon38.png</href>
             </Icon>
           </IconStyle>
         </Style>
@@ -559,7 +559,7 @@ http://creativecommons.org/licenses/by-sa/2.0/
           <IconStyle>
             <scale>0.7</scale>
             <Icon>
-              <href>http://maps.google.com/mapfiles/kml/pal3/icon38.png</href>
+              <href>https://maps.google.com/mapfiles/kml/pal3/icon38.png</href>
             </Icon>
           </IconStyle>
         </Style>

examples/draw-features.html

@@ -5,11 +5,8 @@ shortdesc: Example of using the ol.interaction.Draw interaction.
 docs: >
   Example of using the Draw interaction. Select a geometry type from the
   dropdown above to start drawing. To finish drawing, click the last
-  point. To activate freehand drawing for lines and polygons, hold the `Shift`
+  point. To activate freehand drawing for lines, polygons, and circles, hold
-  key. Square drawing is achieved by using Circle mode with a `geometryFunction`
+  the `Shift` key.
-  that creates a 4-sided regular polygon instead of a circle. Box drawing uses a
-  custom `geometryFunction` that takes start and end point of a line with 2
-  points and creates a rectangular box.
 tags: "draw, edit, freehand, vector"
 ---
 <div id="map" class="map"></div>
@@ -20,8 +17,6 @@ tags: "draw, edit, freehand, vector"
     <option value="LineString">LineString</option>
     <option value="Polygon">Polygon</option>
     <option value="Circle">Circle</option>
-    <option value="Square">Square</option>
-    <option value="Box">Box</option>
     <option value="None">None</option>
   </select>
 </form>

examples/draw-features.js

@@ -1,15 +1,10 @@
 goog.require('ol.Map');
 goog.require('ol.View');
-goog.require('ol.geom.Polygon');
 goog.require('ol.interaction.Draw');
 goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.OSM');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Circle');
-goog.require('ol.style.Fill');
-goog.require('ol.style.Stroke');
-goog.require('ol.style.Style');
 
 var raster = new ol.layer.Tile({
   source: new ol.source.OSM()
@@ -18,22 +13,7 @@ var raster = new ol.layer.Tile({
 var source = new ol.source.Vector({wrapX: false});
 
 var vector = new ol.layer.Vector({
-  source: source,
+  source: source
-  style: new ol.style.Style({
-    fill: new ol.style.Fill({
-      color: 'rgba(255, 255, 255, 0.2)'
-    }),
-    stroke: new ol.style.Stroke({
-      color: '#ffcc33',
-      width: 2
-    }),
-    image: new ol.style.Circle({
-      radius: 7,
-      fill: new ol.style.Fill({
-        color: '#ffcc33'
-      })
-    })
-  })
 });
 
 var map = new ol.Map({
@@ -51,30 +31,9 @@ var draw; // global so we can remove it later
 function addInteraction() {
   var value = typeSelect.value;
   if (value !== 'None') {
-    var geometryFunction, maxPoints;
-    if (value === 'Square') {
-      value = 'Circle';
-      geometryFunction = ol.interaction.Draw.createRegularPolygon(4);
-    } else if (value === 'Box') {
-      value = 'LineString';
-      maxPoints = 2;
-      geometryFunction = function(coordinates, geometry) {
-        if (!geometry) {
-          geometry = new ol.geom.Polygon(null);
-        }
-        var start = coordinates[0];
-        var end = coordinates[1];
-        geometry.setCoordinates([
-          [start, [start[0], end[1]], end, [end[0], start[1]], start]
-        ]);
-        return geometry;
-      };
-    }
     draw = new ol.interaction.Draw({
       source: source,
-      type: /** @type {ol.geom.GeometryType} */ (value),
+      type: /** @type {ol.geom.GeometryType} */ (typeSelect.value)
-      geometryFunction: geometryFunction,
-      maxPoints: maxPoints
     });
     map.addInteraction(draw);
   }

examples/draw-freehand.html

@@ -0,0 +1,22 @@
+---
+layout: example.html
+title: Freehand Drawing
+shortdesc: Example using the ol.interaction.Draw interaction in freehand mode.
+docs: >
+  This example demonstrates the `ol.interaction.Draw` in freehand mode.  During
+  freehand drawing, points are added while dragging.  Set `freehand: true` to
+  enable freehand mode.  Note that freehand mode can be conditionally enabled
+  by using the `freehandCondition` option.  For example to toggle freehand mode
+  with the `Shift` key, use `freehandCondition: ol.events.condition.shiftKeyOnly`.
+tags: "draw, edit, freehand, vector"
+---
+<div id="map" class="map"></div>
+<form class="form-inline">
+  <label>Geometry type &nbsp;</label>
+  <select id="type">
+    <option value="LineString">LineString</option>
+    <option value="Polygon">Polygon</option>
+    <option value="Circle">Circle</option>
+    <option value="None">None</option>
+  </select>
+</form>

examples/draw-freehand.js

@@ -0,0 +1,52 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.interaction.Draw');
+goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.OSM');
+goog.require('ol.source.Vector');
+
+var raster = new ol.layer.Tile({
+  source: new ol.source.OSM()
+});
+
+var source = new ol.source.Vector({wrapX: false});
+
+var vector = new ol.layer.Vector({
+  source: source
+});
+
+var map = new ol.Map({
+  layers: [raster, vector],
+  target: 'map',
+  view: new ol.View({
+    center: [-11000000, 4600000],
+    zoom: 4
+  })
+});
+
+var typeSelect = document.getElementById('type');
+
+var draw; // global so we can remove it later
+function addInteraction() {
+  var value = typeSelect.value;
+  if (value !== 'None') {
+    draw = new ol.interaction.Draw({
+      source: source,
+      type: /** @type {ol.geom.GeometryType} */ (typeSelect.value),
+      freehand: true
+    });
+    map.addInteraction(draw);
+  }
+}
+
+
+/**
+ * Handle change event.
+ */
+typeSelect.onchange = function() {
+  map.removeInteraction(draw);
+  addInteraction();
+};
+
+addInteraction();

examples/draw-shapes.html

@@ -0,0 +1,25 @@
+---
+layout: example.html
+title: Draw Shapes
+shortdesc: Using the ol.interaction.Draw to create regular shapes
+docs: >
+  This demonstrates the use of the `geometryFunction` option for the
+  `ol.interaction.Draw`. Select a shape type from the dropdown above to start
+  drawing. To activate freehand drawing, hold the `Shift` key. Square drawing is
+  achieved by using `type: 'Circle'` type with a `geometryFunction` that creates
+  a 4-sided regular polygon instead of a circle. Box drawing uses `type: 'Circle'`
+  with a `geometryFunction` that creates a box-shaped polygon instead of a
+  circle.  Star drawing uses a custom geometry function that coverts a circle
+  into a start using the center and radius provided by the draw interaction.
+tags: "draw, edit, freehand, vector"
+---
+<div id="map" class="map"></div>
+<form class="form-inline">
+  <label>Shape type &nbsp;</label>
+  <select id="type">
+    <option value="Square">Square</option>
+    <option value="Box">Box</option>
+    <option value="Star">Star</option>
+    <option value="None">None</option>
+  </select>
+</form>

examples/draw-shapes.js

@@ -0,0 +1,86 @@
+goog.require('ol.Map');
+goog.require('ol.View');
+goog.require('ol.geom.Polygon');
+goog.require('ol.interaction.Draw');
+goog.require('ol.layer.Tile');
+goog.require('ol.layer.Vector');
+goog.require('ol.source.OSM');
+goog.require('ol.source.Vector');
+
+var raster = new ol.layer.Tile({
+  source: new ol.source.OSM()
+});
+
+var source = new ol.source.Vector({wrapX: false});
+
+var vector = new ol.layer.Vector({
+  source: source
+});
+
+var map = new ol.Map({
+  layers: [raster, vector],
+  target: 'map',
+  view: new ol.View({
+    center: [-11000000, 4600000],
+    zoom: 4
+  })
+});
+
+var typeSelect = document.getElementById('type');
+
+var draw; // global so we can remove it later
+function addInteraction() {
+  var value = typeSelect.value;
+  if (value !== 'None') {
+    var geometryFunction;
+    if (value === 'Square') {
+      value = 'Circle';
+      geometryFunction = ol.interaction.Draw.createRegularPolygon(4);
+    } else if (value === 'Box') {
+      value = 'Circle';
+      geometryFunction = ol.interaction.Draw.createBox();
+    } else if (value === 'Star') {
+      value = 'Circle';
+      geometryFunction = function(coordinates, geometry) {
+        if (!geometry) {
+          geometry = new ol.geom.Polygon(null);
+        }
+        var center = coordinates[0];
+        var last = coordinates[1];
+        var dx = center[0] - last[0];
+        var dy = center[1] - last[1];
+        var radius = Math.sqrt(dx * dx + dy * dy);
+        var rotation = Math.atan2(dy, dx);
+        var newCoordinates = [];
+        var numPoints = 12;
+        for (var i = 0; i < numPoints; ++i) {
+          var angle = rotation + i * 2 * Math.PI / numPoints;
+          var fraction = i % 2 === 0 ? 1 : 0.5;
+          var offsetX = radius * fraction * Math.cos(angle);
+          var offsetY = radius * fraction * Math.sin(angle);
+          newCoordinates.push([center[0] + offsetX, center[1] + offsetY]);
+        }
+        newCoordinates.push(newCoordinates[0].slice());
+        geometry.setCoordinates([newCoordinates]);
+        return geometry;
+      };
+    }
+    draw = new ol.interaction.Draw({
+      source: source,
+      type: /** @type {ol.geom.GeometryType} */ (value),
+      geometryFunction: geometryFunction
+    });
+    map.addInteraction(draw);
+  }
+}
+
+
+/**
+ * Handle change event.
+ */
+typeSelect.onchange = function() {
+  map.removeInteraction(draw);
+  addInteraction();
+};
+
+addInteraction();

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.boundlessgeo.com/geoserver/wms',
+      url: 'https://ahocevar.com/geoserver/wms',
       params: {
         'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
       }

examples/export-map.html

@@ -3,12 +3,12 @@ layout: example.html
 title: Map Export
 shortdesc: Example of exporting a map as a PNG image.
 docs: >
-  Example of exporting a map as a PNG image.
+  Example of exporting a map as a PNG image. This example requires a browser
+  that supports <a href="https://developer.mozilla.org/de/docs/Web/API/HTMLCanvasElement/toBlob#Browser_compatibility">
+  <code>canvas.toBlob()</code></a>.
 tags: "export, png, openstreetmap"
+resources:
+  - https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.3/FileSaver.min.js
 ---
 <div id="map" class="map"></div>
-<div id="no-download" class="alert alert-danger" style="display: none">
+<a id="export-png" class="btn btn-default"><i class="fa fa-download"></i> Download PNG</a>
-  This example requires a browser that supports the
-  <a href="http://caniuse.com/#feat=download">link download</a> attribute.
-</div>
-<a id="export-png" class="btn btn-default" download="map.png"><i class="fa fa-download"></i> Download PNG</a>

examples/export-map.js

@@ -1,3 +1,5 @@
+// NOCOMPILE
+// this example uses FileSaver.js for which we don't have an externs file.
 goog.require('ol.Map');
 goog.require('ol.View');
 goog.require('ol.control');
@@ -31,20 +33,12 @@ var map = new ol.Map({
   })
 });
 
-var exportPNGElement = document.getElementById('export-png');
+document.getElementById('export-png').addEventListener('click', function() {
-
+  map.once('postcompose', function(event) {
-if ('download' in exportPNGElement) {
+    var canvas = event.context.canvas;
-  exportPNGElement.addEventListener('click', function() {
+    canvas.toBlob(function(blob) {
-    map.once('postcompose', function(event) {
+      saveAs(blob, 'map.png');
-      var canvas = event.context.canvas;
-      exportPNGElement.href = canvas.toDataURL('image/png');
     });
-    map.renderSync();
+  });
-  }, false);
+  map.renderSync();
-} else {
+});
-  var info = document.getElementById('no-download');
-  /**
-   * display error message
-   */
-  info.style.display = '';
-}

examples/geolocation-orientation.html

@@ -44,7 +44,6 @@ tags: "fullscreen, geolocation, orientation, mobile"
         <button id="geolocate">Geolocate Me!</button>
         <button id="simulate">Simulate</button>
     </div>
-    <script src="http://code.jquery.com/jquery-2.2.3.min.js" type="text/javascript"></script>
     <script src="./resources/common.js" type="text/javascript"></script>
     <script src="loader.js?id=geolocation-orientation" type="text/javascript"></script>
   </body>

examples/getfeatureinfo-image.js

@@ -5,7 +5,7 @@ goog.require('ol.source.ImageWMS');
 
 
 var wmsSource = new ol.source.ImageWMS({
-  url: 'http://demo.boundlessgeo.com/geoserver/wms',
+  url: 'https://ahocevar.com/geoserver/wms',
   params: {'LAYERS': 'ne:ne'},
   serverType: 'geoserver',
   crossOrigin: 'anonymous'

examples/getfeatureinfo-tile.js

@@ -5,7 +5,7 @@ goog.require('ol.source.TileWMS');
 
 
 var wmsSource = new ol.source.TileWMS({
-  url: 'http://demo.boundlessgeo.com/geoserver/wms',
+  url: 'https://ahocevar.com/geoserver/wms',
   params: {'LAYERS': 'ne:ne'},
   serverType: 'geoserver',
   crossOrigin: 'anonymous'

examples/igc.html

@@ -3,7 +3,7 @@ layout: example.html
 title: IGC Data
 shortdesc: Example of tracks recorded from multiple paraglider flights on the same day, read from an IGC file.
 docs: >
-  <p>The five tracks contain a total of 49,707 unique coordinates. Zoom in to see more detail. The background layer is from <a href="http://www.opencyclemap.org/">OpenCycleMap</a>.</p>
+  <p>The five tracks contain a total of 49,707 unique coordinates. Zoom in to see more detail. The background layer is from <a href="https://www.opencyclemap.org/">OpenCycleMap</a>.</p>
 tags: "complex-geometry, closest-feature, igc, opencyclemap"
 ---
 <div id="map" class="map"></div>

examples/igc.js

@@ -85,10 +85,10 @@ var map = new ol.Map({
     new ol.layer.Tile({
       source: new ol.source.OSM({
         attributions: [
-          'All maps © <a href="http://www.opencyclemap.org/">OpenCycleMap</a>',
+          'All maps © <a href="https://www.opencyclemap.org/">OpenCycleMap</a>',
           ol.source.OSM.ATTRIBUTION
         ],
-        url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
+        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
       })
     }),
     new ol.layer.Vector({

examples/image-load-events.js

@@ -78,7 +78,7 @@ Progress.prototype.hide = function() {
 var progress = new Progress(document.getElementById('progress'));
 
 var source = new ol.source.ImageWMS({
-  url: 'http://demo.boundlessgeo.com/geoserver/wms',
+  url: 'https://ahocevar.com/geoserver/wms',
   params: {'LAYERS': 'topp:states'},
   serverType: 'geoserver'
 });

examples/localized-openstreetmap.html

@@ -3,7 +3,7 @@ layout: example.html
 title: Localized OpenStreetMap
 shortdesc: Example of a localized OpenStreetMap map with a custom tile server and a custom attribution.
 docs: >
-  <p>The base layer is <a href="http://www.opencyclemap.org/">OpenCycleMap</a> with an overlay from <a href="http://www.openseamap.org/">OpenSeaMap</a>.
+  <p>The base layer is <a href="https://www.opencyclemap.org/">OpenCycleMap</a> with an overlay from <a href="http://www.openseamap.org/">OpenSeaMap</a>.
 tags: "localized-openstreetmap, openseamap, openstreetmap"
 ---
 <div id="map" class="map"></div>

examples/localized-openstreetmap.js

@@ -8,10 +8,10 @@ goog.require('ol.source.OSM');
 var openCycleMapLayer = new ol.layer.Tile({
   source: new ol.source.OSM({
     attributions: [
-      'All maps © <a href="http://www.opencyclemap.org/">OpenCycleMap</a>',
+      'All maps © <a href="https://www.opencyclemap.org/">OpenCycleMap</a>',
       ol.source.OSM.ATTRIBUTION
     ],
-    url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
+    url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
   })
 });
 
@@ -22,7 +22,7 @@ var openSeaMapLayer = new ol.layer.Tile({
       ol.source.OSM.ATTRIBUTION
     ],
     opaque: false,
-    url: 'http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png'
+    url: 'https://tiles.openseamap.org/seamark/{z}/{x}/{y}.png'
   })
 });
 

examples/mapbox-vector-tiles-advanced.js

@@ -47,7 +47,7 @@ var map = new ol.Map({
       preload: Infinity,
       source: new ol.source.VectorTile({
         attributions: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
-          '© <a href="http://www.openstreetmap.org/copyright">' +
+          '© <a href="https://www.openstreetmap.org/copyright">' +
           'OpenStreetMap contributors</a>',
         format: new ol.format.MVT(),
         tileGrid: new ol.tilegrid.TileGrid({

examples/mapbox-vector-tiles.js

@@ -20,7 +20,7 @@ var map = new ol.Map({
     new ol.layer.VectorTile({
       source: new ol.source.VectorTile({
         attributions: '© <a href="https://www.mapbox.com/map-feedback/">Mapbox</a> ' +
-          '© <a href="http://www.openstreetmap.org/copyright">' +
+          '© <a href="https://www.openstreetmap.org/copyright">' +
           'OpenStreetMap contributors</a>',
         format: new ol.format.MVT(),
         tileGrid: ol.tilegrid.createXYZ({maxZoom: 22}),

examples/osm-vector-tiles.js

@@ -42,7 +42,7 @@ var map = new ol.Map({
         attributions: attribution,
         format: format,
         tileGrid: tileGrid,
-        url: 'https://vector.mapzen.com/osm/water/{z}/{x}/{y}.topojson?api_key=' + key
+        url: 'https://tile.mapzen.com/mapzen/vector/v1/water/{z}/{x}/{y}.topojson?api_key=' + key
       }),
       style: new ol.style.Style({
         fill: new ol.style.Fill({
@@ -55,7 +55,7 @@ var map = new ol.Map({
         attributions: attribution,
         format: format,
         tileGrid: tileGrid,
-        url: 'https://vector.mapzen.com/osm/roads/{z}/{x}/{y}.topojson?api_key=' + key
+        url: 'https://tile.mapzen.com/mapzen/vector/v1/roads/{z}/{x}/{y}.topojson?api_key=' + key
       }),
       style: function(feature) {
         var kind = feature.get('kind');
@@ -89,7 +89,7 @@ var map = new ol.Map({
         attributions: attribution,
         format: format,
         tileGrid: tileGrid,
-        url: 'https://vector.mapzen.com/osm/buildings/{z}/{x}/{y}.topojson?api_key=' + key
+        url: 'https://tile.mapzen.com/mapzen/vector/v1/buildings/{z}/{x}/{y}.topojson?api_key=' + key
       }),
       style: function(f, resolution) {
         return (resolution < 10) ? buildingStyle : null;

examples/overviewmap-custom.js

@@ -14,7 +14,7 @@ var overviewMapControl = new ol.control.OverviewMap({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.OSM({
-        'url': 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
+        'url': 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
       })
     })
   ],

examples/reprojection-by-code.html

@@ -5,10 +5,10 @@ shortdesc: Demonstrates client-side raster reprojection of OSM to arbitrary proj
 docs: >
   This example shows client-side raster reprojection capabilities from
   OSM (EPSG:3857) to arbitrary projection by searching
-  in <a href="http://epsg.io/">EPSG.io</a> database.
+  in <a href="https://epsg.io/">EPSG.io</a> database.
 tags: "reprojection, projection, proj4js, epsg.io"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
 ---
 <div id="map" class="map"></div>
 <form class="form-inline">

examples/reprojection-by-code.js

@@ -63,7 +63,7 @@ function setProjection(code, name, proj4def, bbox) {
 
 function search(query) {
   resultSpan.innerHTML = 'Searching ...';
-  fetch('http://epsg.io/?format=json&q=' + query).then(function(response) {
+  fetch('https://epsg.io/?format=json&q=' + query).then(function(response) {
     return response.json();
   }).then(function(json) {
     var results = json['results'];

examples/reprojection-image.html

@@ -6,6 +6,6 @@ docs: >
   This example shows client-side reprojection of single image source.
 tags: "reprojection, projection, proj4js, image, imagestatic"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
 ---
 <div id="map" class="map"></div>

examples/reprojection-image.js

@@ -21,7 +21,7 @@ var map = new ol.Map({
     }),
     new ol.layer.Image({
       source: new ol.source.ImageStatic({
-        url: 'http://upload.wikimedia.org/wikipedia/commons/thumb/1/18/' +
+        url: 'https://upload.wikimedia.org/wikipedia/commons/thumb/1/18/' +
                'British_National_Grid.svg/2000px-British_National_Grid.svg.png',
         crossOrigin: '',
         projection: 'EPSG:27700',

examples/reprojection.html

@@ -6,7 +6,7 @@ docs: >
   This example shows client-side raster reprojection between various projections.
 tags: "reprojection, projection, proj4js, osm, wms, wmts, hidpi"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
 ---
 <div id="map" class="map"></div>
 <form class="form-inline">

examples/reprojection.js

@@ -69,7 +69,7 @@ layers['osm'] = new ol.layer.Tile({
 
 layers['wms4326'] = new ol.layer.Tile({
   source: new ol.source.TileWMS({
-    url: 'http://demo.boundlessgeo.com/geoserver/wms',
+    url: 'https://ahocevar.com/geoserver/wms',
     crossOrigin: '',
     params: {
       'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
@@ -93,7 +93,7 @@ layers['wms21781'] = new ol.layer.Tile({
 });
 
 var parser = new ol.format.WMTSCapabilities();
-var url = 'http://map1.vis.earthdata.nasa.gov/wmts-arctic/' +
+var url = 'https://map1.vis.earthdata.nasa.gov/wmts-arctic/' +
     'wmts.cgi?SERVICE=WMTS&request=GetCapabilities';
 fetch(url).then(function(response) {
   return response.text();
@@ -129,7 +129,7 @@ for (var i = 0, ii = resolutions.length; i < ii; ++i) {
 
 layers['states'] = new ol.layer.Tile({
   source: new ol.source.TileWMS({
-    url: 'http://demo.boundlessgeo.com/geoserver/wms',
+    url: 'https://ahocevar.com/geoserver/wms',
     crossOrigin: '',
     params: {'LAYERS': 'topp:states', 'TILED': true},
     serverType: 'geoserver',

examples/scaleline-indiana-east.html

@@ -6,6 +6,6 @@ docs: >
   This example shows client-side reprojection of OpenStreetMap to NAD83 Indiana East, including a ScaleLine control with US units.
 tags: "reprojection, projection, openstreetmap, nad83, tile, scaleline"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
 ---
 <div id="map" class="map"></div>

examples/sphere-mollweide.html

@@ -6,6 +6,6 @@ docs: >
   Example of a Sphere Mollweide map with a Graticule component.
 tags: "graticule, Mollweide, projection, proj4js"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
 ---
 <div id="map" class="map"></div>

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.boundlessgeo.com/geoserver/wms',
+        url: 'https://ahocevar.com/geoserver/wms',
         params: {
           'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
         }
@@ -40,7 +40,7 @@ var map3857 = new ol.Map({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.TileWMS({
-        url: 'http://demo.boundlessgeo.com/geoserver/wms',
+        url: 'https://ahocevar.com/geoserver/wms',
         params: {
           'LAYERS': 'ne:NE1_HR_LC_SR_W_DR'
         }

examples/vector-esri-edit.js

@@ -14,7 +14,7 @@ goog.require('ol.source.XYZ');
 goog.require('ol.tilegrid');
 
 
-var serviceUrl = 'http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/' +
+var serviceUrl = 'https://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/' +
     'services/PDX_Pedestrian_Districts/FeatureServer/';
 var layer = '0';
 
@@ -55,7 +55,7 @@ var vector = new ol.layer.Vector({
 
 var raster = new ol.layer.Tile({
   source: new ol.source.XYZ({
-    attributions: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
+    attributions: 'Tiles © <a href="https://services.arcgisonline.com/ArcGIS/' +
         'rest/services/World_Topo_Map/MapServer">ArcGIS</a>',
     url: 'https://server.arcgisonline.com/ArcGIS/rest/services/' +
         'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'

examples/vector-esri.js

@@ -13,7 +13,7 @@ goog.require('ol.style.Style');
 goog.require('ol.tilegrid');
 
 
-var serviceUrl = 'http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/' +
+var serviceUrl = 'https://sampleserver3.arcgisonline.com/ArcGIS/rest/services/' +
     'Petroleum/KSFields/FeatureServer/';
 var layer = '0';
 
@@ -97,7 +97,7 @@ var vector = new ol.layer.Vector({
 
 var raster = new ol.layer.Tile({
   source: new ol.source.XYZ({
-    attributions: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
+    attributions: 'Tiles © <a href="https://services.arcgisonline.com/ArcGIS/' +
         'rest/services/World_Topo_Map/MapServer">ArcGIS</a>',
     url: 'https://server.arcgisonline.com/ArcGIS/rest/services/' +
         'World_Topo_Map/MapServer/tile/{z}/{y}/{x}'

examples/vector-osm.html

@@ -3,8 +3,8 @@ layout: example.html
 title: OSM XML
 shortdesc: Example of using the OSM XML source.
 docs: >
- OSM XML vector data is loaded dynamically from a server using a tiling strategy.
+ OSM XML vector data is loaded dynamically from a the [Overpass API](http://overpass-api.de) using a bbox strategy. Note that panning and zooming will eventually lead to "Too many requests" errors from the Overpass API.
-tags: "vector, osm, xml, loading, server"
+tags: "vector, osmxml, loading, server, strategy, bbox"
 cloak:
   AkGbxXx6tDWf1swIhPJyoAVp06H0s0gDTYslNWWHZ6RoPqMpB9ld5FY1WutX8UoF: Your Bing Maps Key from http://www.bingmapsportal.com/ here
 ---

examples/vector-osm.js

@@ -12,7 +12,8 @@ goog.require('ol.style.Circle');
 goog.require('ol.style.Fill');
 goog.require('ol.style.Stroke');
 goog.require('ol.style.Style');
-goog.require('ol.tilegrid');
+
+var map;
 
 var styles = {
   'amenity': {
@@ -78,15 +79,24 @@ var styles = {
 
 var vectorSource = new ol.source.Vector({
   format: new ol.format.OSMXML(),
-  url: function(extent, resolution, projection) {
+  loader: function(extent, resolution, projection) {
     var epsg4326Extent =
         ol.proj.transformExtent(extent, projection, 'EPSG:4326');
-    return 'http://overpass-api.de/api/xapi?map?bbox=' +
+    var client = new XMLHttpRequest();
-        epsg4326Extent.join(',');
+    client.open('POST', 'https://overpass-api.de/api/interpreter');
+    client.addEventListener('load', function() {
+      var features = new ol.format.OSMXML().readFeatures(client.responseText, {
+        featureProjection: map.getView().getProjection()
+      });
+      vectorSource.addFeatures(features);
+    });
+    var query = '(node(' +
+        epsg4326Extent[1] + ',' + epsg4326Extent[0] + ',' +
+        epsg4326Extent[3] + ',' + epsg4326Extent[2] +
+        ');rel(bn)->.foo;way(bn);node(w)->.foo;rel(bw););out meta;';
+    client.send(query);
   },
-  strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
+  strategy: ol.loadingstrategy.bbox
-    maxZoom: 19
-  }))
 });
 
 var vector = new ol.layer.Vector({
@@ -113,7 +123,7 @@ var raster = new ol.layer.Tile({
   })
 });
 
-var map = new ol.Map({
+map = new ol.Map({
   layers: [raster, vector],
   target: document.getElementById('map'),
   controls: ol.control.defaults({

examples/vector-wfs-getfeature.js

@@ -53,7 +53,7 @@ var featureRequest = new ol.format.WFS().writeGetFeature({
 });
 
 // then post the request and add the received features to a layer
-fetch('http://demo.boundlessgeo.com/geoserver/wfs', {
+fetch('https://ahocevar.com/geoserver/wfs', {
   method: 'POST',
   body: new XMLSerializer().serializeToString(featureRequest)
 }).then(function(response) {

examples/vector-wfs.js

@@ -13,7 +13,7 @@ goog.require('ol.style.Style');
 var vectorSource = new ol.source.Vector({
   format: new ol.format.GeoJSON(),
   url: function(extent) {
-    return 'http://demo.boundlessgeo.com/geoserver/wfs?service=WFS&' +
+    return 'https://ahocevar.com/geoserver/wfs?service=WFS&' +
         'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
         'outputFormat=application/json&srsname=EPSG:3857&' +
         'bbox=' + extent.join(',') + ',EPSG:3857';

examples/wms-custom-proj.js

@@ -16,7 +16,7 @@ goog.require('ol.source.TileWMS');
 var projection = new ol.proj.Projection({
   code: 'EPSG:21781',
   // The extent is used to determine zoom level 0. Recommended values for a
-  // projection's validity extent can be found at http://epsg.io/.
+  // projection's validity extent can be found at https://epsg.io/.
   extent: [485869.5728, 76443.1884, 837076.5648, 299941.7864],
   units: 'm'
 });

examples/wms-custom-tilegrid-512x256.js

@@ -26,7 +26,7 @@ var layers = [
   }),
   new ol.layer.Tile({
     source: new ol.source.TileWMS({
-      url: 'http://demo.boundlessgeo.com/geoserver/wms',
+      url: 'https://ahocevar.com/geoserver/wms',
       params: {'LAYERS': 'topp:states', 'TILED': true},
       serverType: 'geoserver',
       tileGrid: tileGrid

examples/wms-image-custom-proj.html

@@ -6,7 +6,7 @@ docs: >
   With [Proj4js](http://proj4js.org/) integration, OpenLayers can transform coordinates between arbitrary projections.
 tags: "wms, single image, proj4js, projection"
 resources:
-  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.14/proj4.js
+  - https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.15/proj4.js
   - https://epsg.io/21781-1753.js
 ---
 <div id="map" class="map"></div>

examples/wms-image-custom-proj.js

@@ -17,7 +17,7 @@ goog.require('ol.source.ImageWMS');
 //
 // Note that we are setting the projection's extent here, which is used to
 // determine the view resolution for zoom level 0. Recommended values for a
-// projection's validity extent can be found at http://epsg.io/.
+// projection's validity extent can be found at https://epsg.io/.
 //
 // If you use Proj4js only to transform coordinates, you don't even need to
 // create an ol.proj.Projection instance. ol.proj.get() will take care of it

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.boundlessgeo.com/geoserver/wms',
+      url: 'https://ahocevar.com/geoserver/wms',
       params: {'LAYERS': 'topp:states'},
       serverType: 'geoserver'
     })

examples/wms-tiled-wrap-180.js

@@ -11,7 +11,7 @@ var layers = [
   }),
   new ol.layer.Tile({
     source: new ol.source.TileWMS({
-      url: 'http://demo.boundlessgeo.com/geoserver/ne/wms',
+      url: 'https://ahocevar.com/geoserver/ne/wms',
       params: {'LAYERS': 'ne:ne_10m_admin_0_countries', 'TILED': true},
       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({
-      url: 'http://demo.boundlessgeo.com/geoserver/wms',
+      url: 'https://ahocevar.com/geoserver/wms',
       params: {'LAYERS': 'topp:states', 'TILED': true},
       serverType: 'geoserver'
     })

examples/wms-time.js

@@ -25,7 +25,7 @@ var layers = [
     extent: extent,
     source: new ol.source.TileWMS(/** @type {olx.source.TileWMSOptions} */ ({
       attributions: ['Iowa State University'],
-      url: 'http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r-t.cgi',
+      url: 'https://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r-t.cgi',
       params: {'LAYERS': 'nexrad-n0r-wmst'}
     }))
   })

examples/wmts-ign.js

@@ -52,7 +52,7 @@ var ign_source = new ol.source.WMTS({
   style: 'normal',
   attributions: [new ol.Attribution({
     html: '<a href="http://www.geoportail.fr/" target="_blank">' +
-        '<img src="http://api.ign.fr/geoportail/api/js/latest/' +
+        '<img src="https://api.ign.fr/geoportail/api/js/latest/' +
         'theme/geoportal/img/logo_gp.gif"></a>'
   })]
 });

examples/wmts.js

@@ -29,7 +29,7 @@ var map = new ol.Map({
     new ol.layer.Tile({
       opacity: 0.7,
       source: new ol.source.WMTS({
-        attributions: 'Tiles © <a href="http://services.arcgisonline.com/arcgis/rest/' +
+        attributions: 'Tiles © <a href="https://services.arcgisonline.com/arcgis/rest/' +
             'services/Demographics/USA_Population_Density/MapServer/">ArcGIS</a>',
         url: 'https://services.arcgisonline.com/arcgis/rest/' +
             'services/Demographics/USA_Population_Density/MapServer/WMTS/',

examples/xyz-esri-4326-512.js

@@ -14,7 +14,7 @@ var projection = ol.proj.get('EPSG:4326');
 // The tile size supported by the ArcGIS tile service.
 var tileSize = 512;
 
-var urlTemplate = 'http://services.arcgisonline.com/arcgis/rest/services/' +
+var urlTemplate = 'https://services.arcgisonline.com/arcgis/rest/services/' +
     'ESRI_Imagery_World_2D/MapServer/tile/{z}/{y}/{x}';
 
 var map = new ol.Map({

examples/xyz-esri.js

@@ -7,7 +7,7 @@ goog.require('ol.source.XYZ');
 
 
 var attribution = new ol.Attribution({
-  html: 'Tiles © <a href="http://services.arcgisonline.com/ArcGIS/' +
+  html: 'Tiles © <a href="https://services.arcgisonline.com/ArcGIS/' +
       'rest/services/World_Topo_Map/MapServer">ArcGIS</a>'
 });
 

examples/xyz.js

@@ -9,7 +9,7 @@ var map = new ol.Map({
   layers: [
     new ol.layer.Tile({
       source: new ol.source.XYZ({
-        url: 'http://{a-c}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png'
+        url: 'https://{a-c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png'
       })
     })
   ],

externs/olx.js

@@ -888,7 +888,7 @@ olx.control.AttributionOptions.prototype.target;
 /**
  * Specify if attributions can be collapsed. If you use an OSM source,
  * should be set to `false` — see
- * {@link http://www.openstreetmap.org/copyright OSM Copyright} —
+ * {@link https://www.openstreetmap.org/copyright OSM Copyright} —
  * Default is `true`.
  * @type {boolean|undefined}
  * @api
@@ -1666,7 +1666,8 @@ olx.format.WriteOptions.prototype.decimals;
 
 /**
  * @typedef {{defaultDataProjection: ol.ProjectionLike,
- *     geometryName: (string|undefined)}}
+ *     geometryName: (string|undefined),
+ *     featureProjection: ol.ProjectionLike}}
  */
 olx.format.GeoJSONOptions;
 
@@ -1679,6 +1680,15 @@ olx.format.GeoJSONOptions;
 olx.format.GeoJSONOptions.prototype.defaultDataProjection;
 
 
+/**
+ * Projection for features read or written by the format.  Options passed to
+ * read or write methods will take precedence.
+ * @type {ol.ProjectionLike}
+ * @api stable
+ */
+olx.format.GeoJSONOptions.prototype.featureProjection;
+
+
 /**
  * Geometry name to use when creating features.
  * @type {string|undefined}
@@ -2572,6 +2582,7 @@ olx.interaction.DragZoomOptions.prototype.out;
  *     geometryFunction: (ol.DrawGeometryFunctionType|undefined),
  *     geometryName: (string|undefined),
  *     condition: (ol.EventsConditionType|undefined),
+ *     freehand: (boolean|undefined),
  *     freehandCondition: (ol.EventsConditionType|undefined),
  *     wrapX: (boolean|undefined)}}
  */
@@ -2685,6 +2696,16 @@ olx.interaction.DrawOptions.prototype.geometryName;
 olx.interaction.DrawOptions.prototype.condition;
 
 
+/**
+ * Operate in freehand mode for lines, polygons, and circles.  This makes the
+ * interaction always operate in freehand mode and takes precedence over any
+ * `freehandCondition` option.
+ * @type {boolean|undefined}
+ * @api
+ */
+olx.interaction.DrawOptions.prototype.freehand;
+
+
 /**
  * Condition that activates freehand drawing for lines and polygons. This
  * function takes an {@link ol.MapBrowserEvent} and returns a boolean to

package.json

@@ -1,13 +1,13 @@
 {
   "name": "openlayers",
-  "version": "3.19.0-beta.1",
+  "version": "3.19.0",
   "description": "Build tools and sources for developing OpenLayers based mapping applications",
   "keywords": [
     "map",
     "mapping",
     "ol3"
   ],
-  "homepage": "http://openlayers.org/",
+  "homepage": "https://openlayers.org/",
   "scripts": {
     "install": "node tasks/install.js",
     "postinstall": "closure-util update",
@@ -30,19 +30,19 @@
     "css/ol.css"
   ],
   "dependencies": {
-    "async": "2.0.1",
+    "async": "2.1.2",
     "browserify": "13.1.0",
     "closure-util": "1.15.1",
     "derequire": "2.0.3",
     "fs-extra": "0.30.0",
     "glob": "7.1.0",
     "handlebars": "4.0.5",
-    "jsdoc": "3.4.1",
+    "jsdoc": "3.4.2",
     "marked": "0.3.6",
     "metalsmith": "2.2.0",
     "metalsmith-layouts": "1.6.5",
     "nomnom": "1.8.1",
-    "pbf": "3.0.1",
+    "pbf": "3.0.2",
     "pixelworks": "1.1.0",
     "rbush": "2.0.1",
     "temp": "0.8.3",
@@ -53,19 +53,19 @@
     "clean-css": "3.4.20",
     "coveralls": "2.11.14",
     "debounce": "^1.0.0",
-    "eslint": "3.6.0",
+    "eslint": "3.8.1",
     "eslint-config-openlayers": "5.0.0",
     "eslint-plugin-openlayers-internal": "2.2.0",
     "expect.js": "0.3.1",
     "gaze": "^1.0.0",
     "istanbul": "0.4.5",
-    "jquery": "3.1.0",
+    "jquery": "3.1.1",
-    "mocha": "3.0.2",
+    "mocha": "3.1.2",
     "mocha-phantomjs-core": "^1.3.0",
     "mustache": "2.2.1",
-    "phantomjs-prebuilt": "2.1.12",
+    "phantomjs-prebuilt": "2.1.13",
     "proj4": "2.3.15",
-    "resemblejs": "2.2.1",
+    "resemblejs": "2.2.2",
     "serve-files": "1.0.0",
     "sinon": "1.17.6",
     "slimerjs": "0.906.2"

src/ol/assertionerror.js

@@ -17,12 +17,12 @@ ol.AssertionError = function(code) {
    * @type {string}
    */
   this.message = 'Assertion failed. See ' +
-      (ol.VERSION ? 'http://openlayers.org/en/' + ol.VERSION.split('-')[0] : '') +
+      (ol.VERSION ? 'https://openlayers.org/en/' + ol.VERSION.split('-')[0] : '') +
       '/doc/errors/#' + code + ' for details.';
 
   /**
    * Error code. The meaning of the code can be found on
-   * {@link http://openlayers.org/en/latest/errors.html} (replace `latest` with
+   * {@link https://openlayers.org/en/latest/errors.html} (replace `latest` with
    * the version found in the OpenLayers script's header comment if a version
    * other than the latest is used).
    * @type {number}

src/ol/attribution.js

@@ -15,7 +15,7 @@ goog.require('ol.tilegrid');
  *       attributions: [
  *         new ol.Attribution({
  *           html: 'All maps © ' +
- *               '<a href="http://www.opencyclemap.org/">OpenCycleMap</a>'
+ *               '<a href="https://www.opencyclemap.org/">OpenCycleMap</a>'
  *         }),
  *         ol.source.OSM.ATTRIBUTION
  *       ],

src/ol/feature.js

@@ -170,8 +170,8 @@ ol.Feature.prototype.getGeometryName = function() {
 
 
 /**
- * Get the feature's style.  This return for this method depends on what was
+ * Get the feature's style. Will return what was provided to the
- * provided to the {@link ol.Feature#setStyle} method.
+ * {@link ol.Feature#setStyle} method.
  * @return {ol.style.Style|Array.<ol.style.Style>|
  *     ol.FeatureStyleFunction} The feature style.
  * @api stable

src/ol/format/feature.js

@@ -1,6 +1,7 @@
 goog.provide('ol.format.Feature');
 
 goog.require('ol.geom.Geometry');
+goog.require('ol.obj');
 goog.require('ol.proj');
 
 
@@ -24,6 +25,12 @@ ol.format.Feature = function() {
    */
   this.defaultDataProjection = null;
 
+  /**
+   * @protected
+   * @type {ol.proj.Projection}
+   */
+  this.defaultFeatureProjection = null;
+
 };
 
 
@@ -64,19 +71,10 @@ ol.format.Feature.prototype.getReadOptions = function(source, opt_options) {
  *     Updated options.
  */
 ol.format.Feature.prototype.adaptOptions = function(options) {
-  var updatedOptions;
+  return ol.obj.assign({
-  if (options) {
+    dataProjection: this.defaultDataProjection,
-    updatedOptions = {
+    featureProjection: this.defaultFeatureProjection
-      featureProjection: options.featureProjection,
+  }, options);
-      dataProjection: options.dataProjection ?
-          options.dataProjection : this.defaultDataProjection,
-      rightHanded: options.rightHanded
-    };
-    if (options.decimals) {
-      updatedOptions.decimals = options.decimals;
-    }
-  }
-  return updatedOptions;
 };
 
 

src/ol/format/geojson.js

@@ -42,6 +42,10 @@ ol.format.GeoJSON = function(opt_options) {
           options.defaultDataProjection : 'EPSG:4326');
 
 
+  if (options.featureProjection) {
+    this.defaultFeatureProjection = ol.proj.get(options.featureProjection);
+  }
+
   /**
    * Name of the geometry attribute for features.
    * @type {string|undefined}
@@ -353,8 +357,9 @@ ol.format.GeoJSON.prototype.getExtensions = function() {
 
 
 /**
- * Read a feature from a GeoJSON Feature source.  Only works for Feature,
+ * Read a feature from a GeoJSON Feature source.  Only works for Feature or
- * use `readFeatures` to read FeatureCollection source.
+ * geometry types.  Use {@link ol.format.GeoJSON#readFeatures} to read
+ * FeatureCollection source.
  *
  * @function
  * @param {Document|Node|Object|string} source Source.
@@ -366,8 +371,9 @@ ol.format.GeoJSON.prototype.readFeature;
 
 
 /**
- * Read all features from a GeoJSON source.  Works with both Feature and
+ * Read all features from a GeoJSON source.  Works for all GeoJSON types.
- * FeatureCollection sources.
+ * If the source includes only geometries, features will be created with those
+ * geometries.
  *
  * @function
  * @param {Document|Node|Object|string} source Source.
@@ -383,11 +389,23 @@ ol.format.GeoJSON.prototype.readFeatures;
  */
 ol.format.GeoJSON.prototype.readFeatureFromObject = function(
     object, opt_options) {
-  var geoJSONFeature = /** @type {GeoJSONFeature} */ (object);
+
-  ol.DEBUG && console.assert(geoJSONFeature.type == 'Feature',
+  ol.DEBUG && console.assert(object.type !== 'FeatureCollection', 'Expected a Feature or geometry');
-      'geoJSONFeature.type should be Feature');
+
-  var geometry = ol.format.GeoJSON.readGeometry_(geoJSONFeature.geometry,
+  /**
-      opt_options);
+   * @type {GeoJSONFeature}
+   */
+  var geoJSONFeature = null;
+  if (object.type === 'Feature') {
+    geoJSONFeature = /** @type {GeoJSONFeature} */ (object);
+  } else {
+    geoJSONFeature = /** @type {GeoJSONFeature} */ ({
+      type: 'Feature',
+      geometry: /** @type {GeoJSONGeometry|GeoJSONGeometryCollection} */ (object)
+    });
+  }
+
+  var geometry = ol.format.GeoJSON.readGeometry_(geoJSONFeature.geometry, opt_options);
   var feature = new ol.Feature();
   if (this.geometryName_) {
     feature.setGeometryName(this.geometryName_);
@@ -410,10 +428,8 @@ ol.format.GeoJSON.prototype.readFeaturesFromObject = function(
     object, opt_options) {
   var geoJSONObject = /** @type {GeoJSONObject} */ (object);
   /** @type {Array.<ol.Feature>} */
-  var features;
+  var features = null;
-  if (geoJSONObject.type == 'Feature') {
+  if (geoJSONObject.type === 'FeatureCollection') {
-    features = [this.readFeatureFromObject(object, opt_options)];
-  } else if (geoJSONObject.type == 'FeatureCollection') {
     var geoJSONFeatureCollection = /** @type {GeoJSONFeatureCollection} */
         (object);
     features = [];
@@ -424,9 +440,9 @@ ol.format.GeoJSON.prototype.readFeaturesFromObject = function(
           opt_options));
     }
   } else {
-    ol.asserts.assert(false, 35); // Unknown GeoJSON object type
+    features = [this.readFeatureFromObject(object, opt_options)];
   }
-  return /** Array.<ol.Feature> */ (features);
+  return features;
 };
 
 

src/ol/graticule.js

@@ -7,7 +7,7 @@ goog.require('ol.geom.LineString');
 goog.require('ol.geom.flat.geodesic');
 goog.require('ol.math');
 goog.require('ol.proj');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.style.Stroke');
 
 
@@ -519,12 +519,12 @@ ol.Graticule.prototype.updateProjectionInfo_ = function(projection) {
  */
 ol.Graticule.prototype.setMap = function(map) {
   if (this.map_) {
-    this.map_.un(ol.render.EventType.POSTCOMPOSE,
+    this.map_.un(ol.render.Event.Type.POSTCOMPOSE,
         this.handlePostCompose_, this);
     this.map_.render();
   }
   if (map) {
-    map.on(ol.render.EventType.POSTCOMPOSE,
+    map.on(ol.render.Event.Type.POSTCOMPOSE,
         this.handlePostCompose_, this);
     map.render();
   }

src/ol/interaction/draw.js

@@ -2,6 +2,7 @@ goog.provide('ol.interaction.Draw');
 
 goog.require('ol');
 goog.require('ol.events');
+goog.require('ol.extent');
 goog.require('ol.events.Event');
 goog.require('ol.Feature');
 goog.require('ol.MapBrowserEvent.EventType');
@@ -17,7 +18,7 @@ goog.require('ol.geom.MultiPoint');
 goog.require('ol.geom.MultiPolygon');
 goog.require('ol.geom.Point');
 goog.require('ol.geom.Polygon');
-goog.require('ol.interaction.InteractionProperty');
+goog.require('ol.interaction.Interaction');
 goog.require('ol.interaction.Pointer');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.Vector');
@@ -251,11 +252,16 @@ ol.interaction.Draw = function(options) {
    * @private
    * @type {ol.EventsConditionType}
    */
-  this.freehandCondition_ = options.freehandCondition ?
+  this.freehandCondition_;
-      options.freehandCondition : ol.events.condition.shiftKeyOnly;
+  if (options.freehand) {
+    this.freehandCondition_ = ol.events.condition.always;
+  } else {
+    this.freehandCondition_ = options.freehandCondition ?
+        options.freehandCondition : ol.events.condition.shiftKeyOnly;
+  }
 
   ol.events.listen(this,
-      ol.Object.getChangeEventType(ol.interaction.InteractionProperty.ACTIVE),
+      ol.Object.getChangeEventType(ol.interaction.Interaction.Property.ACTIVE),
       this.updateState_, this);
 
 };
@@ -285,29 +291,25 @@ ol.interaction.Draw.prototype.setMap = function(map) {
 /**
  * Handles the {@link ol.MapBrowserEvent map browser event} and may actually
  * draw or finish the drawing.
- * @param {ol.MapBrowserEvent} mapBrowserEvent Map browser event.
+ * @param {ol.MapBrowserEvent} event Map browser event.
  * @return {boolean} `false` to stop event propagation.
  * @this {ol.interaction.Draw}
  * @api
  */
-ol.interaction.Draw.handleEvent = function(mapBrowserEvent) {
+ol.interaction.Draw.handleEvent = function(event) {
-  if ((this.mode_ === ol.interaction.Draw.Mode.LINE_STRING ||
+  this.freehand_ = this.mode_ !== ol.interaction.Draw.Mode.POINT && this.freehandCondition_(event);
-    this.mode_ === ol.interaction.Draw.Mode.POLYGON) &&
-    this.freehandCondition_(mapBrowserEvent)) {
-    this.freehand_ = true;
-  }
   var pass = !this.freehand_;
   if (this.freehand_ &&
-      mapBrowserEvent.type === ol.MapBrowserEvent.EventType.POINTERDRAG && this.sketchFeature_ !== null) {
+      event.type === ol.MapBrowserEvent.EventType.POINTERDRAG && this.sketchFeature_ !== null) {
-    this.addToDrawing_(mapBrowserEvent);
+    this.addToDrawing_(event);
     pass = false;
-  } else if (mapBrowserEvent.type ===
+  } else if (event.type ===
       ol.MapBrowserEvent.EventType.POINTERMOVE) {
-    pass = this.handlePointerMove_(mapBrowserEvent);
+    pass = this.handlePointerMove_(event);
-  } else if (mapBrowserEvent.type === ol.MapBrowserEvent.EventType.DBLCLICK) {
+  } else if (event.type === ol.MapBrowserEvent.EventType.DBLCLICK) {
     pass = false;
   }
-  return ol.interaction.Pointer.handleEvent.call(this, mapBrowserEvent) && pass;
+  return ol.interaction.Pointer.handleEvent.call(this, event) && pass;
 };
 
 
@@ -318,15 +320,15 @@ ol.interaction.Draw.handleEvent = function(mapBrowserEvent) {
  * @private
  */
 ol.interaction.Draw.handleDownEvent_ = function(event) {
-  if (this.condition_(event)) {
+  if (this.freehand_) {
-    this.downPx_ = event.pixel;
-    return true;
-  } else if (this.freehand_) {
     this.downPx_ = event.pixel;
     if (!this.finishCoordinate_) {
       this.startDrawing_(event);
     }
     return true;
+  } else if (this.condition_(event)) {
+    this.downPx_ = event.pixel;
+    return true;
   } else {
     return false;
   }
@@ -340,21 +342,23 @@ ol.interaction.Draw.handleDownEvent_ = function(event) {
  * @private
  */
 ol.interaction.Draw.handleUpEvent_ = function(event) {
-  this.freehand_ = false;
   var downPx = this.downPx_;
   var clickPx = event.pixel;
   var dx = downPx[0] - clickPx[0];
   var dy = downPx[1] - clickPx[1];
   var squaredDistance = dx * dx + dy * dy;
   var pass = true;
-  if (squaredDistance <= this.squaredClickTolerance_) {
+  var shouldHandle = this.freehand_ ?
+      squaredDistance > this.squaredClickTolerance_ :
+      squaredDistance <= this.squaredClickTolerance_;
+  if (shouldHandle) {
     this.handlePointerMove_(event);
     if (!this.finishCoordinate_) {
       this.startDrawing_(event);
       if (this.mode_ === ol.interaction.Draw.Mode.POINT) {
         this.finishDrawing();
       }
-    } else if (this.mode_ === ol.interaction.Draw.Mode.CIRCLE) {
+    } else if (this.freehand_ || this.mode_ === ol.interaction.Draw.Mode.CIRCLE) {
       this.finishDrawing();
     } else if (this.atFinish_(event)) {
       if (this.finishCondition_(event)) {
@@ -412,8 +416,7 @@ ol.interaction.Draw.prototype.atFinish_ = function(event) {
         var pixel = event.pixel;
         var dx = pixel[0] - finishPixel[0];
         var dy = pixel[1] - finishPixel[1];
-        var freehand = this.freehand_ && this.freehandCondition_(event);
+        var snapTolerance = this.freehand_ ? 1 : this.snapTolerance_;
-        var snapTolerance = freehand ? 1 : this.snapTolerance_;
         at = Math.sqrt(dx * dx + dy * dy) <= snapTolerance;
         if (at) {
           this.finishCoordinate_ = finishCoordinate;
@@ -541,13 +544,25 @@ ol.interaction.Draw.prototype.addToDrawing_ = function(event) {
   if (this.mode_ === ol.interaction.Draw.Mode.LINE_STRING) {
     this.finishCoordinate_ = coordinate.slice();
     coordinates = this.sketchCoords_;
+    if (coordinates.length >= this.maxPoints_) {
+      if (this.freehand_) {
+        coordinates.pop();
+      } else {
+        done = true;
+      }
+    }
     coordinates.push(coordinate.slice());
-    done = coordinates.length > this.maxPoints_;
     this.geometryFunction_(coordinates, geometry);
   } else if (this.mode_ === ol.interaction.Draw.Mode.POLYGON) {
     coordinates = this.sketchCoords_[0];
+    if (coordinates.length >= this.maxPoints_) {
+      if (this.freehand_) {
+        coordinates.pop();
+      } else {
+        done = true;
+      }
+    }
     coordinates.push(coordinate.slice());
-    done = coordinates.length > this.maxPoints_;
     if (done) {
       this.finishCoordinate_ = coordinates[0];
     }
@@ -717,7 +732,7 @@ ol.interaction.Draw.prototype.updateState_ = function() {
 
 
 /**
- * Create a `geometryFunction` for `mode: 'Circle'` that will create a regular
+ * Create a `geometryFunction` for `type: 'Circle'` that will create a regular
  * polygon with a user specified number of sides and start angle instead of an
  * `ol.geom.Circle` geometry.
  * @param {number=} opt_sides Number of sides of the regular polygon. Default is
@@ -752,6 +767,36 @@ ol.interaction.Draw.createRegularPolygon = function(opt_sides, opt_angle) {
 };
 
 
+/**
+ * Create a `geometryFunction` that will create a box-shaped polygon (aligned
+ * with the coordinate system axes).  Use this with the draw interaction and
+ * `type: 'Circle'` to return a box instead of a circle geometry.
+ * @return {ol.DrawGeometryFunctionType} Function that draws a box-shaped polygon.
+ * @api
+ */
+ol.interaction.Draw.createBox = function() {
+  return (
+    /**
+     * @param {ol.Coordinate|Array.<ol.Coordinate>|Array.<Array.<ol.Coordinate>>} coordinates
+     * @param {ol.geom.SimpleGeometry=} opt_geometry
+     * @return {ol.geom.SimpleGeometry}
+     */
+    function(coordinates, opt_geometry) {
+      var extent = ol.extent.boundingExtent(coordinates);
+      var geometry = opt_geometry || new ol.geom.Polygon(null);
+      geometry.setCoordinates([[
+        ol.extent.getBottomLeft(extent),
+        ol.extent.getBottomRight(extent),
+        ol.extent.getTopRight(extent),
+        ol.extent.getTopLeft(extent),
+        ol.extent.getBottomLeft(extent)
+      ]]);
+      return geometry;
+    }
+  );
+};
+
+
 /**
  * Get the drawing mode.  The mode for mult-part geometries is the same as for
  * their single-part cousins.

src/ol/interaction/interaction.js

@@ -1,7 +1,6 @@
 // FIXME factor out key precondition (shift et. al)
 
 goog.provide('ol.interaction.Interaction');
-goog.provide('ol.interaction.InteractionProperty');
 
 goog.require('ol');
 goog.require('ol.Object');
@@ -9,14 +8,6 @@ goog.require('ol.animation');
 goog.require('ol.easing');
 
 
-/**
- * @enum {string}
- */
-ol.interaction.InteractionProperty = {
-  ACTIVE: 'active'
-};
-
-
 /**
  * @classdesc
  * Abstract base class; normally only used for creating subclasses and not
@@ -63,7 +54,7 @@ ol.inherits(ol.interaction.Interaction, ol.Object);
  */
 ol.interaction.Interaction.prototype.getActive = function() {
   return /** @type {boolean} */ (
-      this.get(ol.interaction.InteractionProperty.ACTIVE));
+      this.get(ol.interaction.Interaction.Property.ACTIVE));
 };
 
 
@@ -84,7 +75,7 @@ ol.interaction.Interaction.prototype.getMap = function() {
  * @api
  */
 ol.interaction.Interaction.prototype.setActive = function(active) {
-  this.set(ol.interaction.InteractionProperty.ACTIVE, active);
+  this.set(ol.interaction.Interaction.Property.ACTIVE, active);
 };
 
 
@@ -238,3 +229,11 @@ ol.interaction.Interaction.zoomWithoutConstraints = function(map, view, resoluti
     view.setResolution(resolution);
   }
 };
+
+
+/**
+ * @enum {string}
+ */
+ol.interaction.Interaction.Property = {
+  ACTIVE: 'active'
+};

src/ol/interaction/modify.js

@@ -258,6 +258,18 @@ ol.interaction.Modify.prototype.removeFeatureSegmentData_ = function(feature) {
 };
 
 
+/**
+ * @inheritDoc
+ */
+ol.interaction.Modify.prototype.setActive = function(active) {
+  if (this.vertexFeature_ && !active) {
+    this.overlay_.getSource().removeFeature(this.vertexFeature_);
+    this.vertexFeature_ = null;
+  }
+  ol.interaction.Pointer.prototype.setActive.call(this, active);
+};
+
+
 /**
  * @inheritDoc
  */

src/ol/interaction/select.js

@@ -1,10 +1,8 @@
 goog.provide('ol.interaction.Select');
 
 goog.require('ol');
-goog.require('ol.asserts');
 goog.require('ol.functions');
 goog.require('ol.Collection');
-goog.require('ol.Feature');
 goog.require('ol.array');
 goog.require('ol.events');
 goog.require('ol.events.Event');
@@ -172,8 +170,6 @@ ol.interaction.Select.prototype.getFeatures = function() {
  * @api
  */
 ol.interaction.Select.prototype.getLayer = function(feature) {
-  ol.asserts.assert(feature instanceof ol.Feature,
-      42); // Expected an `ol.Feature`, but got an `ol.RenderFeature`
   var key = ol.getUid(feature);
   return /** @type {ol.layer.Vector} */ (this.featureLayerAssociation_[key]);
 };

src/ol/layer/heatmap.js

@@ -7,7 +7,7 @@ goog.require('ol.dom');
 goog.require('ol.layer.Vector');
 goog.require('ol.math');
 goog.require('ol.obj');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.style.Icon');
 goog.require('ol.style.Style');
 
@@ -120,7 +120,7 @@ ol.layer.Heatmap = function(opt_options) {
   // The render order is not relevant for a heatmap representation.
   this.setRenderOrder(null);
 
-  ol.events.listen(this, ol.render.EventType.RENDER, this.handleRender_, this);
+  ol.events.listen(this, ol.render.Event.Type.RENDER, this.handleRender_, this);
 
 };
 ol.inherits(ol.layer.Heatmap, ol.layer.Vector);
@@ -236,7 +236,7 @@ ol.layer.Heatmap.prototype.handleStyleChanged_ = function() {
  * @private
  */
 ol.layer.Heatmap.prototype.handleRender_ = function(event) {
-  ol.DEBUG && console.assert(event.type == ol.render.EventType.RENDER,
+  ol.DEBUG && console.assert(event.type == ol.render.Event.Type.RENDER,
       'event.type should be RENDER');
   ol.DEBUG && console.assert(this.gradient_, 'this.gradient_ expected');
   var context = event.context;

src/ol/layer/layer.js

@@ -7,7 +7,7 @@ goog.require('ol.Object');
 goog.require('ol.layer.Base');
 goog.require('ol.layer.LayerProperty');
 goog.require('ol.obj');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.source.State');
 
 
@@ -177,7 +177,7 @@ ol.layer.Layer.prototype.setMap = function(map) {
   }
   if (map) {
     this.mapPrecomposeKey_ = ol.events.listen(
-        map, ol.render.EventType.PRECOMPOSE, function(evt) {
+        map, ol.render.Event.Type.PRECOMPOSE, function(evt) {
           var layerState = this.getLayerState();
           layerState.managed = false;
           layerState.zIndex = Infinity;

src/ol/layer/vector.js

@@ -6,14 +6,6 @@ goog.require('ol.obj');
 goog.require('ol.style.Style');
 
 
-/**
- * @enum {string}
- */
-ol.layer.VectorProperty = {
-  RENDER_ORDER: 'renderOrder'
-};
-
-
 /**
  * @classdesc
  * Vector data that is rendered client-side.
@@ -100,7 +92,7 @@ ol.layer.Vector.prototype.getRenderBuffer = function() {
  */
 ol.layer.Vector.prototype.getRenderOrder = function() {
   return /** @type {function(ol.Feature, ol.Feature):number|null|undefined} */ (
-      this.get(ol.layer.VectorProperty.RENDER_ORDER));
+      this.get(ol.layer.Vector.Property.RENDER_ORDER));
 };
 
 
@@ -162,7 +154,7 @@ ol.layer.Vector.prototype.setRenderOrder = function(renderOrder) {
       renderOrder === undefined || !renderOrder ||
       typeof renderOrder === 'function',
       'renderOrder must be a comparator function');
-  this.set(ol.layer.VectorProperty.RENDER_ORDER, renderOrder);
+  this.set(ol.layer.Vector.Property.RENDER_ORDER, renderOrder);
 };
 
 
@@ -183,3 +175,11 @@ ol.layer.Vector.prototype.setStyle = function(style) {
       undefined : ol.style.Style.createFunction(this.style_);
   this.changed();
 };
+
+
+/**
+ * @enum {string}
+ */
+ol.layer.Vector.Property = {
+  RENDER_ORDER: 'renderOrder'
+};

src/ol/layer/vectortile.js

@@ -7,15 +7,6 @@ goog.require('ol.layer.Vector');
 goog.require('ol.obj');
 
 
-/**
- * @enum {string}
- */
-ol.layer.VectorTileProperty = {
-  PRELOAD: 'preload',
-  USE_INTERIM_TILES_ON_ERROR: 'useInterimTilesOnError'
-};
-
-
 /**
  * @classdesc
  * Layer for vector tile data that is rendered client-side.
@@ -64,7 +55,7 @@ ol.inherits(ol.layer.VectorTile, ol.layer.Vector);
  * @api
  */
 ol.layer.VectorTile.prototype.getPreload = function() {
-  return /** @type {number} */ (this.get(ol.layer.VectorTileProperty.PRELOAD));
+  return /** @type {number} */ (this.get(ol.layer.VectorTile.Property.PRELOAD));
 };
 
 
@@ -84,7 +75,7 @@ ol.layer.VectorTile.prototype.getRenderMode = function() {
  */
 ol.layer.VectorTile.prototype.getUseInterimTilesOnError = function() {
   return /** @type {boolean} */ (
-      this.get(ol.layer.VectorTileProperty.USE_INTERIM_TILES_ON_ERROR));
+      this.get(ol.layer.VectorTile.Property.USE_INTERIM_TILES_ON_ERROR));
 };
 
 
@@ -111,6 +102,15 @@ ol.layer.VectorTile.prototype.setUseInterimTilesOnError = function(useInterimTil
 };
 
 
+/**
+ * @enum {string}
+ */
+ol.layer.VectorTile.Property = {
+  PRELOAD: 'preload',
+  USE_INTERIM_TILES_ON_ERROR: 'useInterimTilesOnError'
+};
+
+
 /**
  * @enum {string}
  * Render mode for vector tiles:

src/ol/map.js

@@ -41,7 +41,7 @@ goog.require('ol.transform');
  * @const
  * @type {string}
  */
-ol.OL3_URL = 'http://openlayers.org/';
+ol.OL3_URL = 'https://openlayers.org/';
 
 
 /**
@@ -442,7 +442,8 @@ ol.Map = function(options) {
        * @param {ol.Collection.Event} event Collection event.
        */
       function(event) {
-        var id = event.element.getId();
+        var overlay = /** @type {ol.Overlay} */ (event.element);
+        var id = overlay.getId();
         if (id !== undefined) {
           delete this.overlayIdIndex_[id.toString()];
         }

src/ol/proj/epsg3857.js

@@ -116,10 +116,17 @@ ol.proj.EPSG3857.fromEPSG4326 = function(input, opt_output, opt_dimension) {
   }
   ol.DEBUG && console.assert(output.length % dimension === 0,
       'modulus of output.length with dimension should be 0');
+  var halfSize = ol.proj.EPSG3857.HALF_SIZE;
   for (var i = 0; i < length; i += dimension) {
-    output[i] = ol.proj.EPSG3857.RADIUS * Math.PI * input[i] / 180;
+    output[i] = halfSize * input[i] / 180;
-    output[i + 1] = ol.proj.EPSG3857.RADIUS *
+    var y = ol.proj.EPSG3857.RADIUS *
         Math.log(Math.tan(Math.PI * (input[i + 1] + 90) / 360));
+    if (y > halfSize) {
+      y = halfSize;
+    } else if (y < -halfSize) {
+      y = -halfSize;
+    }
+    output[i + 1] = y;
   }
   return output;
 };
@@ -148,7 +155,7 @@ ol.proj.EPSG3857.toEPSG4326 = function(input, opt_output, opt_dimension) {
   ol.DEBUG && console.assert(output.length % dimension === 0,
       'modulus of output.length with dimension should be 0');
   for (var i = 0; i < length; i += dimension) {
-    output[i] = 180 * input[i] / (ol.proj.EPSG3857.RADIUS * Math.PI);
+    output[i] = 180 * input[i] / ol.proj.EPSG3857.HALF_SIZE;
     output[i + 1] = 360 * Math.atan(
         Math.exp(input[i + 1] / ol.proj.EPSG3857.RADIUS)) / Math.PI - 90;
   }

src/ol/proj/index.jsdoc

@@ -19,7 +19,7 @@
  * Proj4js, or create a custom build to support those projections you need; see
  * the Proj4js website for how to do this. You also need the Proj4js definitions
  * for the required projections. These definitions can be obtained from
- * {@link http://epsg.io/}, and are a JS function, so can be loaded in a script
+ * {@link https://epsg.io/}, and are a JS function, so can be loaded in a script
  * tag (as in the examples) or pasted into your application.
  * The first time there is a request for a projection, either with a
  * {@link ol.proj.projectionLike} or directly with {@link ol.proj.get}, the

src/ol/render/canvas/polygonreplay.js

@@ -344,7 +344,7 @@ ol.render.canvas.PolygonReplay.prototype.setFillStrokeStyles_ = function() {
   var miterLimit = state.miterLimit;
   if (fillStyle !== undefined && state.currentFillStyle != fillStyle) {
     this.instructions.push(
-        [ol.render.canvas.Instruction.SET_FILL_STYLE, fillStyle]);
+        [ol.render.canvas.Instruction.SET_FILL_STYLE, fillStyle, typeof fillStyle != 'string']);
     state.currentFillStyle = state.fillStyle;
   }
   if (strokeStyle !== undefined) {

src/ol/render/canvas/replay.js

@@ -58,6 +58,12 @@ ol.render.canvas.Replay = function(tolerance, maxExtent, resolution, overlaps) {
    */
   this.resolution = resolution;
 
+  /**
+   * @private
+   * @type {boolean}
+   */
+  this.alignFill_ = false;
+
   /**
    * @private
    * @type {Array.<*>}
@@ -110,7 +116,7 @@ ol.render.canvas.Replay = function(tolerance, maxExtent, resolution, overlaps) {
    * @private
    * @type {ol.Transform}
    */
-  this.tmpLocalTransformInv_ = ol.transform.create();
+  this.resetTransform_ = ol.transform.create();
 };
 ol.inherits(ol.render.canvas.Replay, ol.render.VectorContext);
 
@@ -185,6 +191,25 @@ ol.render.canvas.Replay.prototype.beginGeometry = function(geometry, feature) {
 };
 
 
+/**
+ * @private
+ * @param {CanvasRenderingContext2D} context Context.
+ * @param {ol.Transform} transform Transform.
+ * @param {number} rotation Rotation.
+ */
+ol.render.canvas.Replay.prototype.fill_ = function(context, transform, rotation) {
+  if (this.alignFill_) {
+    context.translate(transform[4], transform[5]);
+    context.rotate(rotation);
+  }
+  context.fill();
+  if (this.alignFill_) {
+    context.rotate(-rotation);
+    context.translate(-transform[4], -transform[5]);
+  }
+};
+
+
 /**
  * @private
  * @param {CanvasRenderingContext2D} context Context.
@@ -222,7 +247,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
   var d = 0; // data index
   var dd; // end of per-instruction data
   var localTransform = this.tmpLocalTransform_;
-  var localTransformInv = this.tmpLocalTransformInv_;
+  var resetTransform = this.resetTransform_;
   var prevX, prevY, roundX, roundY;
   var pendingFill = 0;
   var pendingStroke = 0;
@@ -250,7 +275,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
         break;
       case ol.render.canvas.Instruction.BEGIN_PATH:
         if (pendingFill > batchSize) {
-          context.fill();
+          this.fill_(context, transform, viewRotation);
           pendingFill = 0;
         }
         if (pendingStroke > batchSize) {
@@ -317,7 +342,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
             var centerY = y + anchorY;
             ol.transform.compose(localTransform,
                 centerX, centerY, scale, scale, rotation, -centerX, -centerY);
-            context.transform.apply(context, localTransform);
+            context.setTransform.apply(context, localTransform);
           }
           var alpha = context.globalAlpha;
           if (opacity != 1) {
@@ -334,8 +359,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
             context.globalAlpha = alpha;
           }
           if (scale != 1 || rotation !== 0) {
-            ol.transform.invert(ol.transform.setFromArray(localTransformInv, localTransform));
+            context.setTransform.apply(context, resetTransform);
-            context.transform.apply(context, localTransformInv);
           }
         }
         ++i;
@@ -377,7 +401,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
           y = pixelCoordinates[d + 1] + offsetY;
           if (scale != 1 || rotation !== 0) {
             ol.transform.compose(localTransform, x, y, scale, scale, rotation, -x, -y);
-            context.transform.apply(context, localTransform);
+            context.setTransform.apply(context, localTransform);
           }
 
           // Support multiple lines separated by \n
@@ -408,8 +432,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
           }
 
           if (scale != 1 || rotation !== 0) {
-            ol.transform.invert(ol.transform.setFromArray(localTransformInv, localTransform));
+            context.setTransform.apply(context, resetTransform);
-            context.transform.apply(context, localTransformInv);
           }
         }
         ++i;
@@ -429,7 +452,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
         if (batchSize) {
           pendingFill++;
         } else {
-          context.fill();
+          this.fill_(context, transform, viewRotation);
         }
         ++i;
         break;
@@ -467,8 +490,10 @@ ol.render.canvas.Replay.prototype.replay_ = function(
             ol.colorlike.isColorLike(instruction[1]),
             '2nd instruction should be a string, ' +
             'CanvasPattern, or CanvasGradient');
+        this.alignFill_ = instruction[2];
+
         if (pendingFill) {
-          context.fill();
+          this.fill_(context, transform, viewRotation);
           pendingFill = 0;
         }
 
@@ -534,7 +559,7 @@ ol.render.canvas.Replay.prototype.replay_ = function(
     }
   }
   if (pendingFill) {
-    context.fill();
+    this.fill_(context, transform, viewRotation);
   }
   if (pendingStroke) {
     context.stroke();

src/ol/render/event.js

@@ -1,37 +1,14 @@
 goog.provide('ol.render.Event');
-goog.provide('ol.render.EventType');
 
 goog.require('ol');
 goog.require('ol.events.Event');
 
 
-/**
- * @enum {string}
- */
-ol.render.EventType = {
-  /**
-   * @event ol.render.Event#postcompose
-   * @api
-   */
-  POSTCOMPOSE: 'postcompose',
-  /**
-   * @event ol.render.Event#precompose
-   * @api
-   */
-  PRECOMPOSE: 'precompose',
-  /**
-   * @event ol.render.Event#render
-   * @api
-   */
-  RENDER: 'render'
-};
-
-
 /**
  * @constructor
  * @extends {ol.events.Event}
  * @implements {oli.render.Event}
- * @param {ol.render.EventType} type Type.
+ * @param {ol.render.Event.Type} type Type.
  * @param {ol.render.VectorContext=} opt_vectorContext Vector context.
  * @param {olx.FrameState=} opt_frameState Frame state.
  * @param {?CanvasRenderingContext2D=} opt_context Context.
@@ -75,3 +52,25 @@ ol.render.Event = function(
 
 };
 ol.inherits(ol.render.Event, ol.events.Event);
+
+
+/**
+ * @enum {string}
+ */
+ol.render.Event.Type = {
+  /**
+   * @event ol.render.Event#postcompose
+   * @api
+   */
+  POSTCOMPOSE: 'postcompose',
+  /**
+   * @event ol.render.Event#precompose
+   * @api
+   */
+  PRECOMPOSE: 'precompose',
+  /**
+   * @event ol.render.Event#render
+   * @api
+   */
+  RENDER: 'render'
+};

src/ol/renderer/canvas/layer.js

@@ -3,7 +3,6 @@ goog.provide('ol.renderer.canvas.Layer');
 goog.require('ol');
 goog.require('ol.extent');
 goog.require('ol.render.Event');
-goog.require('ol.render.EventType');
 goog.require('ol.render.canvas');
 goog.require('ol.render.canvas.Immediate');
 goog.require('ol.renderer.Layer');
@@ -109,7 +108,7 @@ ol.renderer.canvas.Layer.prototype.composeFrame = function(frameState, layerStat
 
 
 /**
- * @param {ol.render.EventType} type Event type.
+ * @param {ol.render.Event.Type} type Event type.
  * @param {CanvasRenderingContext2D} context Context.
  * @param {olx.FrameState} frameState Frame state.
  * @param {ol.Transform=} opt_transform Transform.
@@ -142,7 +141,7 @@ ol.renderer.canvas.Layer.prototype.dispatchComposeEvent_ = function(type, contex
  * @protected
  */
 ol.renderer.canvas.Layer.prototype.dispatchPostComposeEvent = function(context, frameState, opt_transform) {
-  this.dispatchComposeEvent_(ol.render.EventType.POSTCOMPOSE, context,
+  this.dispatchComposeEvent_(ol.render.Event.Type.POSTCOMPOSE, context,
       frameState, opt_transform);
 };
 
@@ -154,7 +153,7 @@ ol.renderer.canvas.Layer.prototype.dispatchPostComposeEvent = function(context,
  * @protected
  */
 ol.renderer.canvas.Layer.prototype.dispatchPreComposeEvent = function(context, frameState, opt_transform) {
-  this.dispatchComposeEvent_(ol.render.EventType.PRECOMPOSE, context,
+  this.dispatchComposeEvent_(ol.render.Event.Type.PRECOMPOSE, context,
       frameState, opt_transform);
 };
 
@@ -166,7 +165,7 @@ ol.renderer.canvas.Layer.prototype.dispatchPreComposeEvent = function(context, f
  * @protected
  */
 ol.renderer.canvas.Layer.prototype.dispatchRenderEvent = function(context, frameState, opt_transform) {
-  this.dispatchComposeEvent_(ol.render.EventType.RENDER, context,
+  this.dispatchComposeEvent_(ol.render.Event.Type.RENDER, context,
       frameState, opt_transform);
 };
 

src/ol/renderer/canvas/map.js

@@ -13,7 +13,6 @@ goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.layer.VectorTile');
 goog.require('ol.render.Event');
-goog.require('ol.render.EventType');
 goog.require('ol.render.canvas');
 goog.require('ol.render.canvas.Immediate');
 goog.require('ol.renderer.Map');
@@ -88,7 +87,7 @@ ol.renderer.canvas.Map.prototype.createLayerRenderer = function(layer) {
 
 
 /**
- * @param {ol.render.EventType} type Event type.
+ * @param {ol.render.Event.Type} type Event type.
  * @param {olx.FrameState} frameState Frame state.
  * @private
  */
@@ -166,7 +165,7 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) {
 
   this.calculateMatrices2D(frameState);
 
-  this.dispatchComposeEvent_(ol.render.EventType.PRECOMPOSE, frameState);
+  this.dispatchComposeEvent_(ol.render.Event.Type.PRECOMPOSE, frameState);
 
   var layerStatesArray = frameState.layerStatesArray;
   ol.array.stableSort(layerStatesArray, ol.renderer.Map.sortByZIndex);
@@ -191,7 +190,7 @@ ol.renderer.canvas.Map.prototype.renderFrame = function(frameState) {
   ol.render.canvas.rotateAtOffset(context, -rotation, width / 2, height / 2);
 
   this.dispatchComposeEvent_(
-      ol.render.EventType.POSTCOMPOSE, frameState);
+      ol.render.Event.Type.POSTCOMPOSE, frameState);
 
   if (!this.renderedVisible_) {
     this.canvas_.style.display = '';

src/ol/renderer/canvas/tilelayer.js

@@ -10,8 +10,9 @@ goog.require('ol.array');
 goog.require('ol.dom');
 goog.require('ol.extent');
 goog.require('ol.render.canvas');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.renderer.canvas.Layer');
+goog.require('ol.size');
 
 
 /**
@@ -214,6 +215,11 @@ ol.renderer.canvas.TileLayer.prototype.forEachLayerAtPixel = function(
  * @protected
  */
 ol.renderer.canvas.TileLayer.prototype.renderTileImages = function(context, frameState, layerState) {
+  var tilesToDraw = this.renderedTiles;
+  if (tilesToDraw.length == 0) {
+    return;
+  }
+
   var pixelRatio = frameState.pixelRatio;
   var viewState = frameState.viewState;
   var center = viewState.center;
@@ -226,10 +232,10 @@ ol.renderer.canvas.TileLayer.prototype.renderTileImages = function(context, fram
   var pixelScale = pixelRatio / resolution;
   var layer = this.getLayer();
   var source = /** @type {ol.source.Tile} */ (layer.getSource());
-  var tileGutter = pixelRatio * source.getGutter(projection);
+  var tileGutter = source.getTilePixelRatio(pixelRatio) * source.getGutter(projection);
   var tileGrid = source.getTileGridForProjection(projection);
 
-  var hasRenderListeners = layer.hasListener(ol.render.EventType.RENDER);
+  var hasRenderListeners = layer.hasListener(ol.render.Event.Type.RENDER);
   var renderContext = context;
   var drawScale = 1;
   var drawOffsetX, drawOffsetY, drawSize;
@@ -258,7 +264,16 @@ ol.renderer.canvas.TileLayer.prototype.renderTileImages = function(context, fram
   var alpha = renderContext.globalAlpha;
   renderContext.globalAlpha = layerState.opacity;
 
-  var tilesToDraw = this.renderedTiles;
+  // Origin of the lowest resolution tile that contains the map center. We will
+  // try to use the same origin for all resolutions for pixel-perfect tile
+  // alignment across resolutions.
+  var lowResTileCoord = tilesToDraw[0].getTileCoord();
+  var minZOrigin = ol.extent.getBottomLeft(tileGrid.getTileCoordExtent(
+      tileGrid.getTileCoordForCoordAndZ(center,
+          lowResTileCoord[0], this.tmpTileCoord_), this.tmpExtent));
+  var maxZ = tilesToDraw[tilesToDraw.length - 1].getTileCoord()[0];
+  var maxZResolution = tileGrid.getResolution(maxZ);
+  var maxZTileSize = ol.size.toSize(tileGrid.getTileSize(maxZ));
 
   var pixelExtents;
   var opaque = source.getOpaque(projection) && layerState.opacity == 1;
@@ -302,17 +317,23 @@ ol.renderer.canvas.TileLayer.prototype.renderTileImages = function(context, fram
   for (var i = 0, ii = tilesToDraw.length; i < ii; ++i) {
     var tile = tilesToDraw[i];
     var tileCoord = tile.getTileCoord();
-    var tileExtent = tileGrid.getTileCoordExtent(tileCoord, this.tmpExtent);
     var currentZ = tileCoord[0];
+    var tileSize = ol.size.toSize(tileGrid.getTileSize(currentZ));
     // Calculate all insert points by tile widths from a common origin to avoid
     // gaps caused by rounding
-    var origin = ol.extent.getBottomLeft(tileGrid.getTileCoordExtent(
+    var originTileCoord = tileGrid.getTileCoordForCoordAndZ(minZOrigin, currentZ, this.tmpTileCoord_);
-        tileGrid.getTileCoordForCoordAndZ(center, currentZ, this.tmpTileCoord_)));
+    var origin = ol.extent.getBottomLeft(tileGrid.getTileCoordExtent(originTileCoord, this.tmpExtent));
-    var w = Math.round(ol.extent.getWidth(tileExtent) * pixelScale);
+    // Calculate tile width and height by a tile size factor from the highest
-    var h = Math.round(ol.extent.getHeight(tileExtent) * pixelScale);
+    // resolution tile size to avoid gaps when combining tiles from different
-    var left = Math.round((tileExtent[0] - origin[0]) * pixelScale / w) * w +
+    // resolutions
+    var resolutionFactor = tileGrid.getResolution(currentZ) / maxZResolution;
+    var tileSizeFactorW = tileSize[0] / maxZTileSize[0] * resolutionFactor;
+    var tileSizeFactorH = tileSize[1] / maxZTileSize[1] * resolutionFactor;
+    var w = Math.round(maxZTileSize[0] / resolution * maxZResolution * pixelRatio * drawScale) * tileSizeFactorW;
+    var h = Math.round(maxZTileSize[1] / resolution * maxZResolution * pixelRatio * drawScale) * tileSizeFactorH;
+    var left = (tileCoord[1] - originTileCoord[1]) * w +
         offsetX + Math.round((origin[0] - center[0]) * pixelScale);
-    var top = Math.round((origin[1] - tileExtent[3]) * pixelScale / h) * h +
+    var top = (originTileCoord[2] - tileCoord[2] - 1) * h +
         offsetY + Math.round((center[1] - origin[1]) * pixelScale);
     if (!opaque) {
       var pixelExtent = [left, top, left + w, top + h];

src/ol/renderer/canvas/vectorlayer.js

@@ -4,7 +4,7 @@ goog.require('ol');
 goog.require('ol.View');
 goog.require('ol.dom');
 goog.require('ol.extent');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.render.canvas');
 goog.require('ol.render.canvas.ReplayGroup');
 goog.require('ol.renderer.canvas.Layer');
@@ -97,7 +97,7 @@ ol.renderer.canvas.VectorLayer.prototype.composeFrame = function(frameState, lay
     var drawOffsetX = 0;
     var drawOffsetY = 0;
     var replayContext;
-    if (layer.hasListener(ol.render.EventType.RENDER)) {
+    if (layer.hasListener(ol.render.Event.Type.RENDER)) {
       var drawWidth = context.canvas.width;
       var drawHeight = context.canvas.height;
       if (rotation) {

src/ol/renderer/canvas/vectortilelayer.js

@@ -6,7 +6,7 @@ goog.require('ol.extent');
 goog.require('ol.proj');
 goog.require('ol.proj.Units');
 goog.require('ol.layer.VectorTile');
-goog.require('ol.render.EventType');
+goog.require('ol.render.Event');
 goog.require('ol.render.ReplayType');
 goog.require('ol.render.canvas');
 goog.require('ol.render.canvas.ReplayGroup');
@@ -17,26 +17,6 @@ goog.require('ol.size');
 goog.require('ol.transform');
 
 
-/**
- * @const
- * @type {!Object.<string, Array.<ol.render.ReplayType>>}
- */
-ol.renderer.canvas.IMAGE_REPLAYS = {
-  'image': ol.render.replay.ORDER,
-  'hybrid': [ol.render.ReplayType.POLYGON, ol.render.ReplayType.LINE_STRING]
-};
-
-
-/**
- * @const
- * @type {!Object.<string, Array.<ol.render.ReplayType>>}
- */
-ol.renderer.canvas.VECTOR_REPLAYS = {
-  'hybrid': [ol.render.ReplayType.IMAGE, ol.render.ReplayType.TEXT],
-  'vector': ol.render.replay.ORDER
-};
-
-
 /**
  * @constructor
  * @extends {ol.renderer.canvas.TileLayer}
@@ -66,6 +46,26 @@ ol.renderer.canvas.VectorTileLayer = function(layer) {
 ol.inherits(ol.renderer.canvas.VectorTileLayer, ol.renderer.canvas.TileLayer);
 
 
+/**
+ * @const
+ * @type {!Object.<string, Array.<ol.render.ReplayType>>}
+ */
+ol.renderer.canvas.VectorTileLayer.IMAGE_REPLAYS = {
+  'image': ol.render.replay.ORDER,
+  'hybrid': [ol.render.ReplayType.POLYGON, ol.render.ReplayType.LINE_STRING]
+};
+
+
+/**
+ * @const
+ * @type {!Object.<string, Array.<ol.render.ReplayType>>}
+ */
+ol.renderer.canvas.VectorTileLayer.VECTOR_REPLAYS = {
+  'hybrid': [ol.render.ReplayType.IMAGE, ol.render.ReplayType.TEXT],
+  'vector': ol.render.replay.ORDER
+};
+
+
 /**
  * @inheritDoc
  */
@@ -107,7 +107,7 @@ ol.renderer.canvas.VectorTileLayer.prototype.renderTileReplays_ = function(
     context, frameState, layerState) {
 
   var layer = this.getLayer();
-  var replays = ol.renderer.canvas.VECTOR_REPLAYS[layer.getRenderMode()];
+  var replays = ol.renderer.canvas.VectorTileLayer.VECTOR_REPLAYS[layer.getRenderMode()];
   var pixelRatio = frameState.pixelRatio;
   var skippedFeatureUids = layerState.managed ?
       frameState.skippedFeatureUids : {};
@@ -123,7 +123,7 @@ ol.renderer.canvas.VectorTileLayer.prototype.renderTileReplays_ = function(
   var transform = this.getTransform(frameState, 0);
 
   var replayContext;
-  if (layer.hasListener(ol.render.EventType.RENDER)) {
+  if (layer.hasListener(ol.render.Event.Type.RENDER)) {
     // resize and clear
     this.context.canvas.width = context.canvas.width;
     this.context.canvas.height = context.canvas.height;
@@ -393,7 +393,7 @@ ol.renderer.canvas.VectorTileLayer.prototype.renderFeature = function(feature, s
 ol.renderer.canvas.VectorTileLayer.prototype.renderTileImage_ = function(
     tile, frameState, layerState, skippedFeatures) {
   var layer = this.getLayer();
-  var replays = ol.renderer.canvas.IMAGE_REPLAYS[layer.getRenderMode()];
+  var replays = ol.renderer.canvas.VectorTileLayer.IMAGE_REPLAYS[layer.getRenderMode()];
   if (!replays) {
     // do not create an image in 'vector' mode
     return;

src/ol/renderer/webgl/layer.js

@@ -2,7 +2,6 @@ goog.provide('ol.renderer.webgl.Layer');
 
 goog.require('ol');
 goog.require('ol.render.Event');
-goog.require('ol.render.EventType');
 goog.require('ol.render.webgl.Immediate');
 goog.require('ol.renderer.Layer');
 goog.require('ol.renderer.webgl.defaultmapshader');
@@ -140,7 +139,7 @@ ol.renderer.webgl.Layer.prototype.bindFramebuffer = function(frameState, framebu
 ol.renderer.webgl.Layer.prototype.composeFrame = function(frameState, layerState, context) {
 
   this.dispatchComposeEvent_(
-      ol.render.EventType.PRECOMPOSE, context, frameState);
+      ol.render.Event.Type.PRECOMPOSE, context, frameState);
 
   context.bindBuffer(ol.webgl.ARRAY_BUFFER, this.arrayBuffer_);
 
@@ -179,13 +178,13 @@ ol.renderer.webgl.Layer.prototype.composeFrame = function(frameState, layerState
   gl.drawArrays(ol.webgl.TRIANGLE_STRIP, 0, 4);
 
   this.dispatchComposeEvent_(
-      ol.render.EventType.POSTCOMPOSE, context, frameState);
+      ol.render.Event.Type.POSTCOMPOSE, context, frameState);
 
 };
 
 
 /**
- * @param {ol.render.EventType} type Event type.
+ * @param {ol.render.Event.Type} type Event type.
  * @param {ol.webgl.Context} context WebGL context.
  * @param {olx.FrameState} frameState Frame state.
  * @private

src/ol/renderer/webgl/map.js

@@ -12,7 +12,6 @@ goog.require('ol.layer.Layer');
 goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.render.Event');
-goog.require('ol.render.EventType');
 goog.require('ol.render.webgl.Immediate');
 goog.require('ol.renderer.Map');
 goog.require('ol.renderer.Type');
@@ -251,7 +250,7 @@ ol.renderer.webgl.Map.prototype.createLayerRenderer = function(layer) {
 
 
 /**
- * @param {ol.render.EventType} type Event type.
+ * @param {ol.render.Event.Type} type Event type.
  * @param {olx.FrameState} frameState Frame state.
  * @private
  */
@@ -433,7 +432,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
   this.textureCache_.set((-frameState.index).toString(), null);
   ++this.textureCacheFrameMarkerCount_;
 
-  this.dispatchComposeEvent_(ol.render.EventType.PRECOMPOSE, frameState);
+  this.dispatchComposeEvent_(ol.render.Event.Type.PRECOMPOSE, frameState);
 
   /** @type {Array.<ol.LayerState>} */
   var layerStatesToDraw = [];
@@ -492,7 +491,7 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
     frameState.animate = true;
   }
 
-  this.dispatchComposeEvent_(ol.render.EventType.POSTCOMPOSE, frameState);
+  this.dispatchComposeEvent_(ol.render.Event.Type.POSTCOMPOSE, frameState);
 
   this.scheduleRemoveUnusedLayerRenderers(frameState);
   this.scheduleExpireIconCache(frameState);

src/ol/renderer/webgl/tilelayer.js

@@ -161,7 +161,7 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame = function(frameState, layerS
   var pixelRatio = tilePixelSize[0] /
       ol.size.toSize(tileGrid.getTileSize(z), this.tmpSize_)[0];
   var tilePixelResolution = tileResolution / pixelRatio;
-  var tileGutter = frameState.pixelRatio * tileSource.getGutter(projection);
+  var tileGutter = tileSource.getTilePixelRatio(pixelRatio) * tileSource.getGutter(projection);
 
   var center = viewState.center;
   var extent = frameState.extent;