Updates for 6.8

Merge pull request #12785 from mike-000/Promise.allSettled
Promise.allSettled polyfill and other browser compatibilty
2021-09-24 19:51:28 +00:00 · 2021-09-24 19:32:53 +00:00 · 2021-09-24 14:12:56 +00:00 · 2021-09-24 13:50:19 +00:00 · 2021-09-24 13:41:19 +00:00 · 2021-09-24 13:40:54 +00:00
131 changed files with 1481 additions and 918 deletions
--- a/README.md
+++ b/README.md
@@ -102,6 +102,8 @@ For older browsers and platforms (Internet Explorer, Android 4.x, iOS v12 and ol
 * [`Number.isInteger`](https://caniuse.com/isInteger): Available from [polyfill.io](https://polyfill.io/).
 * [Pointer events](https://caniuse.com/pointer): Use [elm-pep](https://npmjs.com/package/elm-pep) (lightweight) or [pepjs](https://npmjs.com/package/pepjs) (for really, really old browsers).

+[`ol/source/GeoTIFF`](https://openlayers.org/en/latest/apidoc/module-ol_source_GeoTIFF-GeoTIFFSource.html) requires a browser that supports [ECMAScript 6](https://262.ecma-international.org/6.0/). Additionally a polyfill for [`Promise.allSettled`](https://caniuse.com/mdn-javascript_builtins_promise_allsettled) may be needed.
+
 ## Documentation

 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/).
--- a/changelog/upgrade-notes.md
+++ b/changelog/upgrade-notes.md
@@ -1,5 +1,9 @@
 ## Upgrade notes

+### v6.8.0
+
+There should be nothing special required when upgrading from v6.7 to v6.8.
+
 ### v6.7.0

 There should be nothing special required when upgrading from v6.6 to v6.7.
--- a/changelog/v6.8.0.md
+++ b/changelog/v6.8.0.md
@@ -0,0 +1,60 @@
+# 6.8.0
+
+The 6.8 release builds on the momentum of 6.7 with some great new enhancements.  Data tiles now handle 32-bit data in addition to 8-bit.  Views properties can now be provided that sources that fetch view-related data.  Vector tile rendering got some performance enhancements.  Find detail on these features and a number of fixes in the list of changes below.
+
+## List of all changes
+
+ * [#12785](https://github.com/openlayers/openlayers/pull/12785) - Promise.allSettled polyfill and other browser compatibilty ([@mike-000](https://github.com/mike-000))
+ * [#12807](https://github.com/openlayers/openlayers/pull/12807) - Updated styles ([@tschaub](https://github.com/tschaub))
+ * [#12806](https://github.com/openlayers/openlayers/pull/12806) - Update to the WebGL sea level example ([@tschaub](https://github.com/tschaub))
+ * [#12808](https://github.com/openlayers/openlayers/pull/12808) - Update expectations for vector tile icon label rendering ([@tschaub](https://github.com/tschaub))
+ * [#12804](https://github.com/openlayers/openlayers/pull/12804) - Make vector tiles rendering simpler and a bit faster ([@ahocevar](https://github.com/ahocevar))
+ * [#12802](https://github.com/openlayers/openlayers/pull/12802) - Enqueue tiles at the next step in the animation ([@tschaub](https://github.com/tschaub))
+ * [#12801](https://github.com/openlayers/openlayers/pull/12801) - Update ol-mapbox-style to latest version without ol peer dependency ([@ahocevar](https://github.com/ahocevar))
+ * [#12792](https://github.com/openlayers/openlayers/pull/12792) - Do not do any canvas work when there are no features to render ([@ahocevar](https://github.com/ahocevar))
+ * [#12797](https://github.com/openlayers/openlayers/pull/12797) - Update geotiff ([@ahocevar](https://github.com/ahocevar))
+ * [#12799](https://github.com/openlayers/openlayers/pull/12799) - All layers now call dispose on the renderer ([@tschaub](https://github.com/tschaub))
+ * [#12798](https://github.com/openlayers/openlayers/pull/12798) - More cleanup in the WebGL tile layer's dispose method ([@tschaub](https://github.com/tschaub))
+ * [#12795](https://github.com/openlayers/openlayers/pull/12795) - New tile source for the WMTS example ([@mike-000](https://github.com/mike-000))
+ * [#12793](https://github.com/openlayers/openlayers/pull/12793) - Add a method to set the map layers ([@tschaub](https://github.com/tschaub))
+ * [#12789](https://github.com/openlayers/openlayers/pull/12789) - Handle TileJSON urls in Mapbox Style document ([@ahocevar](https://github.com/ahocevar))
+ * [#12790](https://github.com/openlayers/openlayers/pull/12790) - Allow maps to be configured with a promise for view props ([@tschaub](https://github.com/tschaub))
+ * [#12777](https://github.com/openlayers/openlayers/pull/12777) - Fix offscreen-canvas example ([@ahocevar](https://github.com/ahocevar))
+ * [#12778](https://github.com/openlayers/openlayers/pull/12778) - Do not render vector tiles unless they are being used ([@ahocevar](https://github.com/ahocevar))
+ * [#12773](https://github.com/openlayers/openlayers/pull/12773) - Enable WebGL extensions when required ([@tschaub](https://github.com/tschaub))
+ * [#12774](https://github.com/openlayers/openlayers/pull/12774) - Fix text decluttering when segment length is zero ([@MoonE](https://github.com/MoonE))
+ * [#12770](https://github.com/openlayers/openlayers/pull/12770) - Use Uint8Array instead of Uint8ClampedArray for increased browser compatibility ([@tschaub](https://github.com/tschaub))
+ * [#12759](https://github.com/openlayers/openlayers/pull/12759) - #12758: Allow undefined to be passed to control setMap(). Also fix type of getMap() ([@jumpinjackie](https://github.com/jumpinjackie))
+ * [#12760](https://github.com/openlayers/openlayers/pull/12760) - Fix opacity handling for tile and vector layers ([@ahocevar](https://github.com/ahocevar))
+ * [#12764](https://github.com/openlayers/openlayers/pull/12764) - Fix ImageInformationResponse typedef ([@webwitcher](https://github.com/webwitcher))
+ * [#12769](https://github.com/openlayers/openlayers/pull/12769) - Remove extra closing anchor tag ([@tschaub](https://github.com/tschaub))
+ * [#12761](https://github.com/openlayers/openlayers/pull/12761) - Add Float Textures for GL Rendering / DataTiles ([@theduckylittle](https://github.com/theduckylittle))
+ * [#12740](https://github.com/openlayers/openlayers/pull/12740) - Various fixes for browser compatibility issues ([mike-000](https://github.com/search?q=mike-000&type=Users))
+ * [#12741](https://github.com/openlayers/openlayers/pull/12741) - Minimal documentation for GMLBase ([@mike-000](https://github.com/mike-000))
+ * [#12743](https://github.com/openlayers/openlayers/pull/12743) - Remove docs reference to unmanaged layer and Select ([@mike-000](https://github.com/mike-000))
+ * [#12734](https://github.com/openlayers/openlayers/pull/12734) - Continue supporting IE11 in examples and legacy build ([@ahocevar](https://github.com/ahocevar))
+ * [#12739](https://github.com/openlayers/openlayers/pull/12739) - Change canvas style from initial to unset ([@mike-000](https://github.com/mike-000))
+ * [#12731](https://github.com/openlayers/openlayers/pull/12731) - Handle resolution and tile loadingstrategy with user projection ([@ahocevar](https://github.com/ahocevar))
+ * [#12736](https://github.com/openlayers/openlayers/pull/12736) - OnSignatures return more specific type ([@simonseyock](https://github.com/simonseyock))
+ * [#12732](https://github.com/openlayers/openlayers/pull/12732) - Add <meta charset="utf-8"> to Quick Start ([@mike-000](https://github.com/mike-000))
+ * [#12728](https://github.com/openlayers/openlayers/pull/12728) - Release v6.7.0 ([@openlayers](https://github.com/openlayers))
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * [#12784](https://github.com/openlayers/openlayers/pull/12784) - Bump webpack-dev-server from 4.2.0 to 4.2.1 ([@openlayers](https://github.com/openlayers))
+ * [#12783](https://github.com/openlayers/openlayers/pull/12783) - Bump marked from 3.0.3 to 3.0.4 ([@openlayers](https://github.com/openlayers))
+ * [#12782](https://github.com/openlayers/openlayers/pull/12782) - Bump webpack-sources from 3.2.0 to 3.2.1 ([@openlayers](https://github.com/openlayers))
+ * [#12781](https://github.com/openlayers/openlayers/pull/12781) - Bump webpack from 5.52.1 to 5.53.0 ([@openlayers](https://github.com/openlayers))
+ * [#12780](https://github.com/openlayers/openlayers/pull/12780) - Bump @babel/eslint-parser from 7.15.4 to 7.15.7 ([@openlayers](https://github.com/openlayers))
+ * [#12750](https://github.com/openlayers/openlayers/pull/12750) - Bump webpack-dev-server from 4.1.0 to 4.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#12749](https://github.com/openlayers/openlayers/pull/12749) - Bump marked from 3.0.2 to 3.0.3 ([@openlayers](https://github.com/openlayers))
+ * [#12748](https://github.com/openlayers/openlayers/pull/12748) - Bump ol-mapbox-style from 6.4.1 to 6.4.2 ([@openlayers](https://github.com/openlayers))
+ * [#12747](https://github.com/openlayers/openlayers/pull/12747) - Bump terser-webpack-plugin from 5.2.3 to 5.2.4 ([@openlayers](https://github.com/openlayers))
+ * [#12746](https://github.com/openlayers/openlayers/pull/12746) - Bump @babel/preset-env from 7.15.4 to 7.15.6 ([@openlayers](https://github.com/openlayers))
+ * [#12745](https://github.com/openlayers/openlayers/pull/12745) - Bump webpack from 5.52.0 to 5.52.1 ([@openlayers](https://github.com/openlayers))
+ * [#12744](https://github.com/openlayers/openlayers/pull/12744) - Bump webpack-dev-middleware from 5.0.0 to 5.1.0 ([@openlayers](https://github.com/openlayers))
+
+
+</details>
--- a/config/webpack-config-legacy-build.mjs
+++ b/config/webpack-config-legacy-build.mjs
@@ -1,33 +1,28 @@
 import TerserPlugin from 'terser-webpack-plugin';
-import path, {dirname} from 'path';
-import {fileURLToPath} from 'url';
-
-const baseDir = dirname(fileURLToPath(import.meta.url));
+import path from 'path';

 export default {
-  entry: './build/index.js',
+  entry: ['regenerator-runtime/runtime', './build/index.js'],
  devtool: 'source-map',
  mode: 'production',
  target: ['web', 'es5'],
  module: {
    rules: [
      {
-        test: /^((?!es2015-)[\s\S])*\.js$/,
+        test: /\.m?js$/,
        use: {
-          loader: 'buble-loader',
+          loader: 'babel-loader',
          options: {
-            transforms: {dangerousForOf: true},
+            presets: [
+              [
+                '@babel/preset-env',
+                {
+                  targets: 'last 2 versions, not dead',
+                },
+              ],
+            ],
          },
        },
-        include: [
-          path.join(
-            baseDir,
-            '..',
-            'node_modules',
-            '@mapbox',
-            'mapbox-gl-style-spec'
-          ),
-        ],
      },
    ],
  },
--- a/doc/errors/index.md
+++ b/doc/errors/index.md
@@ -233,10 +233,6 @@ Cannot determine IIIF Image API version from provided image information JSON.

 A `WebGLArrayBuffer` must either be of type `ELEMENT_ARRAY_BUFFER` or `ARRAY_BUFFER`.

-### 63
-
-Support for the `OES_element_index_uint` WebGL extension is mandatory for WebGL layers.
-
 ### 64

 Layer opacity must be a number.
--- a/doc/quickstart.hbs
+++ b/doc/quickstart.hbs
@@ -18,6 +18,7 @@ Below you'll find a complete working example.  Create a new file, copy in the co
 <!doctype html>
 <html lang="en">
  <head>
+    <meta charset="utf-8">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/{{ latest }}/css/ol.css" type="text/css">
    <style>
      .map {
--- a/examples/.eslintrc
+++ b/examples/.eslintrc
@@ -13,6 +13,7 @@
    "jsts": false,
    "JSZip": false,
    "mapboxgl": false,
+    "NumpyLoader": false,
    "saveAs": false,
    "toastr": false,
    "topojson": false,
--- a/examples/cluster.js
+++ b/examples/cluster.js
@@ -77,13 +77,17 @@ const map = new Map({
  }),
 });

-distanceInput.addEventListener('input', function () {
+const distanceHandler = function () {
  clusterSource.setDistance(parseInt(distanceInput.value, 10));
-});
+};
+distanceInput.addEventListener('input', distanceHandler);
+distanceInput.addEventListener('change', distanceHandler);

-minDistanceInput.addEventListener('input', function () {
+const minDistanceHandler = function () {
  clusterSource.setMinDistance(parseInt(minDistanceInput.value, 10));
-});
+};
+minDistanceInput.addEventListener('input', minDistanceHandler);
+minDistanceInput.addEventListener('change', minDistanceHandler);

 map.on('click', (e) => {
  clusters.getFeatures(e.pixel).then((clickedFeatures) => {
--- a/examples/cog-math-multisource.js
+++ b/examples/cog-math-multisource.js
@@ -1,7 +1,6 @@
 import GeoTIFF from '../src/ol/source/GeoTIFF.js';
 import Map from '../src/ol/Map.js';
 import TileLayer from '../src/ol/layer/WebGLTile.js';
-import View from '../src/ol/View.js';

 const source = new GeoTIFF({
  sources: [
@@ -57,9 +56,5 @@ const map = new Map({
      source,
    }),
  ],
-  view: new View({
-    center: [1900000, 6100000],
-    zoom: 13,
-    minZoom: 10,
-  }),
+  view: source.getView(),
 });
--- a/examples/cog-math.js
+++ b/examples/cog-math.js
@@ -1,16 +1,21 @@
 import GeoTIFF from '../src/ol/source/GeoTIFF.js';
 import Map from '../src/ol/Map.js';
 import TileLayer from '../src/ol/layer/WebGLTile.js';
-import View from '../src/ol/View.js';
-import proj4 from 'proj4';
-import {getCenter} from '../src/ol/extent.js';
-import {register} from '../src/ol/proj/proj4.js';

-proj4.defs('EPSG:32636', '+proj=utm +zone=36 +datum=WGS84 +units=m +no_defs');
-register(proj4);
-
-// metadata from https://s3.us-west-2.amazonaws.com/sentinel-cogs/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/S2A_36QWD_20200701_0_L2A.json
-const sourceExtent = [499980, 1790220, 609780, 1900020];
+const source = new GeoTIFF({
+  sources: [
+    {
+      // visible red, band 1 in the style expression above
+      url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/B04.tif',
+      max: 10000,
+    },
+    {
+      // near infrared, band 2 in the style expression above
+      url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/B08.tif',
+      max: 10000,
+    },
+  ],
+});

 const map = new Map({
  target: 'map',
@@ -69,27 +74,8 @@ const map = new Map({
          [0, 69, 0],
        ],
      },
-      source: new GeoTIFF({
-        sources: [
-          {
-            // visible red, band 1 in the style expression above
-            url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/B04.tif',
-            max: 10000,
-          },
-          {
-            // near infrared, band 2 in the style expression above
-            url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/B08.tif',
-            max: 10000,
-          },
-        ],
-      }),
-      extent: sourceExtent,
+      source: source,
    }),
  ],
-  view: new View({
-    projection: 'EPSG:32636',
-    center: getCenter(sourceExtent),
-    extent: sourceExtent,
-    zoom: 9,
-  }),
+  view: source.getView(),
 });
--- a/examples/cog-overviews.js
+++ b/examples/cog-overviews.js
@@ -1,62 +1,49 @@
 import GeoTIFF from '../src/ol/source/GeoTIFF.js';
 import Map from '../src/ol/Map.js';
 import TileLayer from '../src/ol/layer/WebGLTile.js';
-import View from '../src/ol/View.js';
-import proj4 from 'proj4';
-import {getCenter} from '../src/ol/extent.js';
-import {register} from '../src/ol/proj/proj4.js';
-
-proj4.defs('EPSG:32645', '+proj=utm +zone=45 +datum=WGS84 +units=m +no_defs');
-register(proj4);
-
-const sourceExtent = [382200, 2279370, 610530, 2512500];
-
-const base =
-  'https://landsat-pds.s3.amazonaws.com/c1/L8/139/045/LC08_L1TP_139045_20170304_20170316_01_T1/LC08_L1TP_139045_20170304_20170316_01_T1';

 // scale values in this range to 0 - 1
 const min = 10000;
 const max = 15000;

+const base =
+  'https://landsat-pds.s3.amazonaws.com/c1/L8/139/045/LC08_L1TP_139045_20170304_20170316_01_T1/LC08_L1TP_139045_20170304_20170316_01_T1';
+
+const source = new GeoTIFF({
+  sources: [
+    {
+      url: `${base}_B6.TIF`,
+      overviews: [`${base}_B6.TIF.ovr`],
+      min: min,
+      max: max,
+      nodata: 0,
+    },
+    {
+      url: `${base}_B5.TIF`,
+      overviews: [`${base}_B5.TIF.ovr`],
+      min: min,
+      max: max,
+      nodata: 0,
+    },
+    {
+      url: `${base}_B3.TIF`,
+      overviews: [`${base}_B3.TIF.ovr`],
+      min: min,
+      max: max,
+      nodata: 0,
+    },
+  ],
+});
+
 const map = new Map({
  target: 'map',
  layers: [
    new TileLayer({
-      extent: sourceExtent,
      style: {
        saturation: -0.3,
      },
-      source: new GeoTIFF({
-        sources: [
-          {
-            url: `${base}_B6.TIF`,
-            overviews: [`${base}_B6.TIF.ovr`],
-            min: min,
-            max: max,
-            nodata: 0,
-          },
-          {
-            url: `${base}_B5.TIF`,
-            overviews: [`${base}_B5.TIF.ovr`],
-            min: min,
-            max: max,
-            nodata: 0,
-          },
-          {
-            url: `${base}_B3.TIF`,
-            overviews: [`${base}_B3.TIF.ovr`],
-            min: min,
-            max: max,
-            nodata: 0,
-          },
-        ],
-      }),
+      source: source,
    }),
  ],
-  view: new View({
-    projection: 'EPSG:32645',
-    center: getCenter(sourceExtent),
-    extent: sourceExtent,
-    zoom: 8,
-  }),
+  view: source.getView(),
 });
--- a/examples/cog.js
+++ b/examples/cog.js
@@ -1,35 +1,21 @@
 import GeoTIFF from '../src/ol/source/GeoTIFF.js';
 import Map from '../src/ol/Map.js';
 import TileLayer from '../src/ol/layer/WebGLTile.js';
-import View from '../src/ol/View.js';
-import proj4 from 'proj4';
-import {getCenter} from '../src/ol/extent.js';
-import {register} from '../src/ol/proj/proj4.js';

-proj4.defs('EPSG:32636', '+proj=utm +zone=36 +datum=WGS84 +units=m +no_defs');
-register(proj4);
-
-// metadata from https://s3.us-west-2.amazonaws.com/sentinel-cogs/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/S2A_36QWD_20200701_0_L2A.json
-const sourceExtent = [499980, 1790220, 609780, 1900020];
+const source = new GeoTIFF({
+  sources: [
+    {
+      url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/TCI.tif',
+    },
+  ],
+});

 const map = new Map({
  target: 'map',
  layers: [
    new TileLayer({
-      source: new GeoTIFF({
-        sources: [
-          {
-            url: 'https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/2020/S2A_36QWD_20200701_0_L2A/TCI.tif',
-          },
-        ],
-      }),
-      extent: sourceExtent,
+      source: source,
    }),
  ],
-  view: new View({
-    projection: 'EPSG:32636',
-    center: getCenter(sourceExtent),
-    extent: sourceExtent,
-    zoom: 9,
-  }),
+  view: source.getView(),
 });
--- a/examples/color-manipulation.js
+++ b/examples/color-manipulation.js
@@ -166,10 +166,12 @@ const controlIds = ['hue', 'chroma', 'lightness'];
 controlIds.forEach(function (id) {
  const control = document.getElementById(id);
  const output = document.getElementById(id + 'Out');
-  control.addEventListener('input', function () {
+  const listener = function () {
    output.innerText = control.value;
    raster.changed();
-  });
+  };
+  control.addEventListener('input', listener);
+  control.addEventListener('change', listener);
  output.innerText = control.value;
  controls[id] = control;
 });
--- a/examples/custom-interactions.html
+++ b/examples/custom-interactions.html
@@ -7,7 +7,7 @@ docs: >
  Note that the built in interaction `ol/interaction/Translate` might be a better option for moving features.
 tags: "drag, feature, vector, editing, custom, interaction"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/custom-interactions.js
+++ b/examples/custom-interactions.js
@@ -131,7 +131,7 @@ const polygonFeature = new Feature(
 );

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const map = new Map({
  interactions: defaultInteractions().extend([new Drag()]),
--- a/examples/data-tiles.js
+++ b/examples/data-tiles.js
@@ -31,7 +31,8 @@ const map = new Map({
          context.fillText(`y: ${y}`, half, half + lineHeight);
          context.strokeRect(0, 0, size, size);
          const data = context.getImageData(0, 0, size, size).data;
-          return Promise.resolve(data);
+          // converting to Uint8Array for increased browser compatibility
+          return Promise.resolve(new Uint8Array(data.buffer));
        },
        // disable opacity transition to avoid overlapping labels during tile loading
        transition: 0,
--- a/examples/disable-image-smoothing.js
+++ b/examples/disable-image-smoothing.js
@@ -56,10 +56,12 @@ imagery.on('prerender', function (evt) {

 const control = document.getElementById('opacity');
 const output = document.getElementById('output');
-control.addEventListener('input', function () {
+const listener = function () {
  output.innerText = control.value;
  imagery.setOpacity(control.value / 100);
-});
+};
+control.addEventListener('input', listener);
+control.addEventListener('change', listener);
 output.innerText = control.value;
 imagery.setOpacity(control.value / 100);

--- a/examples/igc.js
+++ b/examples/igc.js
@@ -179,8 +179,9 @@ const featureOverlay = new VectorLayer({
  }),
 });

-document.getElementById('time').addEventListener('input', function () {
-  const value = parseInt(this.value, 10) / 100;
+const control = document.getElementById('time');
+const listener = function () {
+  const value = parseInt(control.value, 10) / 100;
  const m = time.start + time.duration * value;
  vectorSource.forEachFeature(function (feature) {
    const geometry =
@@ -198,4 +199,6 @@ document.getElementById('time').addEventListener('input', function () {
    }
  });
  map.render();
-});
+};
+control.addEventListener('input', listener);
+control.addEventListener('change', listener);
--- a/examples/layer-extent.html
+++ b/examples/layer-extent.html
@@ -8,7 +8,7 @@ docs: >
  to limit rendering based on an extent (approximate country bounds).
 tags: "extent, tilejson"
 cloak:
- key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+- key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
  value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/layer-extent.js
+++ b/examples/layer-extent.js
@@ -16,7 +16,7 @@ const extents = {
 };

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const base = new TileLayer({
  source: new TileJSON({
--- a/examples/layer-group.html
+++ b/examples/layer-group.html
@@ -8,7 +8,7 @@ tags: "tilejson, input, bind, group, layergroup"
 resources:
  - https://code.jquery.com/jquery-3.5.1.min.js
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/layer-group.js
+++ b/examples/layer-group.js
@@ -6,7 +6,7 @@ import {Group as LayerGroup, Tile as TileLayer} from '../src/ol/layer.js';
 import {fromLonLat} from '../src/ol/proj.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const map = new Map({
  layers: [
@@ -49,7 +49,7 @@ function bindInputs(layerid, layer) {
  visibilityInput.prop('checked', layer.getVisible());

  const opacityInput = $(layerid + ' input.opacity');
-  opacityInput.on('input', function () {
+  opacityInput.on('input change', function () {
    layer.setOpacity(parseFloat(this.value));
  });
  opacityInput.val(String(layer.getOpacity()));
--- a/examples/layer-swipe.js
+++ b/examples/layer-swipe.js
@@ -57,10 +57,8 @@ aerial.on('postrender', function (event) {
  ctx.restore();
 });

-swipe.addEventListener(
-  'input',
-  function () {
-    map.render();
-  },
-  false
-);
+const listener = function () {
+  map.render();
+};
+swipe.addEventListener('input', listener);
+swipe.addEventListener('change', listener);
--- a/examples/mapbox-vector-layer.html
+++ b/examples/mapbox-vector-layer.html
@@ -9,7 +9,7 @@ docs: >
  layers (provided they all share the same source).
 tags: "mapbox, studio, vector, tiles"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/mapbox-vector-layer.js
+++ b/examples/mapbox-vector-layer.js
@@ -8,7 +8,7 @@ const map = new Map({
    new MapboxVector({
      styleUrl: 'mapbox://styles/mapbox/bright-v9',
      accessToken:
-        'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q',
+        'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ',
    }),
  ],
  view: new View({
--- a/examples/mapbox-vector-tiles-advanced.html
+++ b/examples/mapbox-vector-tiles-advanced.html
@@ -8,7 +8,7 @@ tags: "mapbox, vector, tiles, mobile, grid"
 resources:
  - resources/mapbox-streets-v6-style.js
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/mapbox-vector-tiles-advanced.js
+++ b/examples/mapbox-vector-tiles-advanced.js
@@ -8,7 +8,7 @@ import {Fill, Icon, Stroke, Style, Text} from '../src/ol/style.js';
 import {get as getProjection} from '../src/ol/proj.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 // Calculation of resolutions that match zoom levels 1, 3, 5, 7, 9, 11, 13, 15.
 const resolutions = [];
--- a/examples/mapbox-vector-tiles.html
+++ b/examples/mapbox-vector-tiles.html
@@ -8,7 +8,7 @@ tags: "simple, mapbox, vector, tiles"
 resources:
  - resources/mapbox-streets-v6-style.js
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/mapbox-vector-tiles.js
+++ b/examples/mapbox-vector-tiles.js
@@ -6,7 +6,7 @@ import View from '../src/ol/View.js';
 import {Fill, Icon, Stroke, Style, Text} from '../src/ol/style.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const map = new Map({
  layers: [
--- a/examples/min-max-resolution.html
+++ b/examples/min-max-resolution.html
@@ -8,7 +8,7 @@ docs: >
  <p>The rendering of the layers are here controlled using minResolution and maxResolution options.</p>
 tags: "minResolution, maxResolution, resolution"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/min-max-resolution.js
+++ b/examples/min-max-resolution.js
@@ -5,7 +5,7 @@ import TileLayer from '../src/ol/layer/Tile.js';
 import View from '../src/ol/View.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 /**
 * Create the map.
--- a/examples/numpytile.css
+++ b/examples/numpytile.css
@@ -0,0 +1,3 @@
+input[type="range"] {
+  vertical-align: text-bottom;
+}
--- a/examples/numpytile.html
+++ b/examples/numpytile.html
@@ -0,0 +1,22 @@
+---
+layout: example.html
+title: Rendering 16-bit NumpyTiles
+shortdesc: Renders a multi-byte depth source image directly using WebGL.
+docs: >
+  This example uses a <code>ol/source/DataTile</code> source to load multi-byte raster data in the
+  <a href="https://github.com/planetlabs/numpytiles-spec/">NumpyTile</a> format.
+  The source is rendered with a <code>ol/layer/WebGLTile</code> layer.  Adjusting the sliders above
+  performs a contrast stretch by adjusting the style variables set on the layer.
+tags: "numpytiles, webgl"
+resources:
+  - https://unpkg.com/@planet/ol-numpytiles@2.0.2/umd/NumpyLoader.js
+---
+<div id="map" class="map"></div>
+
+<div>
+  <h5>Contrast stretch</h5>
+  <ul>
+    <li>Min <input type="range" min="1000" max="10000" id="input-min"/> <span id="output-min"></span></li>
+    <li>Max <input type="range" min="10000" max="50000" id="input-max"/> <span id="output-max"></span></li>
+  </ul>
+</div>
--- a/examples/numpytile.js
+++ b/examples/numpytile.js
@@ -0,0 +1,109 @@
+import DataTileSource from '../src/ol/source/DataTile.js';
+import Map from '../src/ol/Map.js';
+import TileLayer from '../src/ol/layer/WebGLTile.js';
+import View from '../src/ol/View.js';
+import {fromLonLat} from '../src/ol/proj.js';
+
+// 16-bit COG
+// Which will be served as NumpyTiles.
+const COG =
+  'https://storage.googleapis.com/open-cogs/stac-examples/20201211_223832_CS2_analytic.tif';
+
+function numpyTileLoader(z, x, y) {
+  const url = `https://api.cogeo.xyz/cog/tiles/WebMercatorQuad/${z}/${x}/${y}@1x?format=npy&url=${encodeURIComponent(
+    COG
+  )}`;
+
+  return fetch(url)
+    .then((r) => r.arrayBuffer())
+    .then((buffer) => NumpyLoader.fromArrayBuffer(buffer))
+    .then((numpyData) => {
+      // flatten the numpy data
+      const dataTile = new Float32Array(256 * 256 * 5);
+      const bandSize = 256 * 256;
+      for (let x = 0; x < 256; x++) {
+        for (let y = 0; y < 256; y++) {
+          const px = x + y * 256;
+          dataTile[px * 5 + 0] = numpyData.data[y * 256 + x];
+          dataTile[px * 5 + 1] = numpyData.data[bandSize + y * 256 + x];
+          dataTile[px * 5 + 2] = numpyData.data[bandSize * 2 + y * 256 + x];
+          dataTile[px * 5 + 3] = numpyData.data[bandSize * 3 + y * 256 + x];
+          dataTile[px * 5 + 4] =
+            numpyData.data[bandSize * 4 + y * 256 + x] > 0 ? 1.0 : 0;
+        }
+      }
+      return dataTile;
+    });
+}
+
+const interpolateBand = (bandIdx) => [
+  'interpolate',
+  ['linear'],
+  ['band', bandIdx],
+  ['var', 'bMin'],
+  0,
+  ['var', 'bMax'],
+  1,
+];
+
+const initialMin = 3000;
+const initialMax = 18000;
+
+const numpyLayer = new TileLayer({
+  style: {
+    color: [
+      'array',
+      interpolateBand(3),
+      interpolateBand(2),
+      interpolateBand(1),
+      ['band', 5],
+    ],
+    variables: {
+      'bMin': initialMin,
+      'bMax': initialMax,
+    },
+  },
+  source: new DataTileSource({
+    loader: numpyTileLoader,
+    bandCount: 5,
+  }),
+});
+
+const map = new Map({
+  target: 'map',
+  layers: [numpyLayer],
+  view: new View({
+    center: fromLonLat([172.933, 1.3567]),
+    zoom: 15,
+  }),
+});
+
+const inputMin = document.getElementById('input-min');
+const inputMax = document.getElementById('input-max');
+const outputMin = document.getElementById('output-min');
+const outputMax = document.getElementById('output-max');
+
+const handleMin = (evt) => {
+  numpyLayer.updateStyleVariables({
+    'bMin': parseFloat(evt.target.value),
+    'bMax': parseFloat(inputMax.value),
+  });
+  outputMin.innerText = evt.target.value;
+};
+inputMin.addEventListener('input', handleMin);
+inputMin.addEventListener('change', handleMin);
+
+const handleMax = (evt) => {
+  numpyLayer.updateStyleVariables({
+    'bMin': parseFloat(inputMin.value),
+    'bMax': parseFloat(evt.target.value),
+  });
+  outputMax.innerText = evt.target.value;
+};
+inputMax.addEventListener('input', handleMax);
+inputMax.addEventListener('change', handleMax);
+
+inputMin.value = initialMin;
+inputMax.value = initialMax;
+outputMin.innerText = initialMin;
+outputMax.innerText = initialMax;
--- a/examples/offscreen-canvas.worker.js
+++ b/examples/offscreen-canvas.worker.js
@@ -88,6 +88,9 @@ function loadStyles() {
              this.context = context;
              this.container = {
                firstElementChild: canvas,
+                style: {
+                  opacity: layer.getOpacity(),
+                },
              };
              rendererTransform = transform;
            };
--- a/examples/region-growing.js
+++ b/examples/region-growing.js
@@ -137,7 +137,9 @@ function updateControlValue() {
 }
 updateControlValue();

-thresholdControl.addEventListener('input', function () {
+const listener = function () {
  updateControlValue();
  raster.changed();
-});
+};
+thresholdControl.addEventListener('input', listener);
+thresholdControl.addEventListener('change', listener);
--- a/examples/resources/Promise.allSettled.js
+++ b/examples/resources/Promise.allSettled.js
@@ -0,0 +1,21 @@
+if (typeof Promise !== 'undefined' && !Promise.allSettled && Array.from) {
+  Promise.allSettled = 
+    function (promises) {
+      return Promise.all(
+        Array.from(
+          promises,
+          function (p) {
+            return p.then (
+              function (value) {
+                return {status: 'fulfilled', value: value};
+              }
+            ).catch(
+              function (reason) {
+                return {status: 'rejected', reason: reason};
+              }
+            );
+          }
+        )
+      )
+    };
+}
--- a/examples/resources/layout.css
+++ b/examples/resources/layout.css
@@ -122,13 +122,15 @@ ol.inline>li {
  background: url(map-background.jpg) repeat;
  margin-bottom: 10px;
 }
+
+.ol-control {
+  line-height: normal;
+}
+
 .ol-attribution.ol-logo-only,
 .ol-attribution.ol-uncollapsible {
  max-width: calc(100% - 3em);
 }
-.ol-attribution ul {
-  font-size: 14px;
-}
 .iframe-info iframe {
  width: 100%;
 }
--- a/examples/reusable-source.html
+++ b/examples/reusable-source.html
@@ -5,7 +5,7 @@ shortdesc: Updating a tile source by changing the URL.
 docs: >
  You can call <code>source.setUrl()</code> to update the URL for a tile source.  Note that when you change the URL for a tile source, existing tiles will not be replaced until new tiles are loaded.  If you are interested instead in clearing currently rendered tiles, you can call the <code>source.refresh()</code> method.  Alternatively, you can use two separate sources if you want to remove rendered tiles and start over loading new tiles.
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/reusable-source.js
+++ b/examples/reusable-source.js
@@ -4,7 +4,7 @@ import View from '../src/ol/View.js';
 import XYZ from '../src/ol/source/XYZ.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';
 const baseUrl = 'https://{a-c}.tiles.mapbox.com/v4';
 const urls = [
  baseUrl + '/mapbox.blue-marble-topo-jan/{z}/{x}/{y}.png?access_token=' + key,
--- a/examples/sea-level.js
+++ b/examples/sea-level.js
@@ -67,10 +67,12 @@ const map = new Map({

 const control = document.getElementById('level');
 const output = document.getElementById('output');
-control.addEventListener('input', function () {
+const listener = function () {
  output.innerText = control.value;
  raster.changed();
-});
+};
+control.addEventListener('input', listener);
+control.addEventListener('change', listener);
 output.innerText = control.value;

 raster.on('beforeoperations', function (event) {
--- a/examples/semi-transparent-layer.html
+++ b/examples/semi-transparent-layer.html
@@ -6,7 +6,7 @@ docs: >
  This example will display a tiled MaxBox layer semi-transparently over an OSM background. The OSM layer is changed to black and white by using a CSS filter.
 tags: "transparent, osm, tilejson, css"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/semi-transparent-layer.js
+++ b/examples/semi-transparent-layer.js
@@ -6,7 +6,7 @@ import View from '../src/ol/View.js';
 import {fromLonLat} from '../src/ol/proj.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const map = new Map({
  layers: [
--- a/examples/shaded-relief.js
+++ b/examples/shaded-relief.js
@@ -159,10 +159,12 @@ const controls = {};
 controlIds.forEach(function (id) {
  const control = document.getElementById(id);
  const output = document.getElementById(id + 'Out');
-  control.addEventListener('input', function () {
+  const listener = function () {
    output.innerText = control.value;
    raster.changed();
-  });
+  };
+  control.addEventListener('input', listener);
+  control.addEventListener('change', listener);
  output.innerText = control.value;
  controls[id] = control;
 });
--- a/examples/templates/example.html
+++ b/examples/templates/example.html
@@ -69,6 +69,7 @@
    <link rel="stylesheet" href="./resources/layout.css" type="text/css">
    <script src="https://unpkg.com/elm-pep"></script>
    <script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList,URL,TextDecoder,Number.isInteger"></script>
+    <script src="./resources/Promise.allSettled.js"></script>
    {{{ extraHead.local }}}
    {{{ css.tag }}}
    <title>{{ title }}</title>
--- a/examples/tile-load-events.html
+++ b/examples/tile-load-events.html
@@ -10,7 +10,7 @@ docs: >
  renders a tile loading progress bar at the bottom of the map.</p>
 tags: "tile, events, loading"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div class="wrapper">
--- a/examples/utfgrid.html
+++ b/examples/utfgrid.html
@@ -7,7 +7,7 @@ docs: >
  Tiles made with <a href="https://tilemill-project.github.io/tilemill/">TileMill</a>. Hosting on <a href="https://www.mapbox.com/">mapbox.com</a> or with open-source <a href="https://github.com/maptiler/tileserver-php">TileServer</a>.
 tags: "utfgrid, tilejson"
 cloak:
-  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q
+  - key: pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ
    value: Your Mapbox access token from https://mapbox.com/ here
 ---
 <div id="map" class="map"></div>
--- a/examples/utfgrid.js
+++ b/examples/utfgrid.js
@@ -6,7 +6,7 @@ import UTFGrid from '../src/ol/source/UTFGrid.js';
 import View from '../src/ol/View.js';

 const key =
-  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2pzbmg0Nmk5MGF5NzQzbzRnbDNoeHJrbiJ9.7_-_gL8ur7ZtEiNwRfCy7Q';
+  'pk.eyJ1IjoiYWhvY2V2YXIiLCJhIjoiY2t0cGdwMHVnMGdlbzMxbDhwazBic2xrNSJ9.WbcTL9uj8JPAsnT9mgb7oQ';

 const mapLayer = new TileLayer({
  source: new TileJSON({
--- a/examples/vector-wfs-geographic.html
+++ b/examples/vector-wfs-geographic.html
@@ -0,0 +1,16 @@
+---
+layout: example.html
+title: WFS with geographic coordinates
+shortdesc: Example of using WFS with a Tile strategy.
+docs: >
+  This example loads new features from GeoServer WFS with a tile based loading strategy.
+  Calling the <code>useGeographic</code> function in the <code>'ol/proj'</code> module
+  makes it so the map view uses geographic coordinates (even if the view projection is
+  not geographic).
+tags: "geographic, vector, WFS, tile, strategy, loading, server, maptiler"
+cloak:
+  - key: get_your_own_D6rA4zTHduk6KOKTXzGB
+    value: Get your own API key at https://www.maptiler.com/cloud/
+experimental: true
+---
+<div id="map" class="map"></div>
--- a/examples/vector-wfs-geographic.js
+++ b/examples/vector-wfs-geographic.js
@@ -0,0 +1,60 @@
+import GeoJSON from '../src/ol/format/GeoJSON.js';
+import Map from '../src/ol/Map.js';
+import VectorSource from '../src/ol/source/Vector.js';
+import View from '../src/ol/View.js';
+import XYZ from '../src/ol/source/XYZ.js';
+import {Stroke, Style} from '../src/ol/style.js';
+import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import {createXYZ} from '../src/ol/tilegrid.js';
+import {tile} from '../src/ol/loadingstrategy.js';
+import {useGeographic} from '../src/ol/proj.js';
+
+useGeographic();
+
+const vectorSource = new VectorSource({
+  format: new GeoJSON(),
+  url: function (extent) {
+    return (
+      'https://ahocevar.com/geoserver/wfs?service=WFS&' +
+      'version=1.1.0&request=GetFeature&typename=osm:water_areas&' +
+      'outputFormat=application/json&srsname=EPSG:4326&' +
+      'bbox=' +
+      extent.join(',') +
+      ',EPSG:4326'
+    );
+  },
+  strategy: tile(createXYZ({tileSize: 512})),
+});
+
+const vector = new VectorLayer({
+  source: vectorSource,
+  style: new Style({
+    stroke: new Stroke({
+      color: 'rgba(0, 0, 255, 1.0)',
+      width: 2,
+    }),
+  }),
+});
+
+const key = 'get_your_own_D6rA4zTHduk6KOKTXzGB';
+const attributions =
+  '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
+  '<a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>';
+
+const raster = new TileLayer({
+  source: new XYZ({
+    attributions: attributions,
+    url: 'https://api.maptiler.com/tiles/satellite/{z}/{x}/{y}.jpg?key=' + key,
+    maxZoom: 20,
+  }),
+});
+
+const map = new Map({
+  layers: [raster, vector],
+  target: document.getElementById('map'),
+  view: new View({
+    center: [-80.0298, 43.4578],
+    maxZoom: 19,
+    zoom: 12,
+  }),
+});
--- a/examples/webgl-sea-level.html
+++ b/examples/webgl-sea-level.html
@@ -11,7 +11,7 @@ docs: >
    values ranging from 0 to 1.  The <code>band</code> operator is used to select normalized values
    from a single band.
  </p><p>
-    After converting the normalized RGB values to elevation, the <code>interpolate</code> expression
+    After converting the normalized RGB values to elevation, the <code>case</code> expression
    is used to pick colors to apply at a given elevation.  Instead of using constant
    numeric values as the stops in the colors array, the <code>var</code> operator allows you to
    use a value that can be modified by your application.  When the user drags the
--- a/examples/webgl-sea-level.js
+++ b/examples/webgl-sea-level.js
@@ -9,7 +9,24 @@ const attributions =
  '<a href="https://www.maptiler.com/copyright/" target="_blank">&copy; MapTiler</a> ' +
  '<a href="https://www.openstreetmap.org/copyright" target="_blank">&copy; OpenStreetMap contributors</a>';

-const elevation = new TileLayer({
+// band math operates on normalized values from 0-1
+// so we scale by 255 to align with the elevation formula
+// from https://cloud.maptiler.com/tiles/terrain-rgb/
+const elevation = [
+  '+',
+  -10000,
+  [
+    '*',
+    0.1 * 255,
+    [
+      '+',
+      ['*', 256 * 256, ['band', 1]],
+      ['+', ['*', 256, ['band', 2]], ['band', 3]],
+    ],
+  ],
+];
+
+const layer = new TileLayer({
  opacity: 0.6,
  source: new XYZ({
    url:
@@ -23,28 +40,10 @@ const elevation = new TileLayer({
      level: 0,
    },
    color: [
-      'interpolate',
-      ['linear'],
-      // band math operates on normalized values from 0-1
-      // so we scale by 255 to align with the elevation formula
-      // from https://cloud.maptiler.com/tiles/terrain-rgb/
-      [
-        '+',
-        -10000,
-        [
-          '*',
-          0.1 * 255,
-          [
-            '+',
-            ['*', 256 * 256, ['band', 1]],
-            ['+', ['*', 256, ['band', 2]], ['band', 3]],
-          ],
-        ],
-      ],
-      // use the `level` style variable as a stop in the color ramp
-      ['var', 'level'],
+      'case',
+      // use the `level` style variable to determine the color
+      ['<=', elevation, ['var', 'level']],
      [139, 212, 255, 1],
-      ['+', 0.01, ['var', 'level']],
      [139, 212, 255, 0],
    ],
  },
@@ -61,7 +60,7 @@ const map = new Map({
        tileSize: 512,
      }),
    }),
-    elevation,
+    layer,
  ],
  view: new View({
    center: fromLonLat([-122.3267, 37.8377]),
@@ -71,10 +70,12 @@ const map = new Map({

 const control = document.getElementById('level');
 const output = document.getElementById('output');
-control.addEventListener('input', function () {
+const listener = function () {
  output.innerText = control.value;
-  elevation.updateStyleVariables({level: parseFloat(control.value)});
-});
+  layer.updateStyleVariables({level: parseFloat(control.value)});
+};
+control.addEventListener('input', listener);
+control.addEventListener('change', listener);
 output.innerText = control.value;

 const locations = document.getElementsByClassName('location');
--- a/examples/webgl-shaded-relief.js
+++ b/examples/webgl-shaded-relief.js
@@ -67,10 +67,12 @@ controlIds.forEach(function (id) {
    variables[id] = Number(control.value);
  }
  updateValues();
-  control.addEventListener('input', () => {
+  const listener = function () {
    updateValues();
    shadedRelief.updateStyleVariables(variables);
-  });
+  };
+  control.addEventListener('input', listener);
+  control.addEventListener('change', listener);
 });

 const map = new Map({
--- a/examples/webgl-tile-style.js
+++ b/examples/webgl-tile-style.js
@@ -38,18 +38,20 @@ const map = new Map({
  }),
 });

-for (const name in variables) {
+let variable;
+for (variable in variables) {
+  const name = variable;
  const element = document.getElementById(name);
  const value = variables[name];
  element.value = value.toString();
-  document.getElementById(`${name}-value`).innerText = `(${value})`;
-
-  element.addEventListener('input', function (event) {
+  document.getElementById(name + '-value').innerText = value.toFixed(2);
+  const listener = function (event) {
    const value = parseFloat(event.target.value);
-    document.getElementById(`${name}-value`).innerText = `(${value})`;
-
+    document.getElementById(name + '-value').innerText = value.toFixed(2);
    const updates = {};
    updates[name] = value;
    layer.updateStyleVariables(updates);
-  });
+  };
+  element.addEventListener('input', listener);
+  element.addEventListener('change', listener);
 }
--- a/examples/webpack/config.mjs
+++ b/examples/webpack/config.mjs
@@ -18,7 +18,7 @@ export default {
      .filter((name) => /^(?!index).*\.html$/.test(name))
      .map((name) => name.replace(/\.html$/, ''))
      .forEach((example) => {
-        entry[example] = `./${example}.js`;
+        entry[example] = ['regenerator-runtime/runtime', `./${example}.js`];
      });
    return entry;
  },
@@ -28,25 +28,13 @@ export default {
      {
        test: /^((?!es2015-)[\s\S])*\.js$/,
        use: {
-          loader: 'buble-loader',
+          loader: 'babel-loader',
          options: {
-            transforms: {
-              dangerousForOf: true,
-            },
+            presets: [
+              ['@babel/preset-env', {targets: 'last 2 versions, not dead'}],
+            ],
          },
        },
-        include: [
-          path.join(baseDir, '..', '..', 'src'),
-          path.join(baseDir, '..'),
-          path.join(
-            baseDir,
-            '..',
-            '..',
-            'node_modules',
-            '@mapbox',
-            'mapbox-gl-style-spec'
-          ),
-        ],
      },
      {
        test: /\.js$/,
@@ -63,10 +51,6 @@ export default {
        // Do not minify examples that inject code into workers
        exclude: [/(color-manipulation|region-growing|raster)\.js/],
        extractComments: false,
-        terserOptions: {
-          // Mangle private members convention with underscore suffix
-          mangle: {properties: {regex: /_$/}},
-        },
      }),
    ],
    runtimeChunk: {
--- a/examples/webpack/example-builder.js
+++ b/examples/webpack/example-builder.js
@@ -1,5 +1,6 @@
 import assert from 'assert';
 import frontMatter from 'front-matter';
+import fs from 'fs';
 import fse from 'fs-extra';
 import handlebars from 'handlebars';
 import marked from 'marked';
@@ -17,6 +18,11 @@ const isTemplateJs =
  /\/(jquery(-\d+\.\d+\.\d+)?|(bootstrap(\.bundle)?))(\.min)?\.js(\?.*)?$/;
 const isTemplateCss = /\/bootstrap(\.min)?\.css(\?.*)?$/;

+const exampleDirContents = fs
+  .readdirSync(path.join(baseDir, '..'))
+  .filter((name) => /^(?!index).*\.html$/.test(name))
+  .map((name) => name.replace(/\.html$/, ''));
+
 let cachedPackageInfo = null;
 async function getPackageInfo() {
  if (cachedPackageInfo) {
@@ -188,7 +194,7 @@ export default class ExampleBuilder {
      }

      const name = filename.replace(/\.js$/, '');
-      if (name === 'index' || name === this.common) {
+      if (!exampleDirContents.includes(name)) {
        continue;
      }

--- a/examples/wmts-dimensions.js
+++ b/examples/wmts-dimensions.js
@@ -61,13 +61,11 @@ const map = new Map({
  ],
 });

-const updateSourceDimension = function (source, sliderVal) {
-  source.updateDimensions({'threshold': sliderVal});
-  document.getElementById('theinfo').innerHTML = sliderVal + ' meters';
+const slider = document.getElementById('slider');
+const updateSourceDimension = function () {
+  wmtsSource.updateDimensions({'threshold': slider.value});
+  document.getElementById('theinfo').innerHTML = slider.value + ' meters';
 };
-
-updateSourceDimension(wmtsSource, 10);
-
-document.getElementById('slider').addEventListener('input', function () {
-  updateSourceDimension(wmtsSource, this.value);
-});
+slider.addEventListener('input', updateSourceDimension);
+slider.addEventListener('change', updateSourceDimension);
+updateSourceDimension();
--- a/examples/wmts.js
+++ b/examples/wmts.js
@@ -10,9 +10,9 @@ import {getTopLeft, getWidth} from '../src/ol/extent.js';
 const projection = getProjection('EPSG:3857');
 const projectionExtent = projection.getExtent();
 const size = getWidth(projectionExtent) / 256;
-const resolutions = new Array(14);
-const matrixIds = new Array(14);
-for (let z = 0; z < 14; ++z) {
+const resolutions = new Array(19);
+const matrixIds = new Array(19);
+for (let z = 0; z < 19; ++z) {
  // generate resolutions and matrixIds arrays for this WMTS
  resolutions[z] = size / Math.pow(2, z);
  matrixIds[z] = z;
@@ -22,19 +22,16 @@ const map = new Map({
  layers: [
    new TileLayer({
      source: new OSM(),
-      opacity: 0.7,
    }),
    new TileLayer({
      opacity: 0.7,
      source: new WMTS({
        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/',
-        layer: '0',
-        matrixSet: 'EPSG:3857',
+          'Tiles © <a href="https://mrdata.usgs.gov/geology/state/"' +
+          ' target="_blank">USGS</a>',
+        url: 'https://mrdata.usgs.gov/mapcache/wmts',
+        layer: 'sgmc2',
+        matrixSet: 'GoogleMapsCompatible',
        format: 'image/png',
        projection: projection,
        tileGrid: new WMTSTileGrid({
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,16 +1,16 @@
 {
  "name": "ol",
-  "version": "6.7.0",
+  "version": "6.8.0",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "ol",
-      "version": "6.7.0",
+      "version": "6.8.0",
      "license": "BSD-2-Clause",
      "dependencies": {
-        "geotiff": "^1.0.5",
-        "ol-mapbox-style": "^6.4.1",
+        "geotiff": "1.0.6",
+        "ol-mapbox-style": "^6.5.1",
        "pbf": "3.2.1",
        "rbush": "^3.0.1"
      },
@@ -27,8 +27,6 @@
        "@types/pbf": "^3.0.2",
        "@types/topojson-specification": "^1.0.1",
        "babel-loader": "^8.2.2",
-        "buble": "^0.20.0",
-        "buble-loader": "^0.5.1",
        "chaikin-smooth": "^1.0.4",
        "clean-css-cli": "5.3.3",
        "copy-webpack-plugin": "^9.0.0",
@@ -57,7 +55,7 @@
        "karma-sourcemap-loader": "^0.3.8",
        "karma-webpack": "^5.0.0",
        "loglevelnext": "^5.0.5",
-        "marked": "3.0.2",
+        "marked": "3.0.4",
        "mocha": "9.1.1",
        "pixelmatch": "^5.1.0",
        "pngjs": "^6.0.0",
@@ -70,6 +68,7 @@
        "shx": "^0.3.2",
        "sinon": "^11.1.1",
        "terser-webpack-plugin": "^5.1.1",
+        "threads": "^1.6.5",
        "url-polyfill": "^1.1.5",
        "walk": "^2.3.9",
        "webpack": "^5.27.2",
@@ -137,9 +136,9 @@
      }
    },
    "node_modules/@babel/eslint-parser": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.15.4.tgz",
-      "integrity": "sha512-hPMIAmGNbmQzXJIo2P43Zj9UhRmGev5f9nqdBFOWNGDGh6XKmjby79woBvg6y0Jur6yRfQBneDbUQ8ZVc1krFw==",
+      "version": "7.15.7",
+      "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.15.7.tgz",
+      "integrity": "sha512-yJkHyomClm6A2Xzb8pdAo4HzYMSXFn1O5zrCYvbFP0yQFvHueLedV8WiEno8yJOKStjUXzBZzJFeWQ7b3YMsqQ==",
      "dev": true,
      "dependencies": {
        "eslint-scope": "^5.1.1",
@@ -682,16 +681,16 @@
      }
    },
    "node_modules/@babel/plugin-proposal-object-rest-spread": {
-      "version": "7.14.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.14.7.tgz",
-      "integrity": "sha512-082hsZz+sVabfmDWo1Oct1u1AgbKbUAyVgmX4otIc7bdsRgHBXwTwb3DpDmD4Eyyx6DNiuz5UAATT655k+kL5g==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.15.6.tgz",
+      "integrity": "sha512-qtOHo7A1Vt+O23qEAX+GdBpqaIuD3i9VRrWgCJeq7WO6H2d14EK3q11urj5Te2MAeK97nMiIdRpwd/ST4JFbNg==",
      "dev": true,
      "dependencies": {
-        "@babel/compat-data": "^7.14.7",
-        "@babel/helper-compilation-targets": "^7.14.5",
+        "@babel/compat-data": "^7.15.0",
+        "@babel/helper-compilation-targets": "^7.15.4",
        "@babel/helper-plugin-utils": "^7.14.5",
        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.14.5"
+        "@babel/plugin-transform-parameters": "^7.15.4"
      },
      "engines": {
        "node": ">=6.9.0"
@@ -1465,9 +1464,9 @@
      }
    },
    "node_modules/@babel/preset-env": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.4.tgz",
-      "integrity": "sha512-4f2nLw+q6ht8gl3sHCmNhmA5W6b1ItLzbH3UrKuJxACHr2eCpk96jwjrAfCAaXaaVwTQGnyUYHY2EWXJGt7TUQ==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.6.tgz",
+      "integrity": "sha512-L+6jcGn7EWu7zqaO2uoTDjjMBW+88FXzV8KvrBl2z6MtRNxlsmUNRlZPaNNPUTgqhyC5DHNFk/2Jmra+ublZWw==",
      "dev": true,
      "dependencies": {
        "@babel/compat-data": "^7.15.0",
@@ -1484,7 +1483,7 @@
        "@babel/plugin-proposal-logical-assignment-operators": "^7.14.5",
        "@babel/plugin-proposal-nullish-coalescing-operator": "^7.14.5",
        "@babel/plugin-proposal-numeric-separator": "^7.14.5",
-        "@babel/plugin-proposal-object-rest-spread": "^7.14.7",
+        "@babel/plugin-proposal-object-rest-spread": "^7.15.6",
        "@babel/plugin-proposal-optional-catch-binding": "^7.14.5",
        "@babel/plugin-proposal-optional-chaining": "^7.14.5",
        "@babel/plugin-proposal-private-methods": "^7.14.5",
@@ -1537,7 +1536,7 @@
        "@babel/plugin-transform-unicode-escapes": "^7.14.5",
        "@babel/plugin-transform-unicode-regex": "^7.14.5",
        "@babel/preset-modules": "^0.1.4",
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
        "babel-plugin-polyfill-corejs2": "^0.2.2",
        "babel-plugin-polyfill-corejs3": "^0.2.2",
        "babel-plugin-polyfill-regenerator": "^0.2.2",
@@ -1614,9 +1613,9 @@
      }
    },
    "node_modules/@babel/types": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.4.tgz",
-      "integrity": "sha512-0f1HJFuGmmbrKTCZtbm3cU+b/AqdEYk5toj5iQur58xkVMlS0JWaKxTBSmCXd47uiN7vbcozAupm6Mvs80GNhw==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.6.tgz",
+      "integrity": "sha512-BPU+7QhqNjmWyDO0/vitH/CuhpV8ZmK1wpKva8nuyNF5MJfuRNWMc+hc14+u9xT93kvykMdncrJT19h74uB1Ig==",
      "dev": true,
      "dependencies": {
        "@babel/helper-validator-identifier": "^7.14.9",
@@ -2323,6 +2322,7 @@
      "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
      "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==",
      "dev": true,
+      "peer": true,
      "bin": {
        "acorn": "bin/acorn"
      },
@@ -2330,15 +2330,6 @@
        "node": ">=0.4.0"
      }
    },
-    "node_modules/acorn-dynamic-import": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-4.0.0.tgz",
-      "integrity": "sha512-d3OEjQV4ROpoflsnUA8HozoIR504TFxNivYEUi6uwz0IYhBkTDXGuWlNdMtybRt3nqVx/L6XqMt0FxkXuWKZhw==",
-      "dev": true,
-      "peerDependencies": {
-        "acorn": "^6.0.0"
-      }
-    },
    "node_modules/acorn-jsx": {
      "version": "5.3.1",
      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.1.tgz",
@@ -2417,10 +2408,10 @@
        "node": ">=6"
      }
    },
-    "node_modules/ansi-html": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4=",
+    "node_modules/ansi-html-community": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/ansi-html-community/-/ansi-html-community-0.0.8.tgz",
+      "integrity": "sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw==",
      "dev": true,
      "engines": [
        "node >= 0.8.0"
@@ -2848,54 +2839,6 @@
        "url": "https://opencollective.com/browserslist"
      }
    },
-    "node_modules/buble": {
-      "version": "0.20.0",
-      "resolved": "https://registry.npmjs.org/buble/-/buble-0.20.0.tgz",
-      "integrity": "sha512-/1gnaMQE8xvd5qsNBl+iTuyjJ9XxeaVxAMF86dQ4EyxFJOZtsgOS8Ra+7WHgZTam5IFDtt4BguN0sH0tVTKrOw==",
-      "dev": true,
-      "dependencies": {
-        "acorn": "^6.4.1",
-        "acorn-dynamic-import": "^4.0.0",
-        "acorn-jsx": "^5.2.0",
-        "chalk": "^2.4.2",
-        "magic-string": "^0.25.7",
-        "minimist": "^1.2.5",
-        "regexpu-core": "4.5.4"
-      },
-      "bin": {
-        "buble": "bin/buble"
-      }
-    },
-    "node_modules/buble-loader": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/buble-loader/-/buble-loader-0.5.1.tgz",
-      "integrity": "sha512-ytp2BqL4NfyImoXQUFcIkM2EgKJI2e8KEc9R5/7MbUmdu952CYkhkwydZcKreuC6VAUBp9R7rxS88TZ7RQq/3A==",
-      "dev": true,
-      "dependencies": {
-        "loader-utils": "^1.1.0"
-      },
-      "peerDependencies": {
-        "buble": "*",
-        "webpack": "*"
-      }
-    },
-    "node_modules/buble/node_modules/regexpu-core": {
-      "version": "4.5.4",
-      "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.5.4.tgz",
-      "integrity": "sha512-BtizvGtFQKGPUcTy56o3nk1bGRp4SZOTYrDtGNlqCQufptV5IkkLN6Emw+yunAJjzf+C9FQFtvq7IoA3+oMYHQ==",
-      "dev": true,
-      "dependencies": {
-        "regenerate": "^1.4.0",
-        "regenerate-unicode-properties": "^8.0.2",
-        "regjsgen": "^0.5.0",
-        "regjsparser": "^0.6.0",
-        "unicode-match-property-ecmascript": "^1.0.4",
-        "unicode-match-property-value-ecmascript": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
    "node_modules/buffer": {
      "version": "5.7.1",
      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
@@ -3346,11 +3289,6 @@
        "node": ">= 0.6"
      }
    },
-    "node_modules/content-type-parser": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.2.tgz",
-      "integrity": "sha512-lM4l4CnMEwOLHAHr/P6MEZwZFPJFtAAKgL6pogbXmVZggIqXhdB6RbBtPOTsw2FcXwYhehRGERJmRrjOiIB8pQ=="
-    },
    "node_modules/convert-source-map": {
      "version": "1.7.0",
      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.7.0.tgz",
@@ -3810,9 +3748,9 @@
      "dev": true
    },
    "node_modules/dns-packet": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
-      "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz",
+      "integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==",
      "dev": true,
      "dependencies": {
        "ip": "^1.1.0",
@@ -5354,18 +5292,17 @@
      }
    },
    "node_modules/geotiff": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/geotiff/-/geotiff-1.0.5.tgz",
-      "integrity": "sha512-PK1dA22HJrgSjpDKXCcmihi/3NOTvAwZRV93pDCAI/bu3JYhgealCPMmzRQ6zJ/osfrrd9U4WXl3IHrwA9hqfg==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/geotiff/-/geotiff-1.0.6.tgz",
+      "integrity": "sha512-QpThfg270taZirnyZyN3INoo5OfUOtedYEbiotML5ts1Qou7rxtHrU9nUW2J07biEuSV6qWq784z7brUH7/gRQ==",
      "dependencies": {
        "@petamoriken/float16": "^1.0.7",
-        "content-type-parser": "^1.0.2",
        "lerc": "^3.0.0",
        "lru-cache": "^6.0.0",
-        "pako": "^1.0.11",
+        "pako": "^2.0.4",
        "parse-headers": "^2.0.2",
        "threads": "^1.3.1",
-        "txml": "^3.1.2"
+        "txml": "^5.0.0"
      },
      "engines": {
        "browsers": "defaults",
@@ -7369,18 +7306,6 @@
        "url": "https://github.com/sponsors/sindresorhus"
      }
    },
-    "node_modules/map-age-cleaner": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz",
-      "integrity": "sha512-bJzx6nMoP6PDLPBFmg7+xRKeFZvFboMrGlxmNj9ClvX53KrmvM5bXFXEWjbz4cz1AFn+jWJ9z/DJSz7hrs0w3w==",
-      "dev": true,
-      "dependencies": {
-        "p-defer": "^1.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
    "node_modules/mapbox-to-css-font": {
      "version": "2.4.0",
      "resolved": "https://registry.npmjs.org/mapbox-to-css-font/-/mapbox-to-css-font-2.4.0.tgz",
@@ -7412,9 +7337,9 @@
      }
    },
    "node_modules/marked": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-3.0.2.tgz",
-      "integrity": "sha512-TMJQQ79Z0e3rJYazY0tIoMsFzteUGw9fB3FD+gzuIT3zLuG9L9ckIvUfF51apdJkcqc208jJN2KbtPbOvXtbjA==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-3.0.4.tgz",
+      "integrity": "sha512-jBo8AOayNaEcvBhNobg6/BLhdsK3NvnKWJg33MAAPbvTWiG4QBn9gpW1+7RssrKu4K1dKlN+0goVQwV41xEfOA==",
      "dev": true,
      "bin": {
        "marked": "bin/marked"
@@ -7438,31 +7363,6 @@
        "node": ">= 0.6"
      }
    },
-    "node_modules/mem": {
-      "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/mem/-/mem-8.1.1.tgz",
-      "integrity": "sha512-qFCFUDs7U3b8mBDPyz5EToEKoAkgCzqquIgi9nkkR9bixxOVOre+09lbuH7+9Kn2NFpm56M3GUWVbU2hQgdACA==",
-      "dev": true,
-      "dependencies": {
-        "map-age-cleaner": "^0.1.3",
-        "mimic-fn": "^3.1.0"
-      },
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sindresorhus/mem?sponsor=1"
-      }
-    },
-    "node_modules/mem/node_modules/mimic-fn": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-3.1.0.tgz",
-      "integrity": "sha512-Ysbi9uYW9hFyfrThdDEQuykN4Ey6BuwPD2kpI5ES/nFTDn/98yxYNLZJcgUAKPT/mcrLLKaGzJR9YVxJrIdASQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=8"
-      }
-    },
    "node_modules/memfs": {
      "version": "3.2.2",
      "resolved": "https://registry.npmjs.org/memfs/-/memfs-3.2.2.tgz",
@@ -8002,32 +7902,14 @@
      "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
      "dev": true
    },
-    "node_modules/ol": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/ol/-/ol-6.5.0.tgz",
-      "integrity": "sha512-a5ebahrjF5yCPFle1rc0aHzKp/9A4LlUnjh+S3I+x4EgcvcddDhpOX3WDOs0Pg9/wEElrikHSGEvbeej2Hh4Ug==",
-      "peer": true,
-      "dependencies": {
-        "ol-mapbox-style": "^6.1.1",
-        "pbf": "3.2.1",
-        "rbush": "^3.0.1"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/openlayers"
-      }
-    },
    "node_modules/ol-mapbox-style": {
-      "version": "6.4.1",
-      "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-6.4.1.tgz",
-      "integrity": "sha512-qeHgB5lEaCjvpaR6oK8bPWqPTUAYzM2CTSfYJzujIU3egYLPCvJfVagIfTEMRDUG3CXTtIYHOI2Pg58ihhWJYA==",
+      "version": "6.5.1",
+      "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-6.5.1.tgz",
+      "integrity": "sha512-diGjCUlYjCA855vJjQjPzxXLn/skm0iQLD2/yDsXaKdNxFd35hNfRm5Li+Vxh/FxraCodxRvd8IplhrhvXoqbQ==",
      "dependencies": {
        "@mapbox/mapbox-gl-style-spec": "^13.20.1",
        "mapbox-to-css-font": "^2.4.0",
        "webfont-matcher": "^1.1.0"
-      },
-      "peerDependencies": {
-        "ol": ">= 6.1.0 < 7"
      }
    },
    "node_modules/on-finished": {
@@ -8109,15 +7991,6 @@
        "node": ">= 0.8.0"
      }
    },
-    "node_modules/p-defer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/p-defer/-/p-defer-1.0.0.tgz",
-      "integrity": "sha1-n26xgvbJqozXQwBKfU+WsZaw+ww=",
-      "dev": true,
-      "engines": {
-        "node": ">=4"
-      }
-    },
    "node_modules/p-event": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/p-event/-/p-event-4.2.0.tgz",
@@ -8222,9 +8095,9 @@
      }
    },
    "node_modules/pako": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-2.0.4.tgz",
+      "integrity": "sha512-v8tweI900AUkZN6heMU/4Uy4cXRc2AYNRggVmTR+dEncawDJgCdLMximOVA2p4qO57WMynangsfGRb5WD6L1Bg=="
    },
    "node_modules/parent-module": {
      "version": "1.0.1",
@@ -8293,9 +8166,9 @@
      }
    },
    "node_modules/path-parse": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
-      "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
      "dev": true
    },
    "node_modules/path-to-regexp": {
@@ -10261,9 +10134,9 @@
      }
    },
    "node_modules/terser-webpack-plugin": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.2.3.tgz",
-      "integrity": "sha512-eDbuaDlXhVaaoKuLD3DTNTozKqln6xOG6Us0SzlKG5tNlazG+/cdl8pm9qiF1Di89iWScTI0HcO+CDcf2dkXiw==",
+      "version": "5.2.4",
+      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.2.4.tgz",
+      "integrity": "sha512-E2CkNMN+1cho04YpdANyRrn8CyN4yMy+WdFKZIySFZrGXZxJwJP6PMNGGc/Mcr6qygQHUUqRxnAPmi0M9f00XA==",
      "dev": true,
      "dependencies": {
        "jest-worker": "^27.0.6",
@@ -10526,9 +10399,9 @@
      "dev": true
    },
    "node_modules/txml": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/txml/-/txml-3.2.5.tgz",
-      "integrity": "sha512-AtN8AgJLiDanttIXJaQlxH8/R0NOCNwto8kcO7BaxdLgsN9b7itM9lnTD7c2O3TadP+hHB9j7ra5XGFRPNnk/g==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/txml/-/txml-5.0.1.tgz",
+      "integrity": "sha512-T4JOQUCzKEUbSI7y4lKBf0e/JNNB8/CGdpStgrq7F37GuiR+uhKaD+zbs4hVIztrPzvZuopKCVGLVmO8B3HogQ==",
      "dependencies": {
        "through2": "^3.0.1"
      }
@@ -10851,9 +10724,9 @@
      "integrity": "sha1-mM6VCXsp4x++czBT4Q5XFkLRxsc="
    },
    "node_modules/webpack": {
-      "version": "5.52.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.52.0.tgz",
-      "integrity": "sha512-yRZOat8jWGwBwHpco3uKQhVU7HYaNunZiJ4AkAVQkPCUGoZk/tiIXiwG+8HIy/F+qsiZvSOa+GLQOj3q5RKRYg==",
+      "version": "5.53.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.53.0.tgz",
+      "integrity": "sha512-RZ1Z3z3ni44snoWjfWeHFyzvd9HMVYDYC5VXmlYUT6NWgEOWdCNpad5Fve2CzzHoRED7WtsKe+FCyP5Vk4pWiQ==",
      "dev": true,
      "dependencies": {
        "@types/eslint-scope": "^3.7.0",
@@ -10976,17 +10849,16 @@
      }
    },
    "node_modules/webpack-dev-middleware": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.0.0.tgz",
-      "integrity": "sha512-9zng2Z60pm6A98YoRcA0wSxw1EYn7B7y5owX/Tckyt9KGyULTkLtiavjaXlWqOMkM0YtqGgL3PvMOFgyFLq8vw==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.1.0.tgz",
+      "integrity": "sha512-oT660AR1gOnU/NTdUQi3EiGR0iXG7CFxmKsj3ylWCBA2khJ8LFHK+sKv3BZEsC11gl1eChsltRhzUq7nWj7XIQ==",
      "dev": true,
      "dependencies": {
        "colorette": "^1.2.2",
-        "mem": "^8.1.1",
        "memfs": "^3.2.2",
        "mime-types": "^2.1.31",
        "range-parser": "^1.2.1",
-        "schema-utils": "^3.0.0"
+        "schema-utils": "^3.1.0"
      },
      "engines": {
        "node": ">= 12.13.0"
@@ -11000,12 +10872,12 @@
      }
    },
    "node_modules/webpack-dev-middleware/node_modules/schema-utils": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
-      "integrity": "sha512-6D82/xSzO094ajanoOSbe4YvXWMfn2A//8Y1+MUqFAJul5Bs+yn36xbK9OtNDcRVSBJ9jjeoXftM6CfztsjOAA==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
+      "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
      "dev": true,
      "dependencies": {
-        "@types/json-schema": "^7.0.6",
+        "@types/json-schema": "^7.0.8",
        "ajv": "^6.12.5",
        "ajv-keywords": "^3.5.2"
      },
@@ -11018,12 +10890,12 @@
      }
    },
    "node_modules/webpack-dev-server": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.1.0.tgz",
-      "integrity": "sha512-PnnoCHuLKxH3vYff2EbORntD0Pd+MKclDIO8AcKsDVRToqY9/oeIwwUs5alA2B5OPgXJhaDNkBJAmb0OaWZFJA==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.2.1.tgz",
+      "integrity": "sha512-SQrIyQDZsTaF84p/WMAXNRKxjTeIaewhDIiHYZ423ENhNAsQWyubvqPTn0IoLMGkbhWyWv8/GYnCjItt0ZNC5w==",
      "dev": true,
      "dependencies": {
-        "ansi-html": "^0.0.7",
+        "ansi-html-community": "^0.0.8",
        "bonjour": "^3.5.0",
        "chokidar": "^3.5.1",
        "colorette": "^1.2.2",
@@ -11046,7 +10918,7 @@
        "spdy": "^4.0.2",
        "strip-ansi": "^7.0.0",
        "url": "^0.11.0",
-        "webpack-dev-middleware": "^5.0.0",
+        "webpack-dev-middleware": "^5.1.0",
        "ws": "^8.1.0"
      },
      "bin": {
@@ -11149,9 +11021,9 @@
      }
    },
    "node_modules/webpack-sources": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.0.tgz",
-      "integrity": "sha512-fahN08Et7P9trej8xz/Z7eRu8ltyiygEo/hnRi9KqBUs80KeDcnf96ZJo++ewWd84fEf3xSX9bp4ZS9hbw0OBw==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.1.tgz",
+      "integrity": "sha512-t6BMVLQ0AkjBOoRTZgqrWm7xbXMBzD+XDq2EZ96+vMfn3qKgsvdXZhbPZ4ElUOpdv4u+iiGe+w3+J75iy/bYGA==",
      "dev": true,
      "engines": {
        "node": ">=10.13.0"
@@ -11589,9 +11461,9 @@
      }
    },
    "@babel/eslint-parser": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.15.4.tgz",
-      "integrity": "sha512-hPMIAmGNbmQzXJIo2P43Zj9UhRmGev5f9nqdBFOWNGDGh6XKmjby79woBvg6y0Jur6yRfQBneDbUQ8ZVc1krFw==",
+      "version": "7.15.7",
+      "resolved": "https://registry.npmjs.org/@babel/eslint-parser/-/eslint-parser-7.15.7.tgz",
+      "integrity": "sha512-yJkHyomClm6A2Xzb8pdAo4HzYMSXFn1O5zrCYvbFP0yQFvHueLedV8WiEno8yJOKStjUXzBZzJFeWQ7b3YMsqQ==",
      "dev": true,
      "requires": {
        "eslint-scope": "^5.1.1",
@@ -11974,16 +11846,16 @@
      }
    },
    "@babel/plugin-proposal-object-rest-spread": {
-      "version": "7.14.7",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.14.7.tgz",
-      "integrity": "sha512-082hsZz+sVabfmDWo1Oct1u1AgbKbUAyVgmX4otIc7bdsRgHBXwTwb3DpDmD4Eyyx6DNiuz5UAATT655k+kL5g==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.15.6.tgz",
+      "integrity": "sha512-qtOHo7A1Vt+O23qEAX+GdBpqaIuD3i9VRrWgCJeq7WO6H2d14EK3q11urj5Te2MAeK97nMiIdRpwd/ST4JFbNg==",
      "dev": true,
      "requires": {
-        "@babel/compat-data": "^7.14.7",
-        "@babel/helper-compilation-targets": "^7.14.5",
+        "@babel/compat-data": "^7.15.0",
+        "@babel/helper-compilation-targets": "^7.15.4",
        "@babel/helper-plugin-utils": "^7.14.5",
        "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.14.5"
+        "@babel/plugin-transform-parameters": "^7.15.4"
      }
    },
    "@babel/plugin-proposal-optional-catch-binding": {
@@ -12478,9 +12350,9 @@
      }
    },
    "@babel/preset-env": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.4.tgz",
-      "integrity": "sha512-4f2nLw+q6ht8gl3sHCmNhmA5W6b1ItLzbH3UrKuJxACHr2eCpk96jwjrAfCAaXaaVwTQGnyUYHY2EWXJGt7TUQ==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.15.6.tgz",
+      "integrity": "sha512-L+6jcGn7EWu7zqaO2uoTDjjMBW+88FXzV8KvrBl2z6MtRNxlsmUNRlZPaNNPUTgqhyC5DHNFk/2Jmra+ublZWw==",
      "dev": true,
      "requires": {
        "@babel/compat-data": "^7.15.0",
@@ -12497,7 +12369,7 @@
        "@babel/plugin-proposal-logical-assignment-operators": "^7.14.5",
        "@babel/plugin-proposal-nullish-coalescing-operator": "^7.14.5",
        "@babel/plugin-proposal-numeric-separator": "^7.14.5",
-        "@babel/plugin-proposal-object-rest-spread": "^7.14.7",
+        "@babel/plugin-proposal-object-rest-spread": "^7.15.6",
        "@babel/plugin-proposal-optional-catch-binding": "^7.14.5",
        "@babel/plugin-proposal-optional-chaining": "^7.14.5",
        "@babel/plugin-proposal-private-methods": "^7.14.5",
@@ -12550,7 +12422,7 @@
        "@babel/plugin-transform-unicode-escapes": "^7.14.5",
        "@babel/plugin-transform-unicode-regex": "^7.14.5",
        "@babel/preset-modules": "^0.1.4",
-        "@babel/types": "^7.15.4",
+        "@babel/types": "^7.15.6",
        "babel-plugin-polyfill-corejs2": "^0.2.2",
        "babel-plugin-polyfill-corejs3": "^0.2.2",
        "babel-plugin-polyfill-regenerator": "^0.2.2",
@@ -12609,9 +12481,9 @@
      }
    },
    "@babel/types": {
-      "version": "7.15.4",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.4.tgz",
-      "integrity": "sha512-0f1HJFuGmmbrKTCZtbm3cU+b/AqdEYk5toj5iQur58xkVMlS0JWaKxTBSmCXd47uiN7vbcozAupm6Mvs80GNhw==",
+      "version": "7.15.6",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.15.6.tgz",
+      "integrity": "sha512-BPU+7QhqNjmWyDO0/vitH/CuhpV8ZmK1wpKva8nuyNF5MJfuRNWMc+hc14+u9xT93kvykMdncrJT19h74uB1Ig==",
      "dev": true,
      "requires": {
        "@babel/helper-validator-identifier": "^7.14.9",
@@ -13225,14 +13097,8 @@
      "version": "6.4.2",
      "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz",
      "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==",
-      "dev": true
-    },
-    "acorn-dynamic-import": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/acorn-dynamic-import/-/acorn-dynamic-import-4.0.0.tgz",
-      "integrity": "sha512-d3OEjQV4ROpoflsnUA8HozoIR504TFxNivYEUi6uwz0IYhBkTDXGuWlNdMtybRt3nqVx/L6XqMt0FxkXuWKZhw==",
      "dev": true,
-      "requires": {}
+      "peer": true
    },
    "acorn-jsx": {
      "version": "5.3.1",
@@ -13292,10 +13158,10 @@
      "integrity": "sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA==",
      "dev": true
    },
-    "ansi-html": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/ansi-html/-/ansi-html-0.0.7.tgz",
-      "integrity": "sha1-gTWEAhliqenm/QOflA0S9WynhZ4=",
+    "ansi-html-community": {
+      "version": "0.0.8",
+      "resolved": "https://registry.npmjs.org/ansi-html-community/-/ansi-html-community-0.0.8.tgz",
+      "integrity": "sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw==",
      "dev": true
    },
    "ansi-regex": {
@@ -13627,46 +13493,6 @@
        "node-releases": "^1.1.71"
      }
    },
-    "buble": {
-      "version": "0.20.0",
-      "resolved": "https://registry.npmjs.org/buble/-/buble-0.20.0.tgz",
-      "integrity": "sha512-/1gnaMQE8xvd5qsNBl+iTuyjJ9XxeaVxAMF86dQ4EyxFJOZtsgOS8Ra+7WHgZTam5IFDtt4BguN0sH0tVTKrOw==",
-      "dev": true,
-      "requires": {
-        "acorn": "^6.4.1",
-        "acorn-dynamic-import": "^4.0.0",
-        "acorn-jsx": "^5.2.0",
-        "chalk": "^2.4.2",
-        "magic-string": "^0.25.7",
-        "minimist": "^1.2.5",
-        "regexpu-core": "4.5.4"
-      },
-      "dependencies": {
-        "regexpu-core": {
-          "version": "4.5.4",
-          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-4.5.4.tgz",
-          "integrity": "sha512-BtizvGtFQKGPUcTy56o3nk1bGRp4SZOTYrDtGNlqCQufptV5IkkLN6Emw+yunAJjzf+C9FQFtvq7IoA3+oMYHQ==",
-          "dev": true,
-          "requires": {
-            "regenerate": "^1.4.0",
-            "regenerate-unicode-properties": "^8.0.2",
-            "regjsgen": "^0.5.0",
-            "regjsparser": "^0.6.0",
-            "unicode-match-property-ecmascript": "^1.0.4",
-            "unicode-match-property-value-ecmascript": "^1.1.0"
-          }
-        }
-      }
-    },
-    "buble-loader": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/buble-loader/-/buble-loader-0.5.1.tgz",
-      "integrity": "sha512-ytp2BqL4NfyImoXQUFcIkM2EgKJI2e8KEc9R5/7MbUmdu952CYkhkwydZcKreuC6VAUBp9R7rxS88TZ7RQq/3A==",
-      "dev": true,
-      "requires": {
-        "loader-utils": "^1.1.0"
-      }
-    },
    "buffer": {
      "version": "5.7.1",
      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
@@ -14016,11 +13842,6 @@
      "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==",
      "dev": true
    },
-    "content-type-parser": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/content-type-parser/-/content-type-parser-1.0.2.tgz",
-      "integrity": "sha512-lM4l4CnMEwOLHAHr/P6MEZwZFPJFtAAKgL6pogbXmVZggIqXhdB6RbBtPOTsw2FcXwYhehRGERJmRrjOiIB8pQ=="
-    },
    "convert-source-map": {
      "version": "1.7.0",
      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.7.0.tgz",
@@ -14364,9 +14185,9 @@
      "dev": true
    },
    "dns-packet": {
-      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz",
-      "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==",
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz",
+      "integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==",
      "dev": true,
      "requires": {
        "ip": "^1.1.0",
@@ -15574,18 +15395,17 @@
      "dev": true
    },
    "geotiff": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/geotiff/-/geotiff-1.0.5.tgz",
-      "integrity": "sha512-PK1dA22HJrgSjpDKXCcmihi/3NOTvAwZRV93pDCAI/bu3JYhgealCPMmzRQ6zJ/osfrrd9U4WXl3IHrwA9hqfg==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/geotiff/-/geotiff-1.0.6.tgz",
+      "integrity": "sha512-QpThfg270taZirnyZyN3INoo5OfUOtedYEbiotML5ts1Qou7rxtHrU9nUW2J07biEuSV6qWq784z7brUH7/gRQ==",
      "requires": {
        "@petamoriken/float16": "^1.0.7",
-        "content-type-parser": "^1.0.2",
        "lerc": "^3.0.0",
        "lru-cache": "^6.0.0",
-        "pako": "^1.0.11",
+        "pako": "^2.0.4",
        "parse-headers": "^2.0.2",
        "threads": "^1.3.1",
-        "txml": "^3.1.2"
+        "txml": "^5.0.0"
      }
    },
    "get-caller-file": {
@@ -17102,15 +16922,6 @@
        "semver": "^6.0.0"
      }
    },
-    "map-age-cleaner": {
-      "version": "0.1.3",
-      "resolved": "https://registry.npmjs.org/map-age-cleaner/-/map-age-cleaner-0.1.3.tgz",
-      "integrity": "sha512-bJzx6nMoP6PDLPBFmg7+xRKeFZvFboMrGlxmNj9ClvX53KrmvM5bXFXEWjbz4cz1AFn+jWJ9z/DJSz7hrs0w3w==",
-      "dev": true,
-      "requires": {
-        "p-defer": "^1.0.0"
-      }
-    },
    "mapbox-to-css-font": {
      "version": "2.4.0",
      "resolved": "https://registry.npmjs.org/mapbox-to-css-font/-/mapbox-to-css-font-2.4.0.tgz",
@@ -17137,9 +16948,9 @@
      "requires": {}
    },
    "marked": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/marked/-/marked-3.0.2.tgz",
-      "integrity": "sha512-TMJQQ79Z0e3rJYazY0tIoMsFzteUGw9fB3FD+gzuIT3zLuG9L9ckIvUfF51apdJkcqc208jJN2KbtPbOvXtbjA==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-3.0.4.tgz",
+      "integrity": "sha512-jBo8AOayNaEcvBhNobg6/BLhdsK3NvnKWJg33MAAPbvTWiG4QBn9gpW1+7RssrKu4K1dKlN+0goVQwV41xEfOA==",
      "dev": true
    },
    "mdurl": {
@@ -17154,24 +16965,6 @@
      "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=",
      "dev": true
    },
-    "mem": {
-      "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/mem/-/mem-8.1.1.tgz",
-      "integrity": "sha512-qFCFUDs7U3b8mBDPyz5EToEKoAkgCzqquIgi9nkkR9bixxOVOre+09lbuH7+9Kn2NFpm56M3GUWVbU2hQgdACA==",
-      "dev": true,
-      "requires": {
-        "map-age-cleaner": "^0.1.3",
-        "mimic-fn": "^3.1.0"
-      },
-      "dependencies": {
-        "mimic-fn": {
-          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-3.1.0.tgz",
-          "integrity": "sha512-Ysbi9uYW9hFyfrThdDEQuykN4Ey6BuwPD2kpI5ES/nFTDn/98yxYNLZJcgUAKPT/mcrLLKaGzJR9YVxJrIdASQ==",
-          "dev": true
-        }
-      }
-    },
    "memfs": {
      "version": "3.2.2",
      "resolved": "https://registry.npmjs.org/memfs/-/memfs-3.2.2.tgz",
@@ -17591,21 +17384,10 @@
      "integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==",
      "dev": true
    },
-    "ol": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/ol/-/ol-6.5.0.tgz",
-      "integrity": "sha512-a5ebahrjF5yCPFle1rc0aHzKp/9A4LlUnjh+S3I+x4EgcvcddDhpOX3WDOs0Pg9/wEElrikHSGEvbeej2Hh4Ug==",
-      "peer": true,
-      "requires": {
-        "ol-mapbox-style": "^6.1.1",
-        "pbf": "3.2.1",
-        "rbush": "^3.0.1"
-      }
-    },
    "ol-mapbox-style": {
-      "version": "6.4.1",
-      "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-6.4.1.tgz",
-      "integrity": "sha512-qeHgB5lEaCjvpaR6oK8bPWqPTUAYzM2CTSfYJzujIU3egYLPCvJfVagIfTEMRDUG3CXTtIYHOI2Pg58ihhWJYA==",
+      "version": "6.5.1",
+      "resolved": "https://registry.npmjs.org/ol-mapbox-style/-/ol-mapbox-style-6.5.1.tgz",
+      "integrity": "sha512-diGjCUlYjCA855vJjQjPzxXLn/skm0iQLD2/yDsXaKdNxFd35hNfRm5Li+Vxh/FxraCodxRvd8IplhrhvXoqbQ==",
      "requires": {
        "@mapbox/mapbox-gl-style-spec": "^13.20.1",
        "mapbox-to-css-font": "^2.4.0",
@@ -17670,12 +17452,6 @@
        "word-wrap": "^1.2.3"
      }
    },
-    "p-defer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/p-defer/-/p-defer-1.0.0.tgz",
-      "integrity": "sha1-n26xgvbJqozXQwBKfU+WsZaw+ww=",
-      "dev": true
-    },
    "p-event": {
      "version": "4.2.0",
      "resolved": "https://registry.npmjs.org/p-event/-/p-event-4.2.0.tgz",
@@ -17744,9 +17520,9 @@
      "dev": true
    },
    "pako": {
-      "version": "1.0.11",
-      "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
-      "integrity": "sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw=="
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/pako/-/pako-2.0.4.tgz",
+      "integrity": "sha512-v8tweI900AUkZN6heMU/4Uy4cXRc2AYNRggVmTR+dEncawDJgCdLMximOVA2p4qO57WMynangsfGRb5WD6L1Bg=="
    },
    "parent-module": {
      "version": "1.0.1",
@@ -17797,9 +17573,9 @@
      "dev": true
    },
    "path-parse": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.6.tgz",
-      "integrity": "sha512-GSmOT2EbHrINBf9SR7CDELwlJ8AENk3Qn7OikK4nFYAu3Ote2+JYNVvkpAEQm3/TLNEJFD/xZJjzyxg3KBWOzw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
      "dev": true
    },
    "path-to-regexp": {
@@ -19361,9 +19137,9 @@
      }
    },
    "terser-webpack-plugin": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.2.3.tgz",
-      "integrity": "sha512-eDbuaDlXhVaaoKuLD3DTNTozKqln6xOG6Us0SzlKG5tNlazG+/cdl8pm9qiF1Di89iWScTI0HcO+CDcf2dkXiw==",
+      "version": "5.2.4",
+      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.2.4.tgz",
+      "integrity": "sha512-E2CkNMN+1cho04YpdANyRrn8CyN4yMy+WdFKZIySFZrGXZxJwJP6PMNGGc/Mcr6qygQHUUqRxnAPmi0M9f00XA==",
      "dev": true,
      "requires": {
        "jest-worker": "^27.0.6",
@@ -19546,9 +19322,9 @@
      "dev": true
    },
    "txml": {
-      "version": "3.2.5",
-      "resolved": "https://registry.npmjs.org/txml/-/txml-3.2.5.tgz",
-      "integrity": "sha512-AtN8AgJLiDanttIXJaQlxH8/R0NOCNwto8kcO7BaxdLgsN9b7itM9lnTD7c2O3TadP+hHB9j7ra5XGFRPNnk/g==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/txml/-/txml-5.0.1.tgz",
+      "integrity": "sha512-T4JOQUCzKEUbSI7y4lKBf0e/JNNB8/CGdpStgrq7F37GuiR+uhKaD+zbs4hVIztrPzvZuopKCVGLVmO8B3HogQ==",
      "requires": {
        "through2": "^3.0.1"
      }
@@ -19800,9 +19576,9 @@
      "integrity": "sha1-mM6VCXsp4x++czBT4Q5XFkLRxsc="
    },
    "webpack": {
-      "version": "5.52.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.52.0.tgz",
-      "integrity": "sha512-yRZOat8jWGwBwHpco3uKQhVU7HYaNunZiJ4AkAVQkPCUGoZk/tiIXiwG+8HIy/F+qsiZvSOa+GLQOj3q5RKRYg==",
+      "version": "5.53.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.53.0.tgz",
+      "integrity": "sha512-RZ1Z3z3ni44snoWjfWeHFyzvd9HMVYDYC5VXmlYUT6NWgEOWdCNpad5Fve2CzzHoRED7WtsKe+FCyP5Vk4pWiQ==",
      "dev": true,
      "requires": {
        "@types/eslint-scope": "^3.7.0",
@@ -19906,26 +19682,25 @@
      }
    },
    "webpack-dev-middleware": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.0.0.tgz",
-      "integrity": "sha512-9zng2Z60pm6A98YoRcA0wSxw1EYn7B7y5owX/Tckyt9KGyULTkLtiavjaXlWqOMkM0YtqGgL3PvMOFgyFLq8vw==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.1.0.tgz",
+      "integrity": "sha512-oT660AR1gOnU/NTdUQi3EiGR0iXG7CFxmKsj3ylWCBA2khJ8LFHK+sKv3BZEsC11gl1eChsltRhzUq7nWj7XIQ==",
      "dev": true,
      "requires": {
        "colorette": "^1.2.2",
-        "mem": "^8.1.1",
        "memfs": "^3.2.2",
        "mime-types": "^2.1.31",
        "range-parser": "^1.2.1",
-        "schema-utils": "^3.0.0"
+        "schema-utils": "^3.1.0"
      },
      "dependencies": {
        "schema-utils": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.0.0.tgz",
-          "integrity": "sha512-6D82/xSzO094ajanoOSbe4YvXWMfn2A//8Y1+MUqFAJul5Bs+yn36xbK9OtNDcRVSBJ9jjeoXftM6CfztsjOAA==",
+          "version": "3.1.1",
+          "resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
+          "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
          "dev": true,
          "requires": {
-            "@types/json-schema": "^7.0.6",
+            "@types/json-schema": "^7.0.8",
            "ajv": "^6.12.5",
            "ajv-keywords": "^3.5.2"
          }
@@ -19933,12 +19708,12 @@
      }
    },
    "webpack-dev-server": {
-      "version": "4.1.0",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.1.0.tgz",
-      "integrity": "sha512-PnnoCHuLKxH3vYff2EbORntD0Pd+MKclDIO8AcKsDVRToqY9/oeIwwUs5alA2B5OPgXJhaDNkBJAmb0OaWZFJA==",
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.2.1.tgz",
+      "integrity": "sha512-SQrIyQDZsTaF84p/WMAXNRKxjTeIaewhDIiHYZ423ENhNAsQWyubvqPTn0IoLMGkbhWyWv8/GYnCjItt0ZNC5w==",
      "dev": true,
      "requires": {
-        "ansi-html": "^0.0.7",
+        "ansi-html-community": "^0.0.8",
        "bonjour": "^3.5.0",
        "chokidar": "^3.5.1",
        "colorette": "^1.2.2",
@@ -19961,7 +19736,7 @@
        "spdy": "^4.0.2",
        "strip-ansi": "^7.0.0",
        "url": "^0.11.0",
-        "webpack-dev-middleware": "^5.0.0",
+        "webpack-dev-middleware": "^5.1.0",
        "ws": "^8.1.0"
      },
      "dependencies": {
@@ -20016,9 +19791,9 @@
      }
    },
    "webpack-sources": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.0.tgz",
-      "integrity": "sha512-fahN08Et7P9trej8xz/Z7eRu8ltyiygEo/hnRi9KqBUs80KeDcnf96ZJo++ewWd84fEf3xSX9bp4ZS9hbw0OBw==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.1.tgz",
+      "integrity": "sha512-t6BMVLQ0AkjBOoRTZgqrWm7xbXMBzD+XDq2EZ96+vMfn3qKgsvdXZhbPZ4ElUOpdv4u+iiGe+w3+J75iy/bYGA==",
      "dev": true
    },
    "websocket-driver": {
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "ol",
-  "version": "6.7.0",
+  "version": "6.8.0",
  "description": "OpenLayers mapping library",
  "keywords": [
    "map",
@@ -23,7 +23,7 @@
    "build-package": "npm run transpile && npm run copy-css && npm run generate-types && node tasks/prepare-package.js",
    "build-index": "shx rm -f build/index.js && npm run build-package && node tasks/generate-index.js",
    "build-legacy": "shx rm -rf build/legacy && npm run build-index && webpack --config config/webpack-config-legacy-build.mjs && cleancss --source-map src/ol/ol.css -o build/legacy/ol.css",
-    "build-site": "shx rm -rf build/site && npm run build-examples && npm run apidoc && shx mkdir -p build/site && shx cp site/index.html build/site/ && shx mv build/apidoc build/examples build/site/",
+    "build-site": "shx rm -rf build/site && npm run build-examples && npm run apidoc && npm run build-legacy && shx mkdir -p build/site && shx cp site/index.html build/site/ && shx mv build/apidoc build/examples build/legacy build/site/",
    "copy-css": "shx cp src/ol/ol.css build/ol/ol.css",
    "generate-types": "npx --package=typescript@3.8.3 -y -- tsc --project config/tsconfig-build.json --declaration --declarationMap --emitDeclarationOnly --outdir build/ol",
    "transpile": "shx rm -rf build/ol && shx mkdir -p build/ol && shx cp -rf src/ol build/ol/src && node tasks/serialize-workers.cjs && npx --package=typescript@4.3.5 -y -- tsc --project config/tsconfig-build.json",
@@ -45,8 +45,8 @@
    "url": "https://opencollective.com/openlayers"
  },
  "dependencies": {
-    "geotiff": "^1.0.5",
-    "ol-mapbox-style": "^6.4.1",
+    "geotiff": "1.0.6",
+    "ol-mapbox-style": "^6.5.1",
    "pbf": "3.2.1",
    "rbush": "^3.0.1"
  },
@@ -63,8 +63,6 @@
    "@types/pbf": "^3.0.2",
    "@types/topojson-specification": "^1.0.1",
    "babel-loader": "^8.2.2",
-    "buble": "^0.20.0",
-    "buble-loader": "^0.5.1",
    "chaikin-smooth": "^1.0.4",
    "clean-css-cli": "5.3.3",
    "copy-webpack-plugin": "^9.0.0",
@@ -93,7 +91,7 @@
    "karma-sourcemap-loader": "^0.3.8",
    "karma-webpack": "^5.0.0",
    "loglevelnext": "^5.0.5",
-    "marked": "3.0.2",
+    "marked": "3.0.4",
    "mocha": "9.1.1",
    "pixelmatch": "^5.1.0",
    "pngjs": "^6.0.0",
@@ -106,6 +104,7 @@
    "shx": "^0.3.2",
    "sinon": "^11.1.1",
    "terser-webpack-plugin": "^5.1.1",
+    "threads": "^1.6.5",
    "url-polyfill": "^1.1.5",
    "walk": "^2.3.9",
    "webpack": "^5.27.2",
--- a/site/index.html
+++ b/site/index.html
@@ -4,11 +4,32 @@
    <title>OpenLayers</title>
    <link href='https://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700' rel='stylesheet' type='text/css'>
    <link href='https://openlayers.org/assets/theme/site.css' rel='stylesheet' type='text/css'>
+    <link href="./legacy/ol.css" rel='stylesheet' type='text/css'>
+    <!-- Pointer events polyfill for old browsers, see https://caniuse.com/#feat=pointer -->
+    <script src="https://unpkg.com/elm-pep"></script>
+    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
+    <script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList,URL,TextDecoder,Number.isInteger"></script>    
  </head>
  <body>
    <ul>
      <li><a href="./apidoc/">API Docs</a></li>
      <li><a href="./examples/">Examples</a></li>
    </ul>
+    <div id="map" style="width:400px;height:400px;"></div>
+    <script src="./legacy/ol.js"></script>
+    <script>
+      new ol.Map({
+        target: 'map',
+        layers: [
+          new ol.layer.Tile({
+            source: new ol.source.OSM()
+          })
+        ],
+        view: new ol.View({
+          center: [0, 0],
+          zoom: 0
+        })
+      })
+    </script>
  </body>
 </html>
--- a/src/ol/Collection.js
+++ b/src/ol/Collection.js
@@ -81,12 +81,12 @@ class Collection extends BaseObject {
    super();

    /***
-     * @type {CollectionOnSignature<import("./Observable.js").OnReturn>}
+     * @type {CollectionOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {CollectionOnSignature<import("./Observable.js").OnReturn>}
+     * @type {CollectionOnSignature<import("./events").EventsKey>}
     */
    this.once;

--- a/src/ol/DataTile.js
+++ b/src/ol/DataTile.js
@@ -5,8 +5,9 @@ import Tile from './Tile.js';
 import TileState from './TileState.js';

 /**
- * Data that can be used with a DataTile.
- * @typedef {Uint8Array|Uint8ClampedArray|DataView} Data
+ * Data that can be used with a DataTile.  For increased browser compatibility, use
+ * Uint8Array instead of Uint8ClampedArray where possible.
+ * @typedef {Uint8Array|Uint8ClampedArray|Float32Array|DataView} Data
 */

 /**
--- a/src/ol/Feature.js
+++ b/src/ol/Feature.js
@@ -83,12 +83,12 @@ class Feature extends BaseObject {
    super();

    /***
-     * @type {FeatureOnSignature<import("./Observable.js").OnReturn>}
+     * @type {FeatureOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {FeatureOnSignature<import("./Observable.js").OnReturn>}
+     * @type {FeatureOnSignature<import("./events").EventsKey>}
     */
    this.once;

--- a/src/ol/Geolocation.js
+++ b/src/ol/Geolocation.js
@@ -107,12 +107,12 @@ class Geolocation extends BaseObject {
    super();

    /***
-     * @type {GeolocationOnSignature<import("./Observable.js").OnReturn>}
+     * @type {GeolocationOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {GeolocationOnSignature<import("./Observable.js").OnReturn>}
+     * @type {GeolocationOnSignature<import("./events").EventsKey>}
     */
    this.once;

--- a/src/ol/Object.js
+++ b/src/ol/Object.js
@@ -95,12 +95,12 @@ class BaseObject extends Observable {
    super();

    /***
-     * @type {ObjectOnSignature<import("./Observable.js").OnReturn>}
+     * @type {ObjectOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {ObjectOnSignature<import("./Observable.js").OnReturn>}
+     * @type {ObjectOnSignature<import("./events").EventsKey>}
     */
    this.once;

--- a/src/ol/Observable.js
+++ b/src/ol/Observable.js
@@ -9,23 +9,24 @@ import {listen, listenOnce, unlistenByKey} from './events.js';
 * @template {string} Type
 * @template {Event|import("./events/Event.js").default} EventClass
 * @template Return
- * @typedef {(type: Type|Type[], listener: (event: EventClass) => ?) => Return} OnSignature
+ * @typedef {(type: Type, listener: (event: EventClass) => ?) => Return} OnSignature
 */

 /***
 * @template {string} Type
 * @template Return
- * @typedef {(type: Type[], listener: (event: Event|import("./events/Event").default) => ?) => Return} CombinedOnSignature
- */
-
-/***
- * @typedef {import("./events").EventsKey|Array<import("./events").EventsKey>} OnReturn
+ * @typedef {(type: Type[], listener: (event: Event|import("./events/Event").default) => ?) => Return extends void ? void : Return[]} CombinedOnSignature
 */

 /**
 * @typedef {'change'|'error'} EventTypes
 */

+/***
+ * @template Return
+ * @typedef {OnSignature<EventTypes, import("./events/Event.js").default, Return> & CombinedOnSignature<EventTypes, Return>} ObservableOnSignature
+ */
+
 /**
 * @classdesc
 * Abstract base class; normally only used for creating subclasses and not
@@ -41,20 +42,17 @@ class Observable extends EventTarget {
  constructor() {
    super();

-    /***
-     * @type {OnSignature<EventTypes, import("./events/Event.js").default, OnReturn>}
-     */
-    this.on = this.onInternal;
+    this.on =
+      /** @type {ObservableOnSignature<import("./events").EventsKey>} */ (
+        this.onInternal
+      );

-    /***
-     * @type {OnSignature<EventTypes, import("./events/Event.js").default, OnReturn>}
-     */
-    this.once = this.onceInternal;
+    this.once =
+      /** @type {ObservableOnSignature<import("./events").EventsKey>} */ (
+        this.onceInternal
+      );

-    /***
-     * @type {OnSignature<EventTypes, import("./events/Event.js").default, void>}
-     */
-    this.un = this.unInternal;
+    this.un = /** @type {ObservableOnSignature<void>} */ (this.unInternal);

    /**
     * @private
@@ -84,7 +82,7 @@ class Observable extends EventTarget {

  /**
   * @param {string|Array<string>} type Type.
-   * @param {function(?): ?} listener Listener.
+   * @param {function((Event|import("./events/Event").default)): ?} listener Listener.
   * @return {import("./events.js").EventsKey|Array<import("./events.js").EventsKey>} Event key.
   * @protected
   */
@@ -103,7 +101,7 @@ class Observable extends EventTarget {

  /**
   * @param {string|Array<string>} type Type.
-   * @param {function(?): ?} listener Listener.
+   * @param {function((Event|import("./events/Event").default)): ?} listener Listener.
   * @return {import("./events.js").EventsKey|Array<import("./events.js").EventsKey>} Event key.
   * @protected
   */
@@ -125,7 +123,7 @@ class Observable extends EventTarget {
  /**
   * Unlisten for a certain type of event.
   * @param {string|Array<string>} type Type.
-   * @param {function(?): ?} listener Listener.
+   * @param {function((Event|import("./events/Event").default)): ?} listener Listener.
   * @protected
   */
  unInternal(type, listener) {
--- a/src/ol/Overlay.js
+++ b/src/ol/Overlay.js
@@ -123,12 +123,12 @@ class Overlay extends BaseObject {
    super();

    /***
-     * @type {OverlayOnSignature<import("./Observable").OnReturn>}
+     * @type {OverlayOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {OverlayOnSignature<import("./Observable").OnReturn>}
+     * @type {OverlayOnSignature<import("./events").EventsKey>}
     */
    this.once;

--- a/src/ol/PluggableMap.js
+++ b/src/ol/PluggableMap.js
@@ -48,6 +48,7 @@ import {removeNode} from './dom.js';
 * @property {import("./transform.js").Transform} coordinateToPixelTransform CoordinateToPixelTransform.
 * @property {import("rbush").default} declutterTree DeclutterTree.
 * @property {null|import("./extent.js").Extent} extent Extent.
+ * @property {import("./extent.js").Extent} [nextExtent] Next extent during an animation series.
 * @property {number} index Index.
 * @property {Array<import("./layer/Layer.js").State>} layerStatesArray LayerStatesArray.
 * @property {number} layerIndex LayerIndex.
@@ -137,7 +138,7 @@ import {removeNode} from './dom.js';
 * element itself or the `id` of the element. If not specified at construction
 * time, {@link module:ol/Map~Map#setTarget} must be called for the map to be
 * rendered. If passed by element, the container can be in a secondary document.
- * @property {View} [view] The map's view.  No layer sources will be
+ * @property {View|Promise<import("./View.js").ViewOptions>} [view] The map's view.  No layer sources will be
 * fetched unless this is specified at construction time or through
 * {@link module:ol/Map~Map#setView}.
 */
@@ -158,12 +159,12 @@ class PluggableMap extends BaseObject {
    super();

    /***
-     * @type {PluggableMapOnSignature<import("./Observable.js").OnReturn>}
+     * @type {PluggableMapOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {PluggableMapOnSignature<import("./Observable.js").OnReturn>}
+     * @type {PluggableMapOnSignature<import("./events").EventsKey>}
     */
    this.once;

@@ -388,6 +389,13 @@ class PluggableMap extends BaseObject {
    // is "defined" already.
    this.setProperties(optionsInternal.values);

+    const map = this;
+    if (options.view && !(options.view instanceof View)) {
+      options.view.then(function (viewOptions) {
+        map.setView(new View(viewOptions));
+      });
+    }
+
    this.controls.addEventListener(
      CollectionEventType.ADD,
      /**
@@ -840,6 +848,23 @@ class PluggableMap extends BaseObject {
    return /** @type {LayerGroup} */ (this.get(MapProperty.LAYERGROUP));
  }

+  /**
+   * Clear any existing layers and add layers to the map.
+   * @param {Array<import("./layer/Base.js").default>|Collection<import("./layer/Base.js").default>} layers The layers to be added to the map.
+   * @api
+   */
+  setLayers(layers) {
+    const group = this.getLayerGroup();
+    if (layers instanceof Collection) {
+      group.setLayers(layers);
+      return;
+    }
+
+    const collection = group.getLayers();
+    collection.clear();
+    collection.extend(layers);
+  }
+
  /**
   * Get the collection of layers associated with this map.
   * @return {!Collection<import("./layer/Base.js").default>} Layers.
@@ -1412,6 +1437,18 @@ class PluggableMap extends BaseObject {
        viewHints: viewHints,
        wantedTiles: {},
      };
+      if (viewState.nextCenter && viewState.nextResolution) {
+        const rotation = isNaN(viewState.nextRotation)
+          ? viewState.rotation
+          : viewState.nextRotation;
+
+        frameState.nextExtent = getForViewAndSize(
+          viewState.nextCenter,
+          viewState.nextResolution,
+          rotation,
+          size
+        );
+      }
    }

    this.frameState_ = frameState;
@@ -1496,12 +1533,24 @@ class PluggableMap extends BaseObject {

  /**
   * Set the view for this map.
-   * @param {View} view The view that controls this map.
+   * @param {View|Promise<import("./View.js").ViewOptions>} view The view that controls this map.
+   * It is also possible to pass a promise that resolves to options for constructing a view.  This
+   * alternative allows view properties to be resolved by sources or other components that load
+   * view-related metadata.
   * @observable
   * @api
   */
  setView(view) {
-    this.set(MapProperty.VIEW, view);
+    if (!view || view instanceof View) {
+      this.set(MapProperty.VIEW, view);
+      return;
+    }
+    this.set(MapProperty.VIEW, new View());
+
+    const map = this;
+    view.then(function (viewOptions) {
+      map.setView(new View(viewOptions));
+    });
  }

  /**
@@ -1600,7 +1649,7 @@ function createOptionsInternal(options) {
  values[MapProperty.TARGET] = options.target;

  values[MapProperty.VIEW] =
-    options.view !== undefined ? options.view : new View();
+    options.view instanceof View ? options.view : new View();

  let controls;
  if (options.controls !== undefined) {
--- a/src/ol/View.js
+++ b/src/ol/View.js
@@ -208,6 +208,9 @@ import {fromExtent as polygonFromExtent} from './geom/Polygon.js';
 * @property {import("./coordinate.js").Coordinate} center Center.
 * @property {import("./proj/Projection.js").default} projection Projection.
 * @property {number} resolution Resolution.
+ * @property {import("./coordinate.js").Coordinate} [nextCenter] The next center during an animation series.
+ * @property {number} [nextResolution] The next resolution during an animation series.
+ * @property {number} [nextRotation] The next rotation during an animation series.
 * @property {number} rotation Rotation.
 * @property {number} zoom Zoom.
 */
@@ -309,12 +312,12 @@ class View extends BaseObject {
    super();

    /***
-     * @type {ViewOnSignature<import("./Observable.js").OnReturn>}
+     * @type {ViewOnSignature<import("./events").EventsKey>}
     */
    this.on;

    /***
-     * @type {ViewOnSignature<import("./Observable.js").OnReturn>}
+     * @type {ViewOnSignature<import("./events").EventsKey>}
     */
    this.once;

@@ -374,6 +377,24 @@ class View extends BaseObject {
     */
    this.targetRotation_;

+    /**
+     * @private
+     * @type {import("./coordinate.js").Coordinate}
+     */
+    this.nextCenter_ = null;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this.nextResolution_;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this.nextRotation_;
+
    /**
     * @private
     * @type {import("./coordinate.js").Coordinate|undefined}
@@ -714,6 +735,9 @@ class View extends BaseObject {
    }
    this.animations_.length = 0;
    this.cancelAnchor_ = anchor;
+    this.nextCenter_ = null;
+    this.nextResolution_ = NaN;
+    this.nextRotation_ = NaN;
  }

  /**
@@ -752,6 +776,7 @@ class View extends BaseObject {
          const y0 = animation.sourceCenter[1];
          const x1 = animation.targetCenter[0];
          const y1 = animation.targetCenter[1];
+          this.nextCenter_ = animation.targetCenter;
          const x = x0 + progress * (x1 - x0);
          const y = y0 + progress * (y1 - y0);
          this.targetCenter_ = [x, y];
@@ -776,6 +801,7 @@ class View extends BaseObject {
              animation.anchor
            );
          }
+          this.nextResolution_ = animation.targetResolution;
          this.targetResolution_ = resolution;
          this.applyTargetState_(true);
        }
@@ -800,6 +826,7 @@ class View extends BaseObject {
              animation.anchor
            );
          }
+          this.nextRotation_ = animation.targetRotation;
          this.targetRotation_ = rotation;
        }
        this.applyTargetState_(true);
@@ -811,6 +838,9 @@ class View extends BaseObject {
      if (seriesComplete) {
        this.animations_[i] = null;
        this.setHint(ViewHint.ANIMATING, -1);
+        this.nextCenter_ = null;
+        this.nextResolution_ = NaN;
+        this.nextRotation_ = NaN;
        const callback = series[0].callback;
        if (callback) {
          animationCallback(callback, true);
@@ -1191,7 +1221,7 @@ class View extends BaseObject {
   */
  getState() {
    const projection = this.getProjection();
-    const resolution = /** @type {number} */ (this.getResolution());
+    const resolution = this.getResolution();
    const rotation = this.getRotation();
    let center = /** @type {import("./coordinate.js").Coordinate} */ (
      this.getCenterInternal()
@@ -1211,6 +1241,9 @@ class View extends BaseObject {
      center: center.slice(0),
      projection: projection !== undefined ? projection : null,
      resolution: resolution,
+      nextCenter: this.nextCenter_,
+      nextResolution: this.nextResolution_,
+      nextRotation: this.nextRotation_,
      rotation: rotation,
      zoom: this.getZoom(),
    };
--- a/src/ol/control/Attribution.js
+++ b/src/ol/control/Attribution.js
@@ -25,7 +25,7 @@ import {removeChildren, replaceNode} from '../dom.js';
 * Instead of text, also an element (e.g. a `span` element) can be used.
 * @property {string} [expandClassName=className + '-expand'] CSS class name for the
 * collapsed attributions button.
- * @property {string|HTMLElement} [collapseLabel='»'] Text label to use
+ * @property {string|HTMLElement} [collapseLabel='›'] Text label to use
 * for the expanded attributions button.
 * Instead of text, also an element (e.g. a `span` element) can be used.
 * @property {string} [collapseClassName=className + '-collapse'] CSS class name for the
@@ -105,7 +105,7 @@ class Attribution extends Control {
        : className + '-expand';

    const collapseLabel =
-      options.collapseLabel !== undefined ? options.collapseLabel : '\u00BB';
+      options.collapseLabel !== undefined ? options.collapseLabel : '\u203A';

    const collapseClassName =
      options.collapseClassName !== undefined
--- a/src/ol/control/Control.js
+++ b/src/ol/control/Control.js
@@ -98,7 +98,7 @@ class Control extends BaseObject {

  /**
   * Get the map associated with this control.
-   * @return {import("../PluggableMap.js").default} Map.
+   * @return {import("../PluggableMap.js").default|undefined} Map.
   * @api
   */
  getMap() {
@@ -109,7 +109,7 @@ class Control extends BaseObject {
   * Remove the control from its current map and attach it to the new map.
   * Subclasses may set up event handlers to get notified about changes to
   * the map here.
-   * @param {import("../PluggableMap.js").default} map Map.
+   * @param {import("../PluggableMap.js").default} [map] Map.
   * @api
   */
  setMap(map) {
--- a/src/ol/control/FullScreen.js
+++ b/src/ol/control/FullScreen.js
@@ -90,12 +90,12 @@ class FullScreen extends Control {
    });

    /***
-     * @type {FullScreenOnSignature<import("../Observable.js").OnReturn>}
+     * @type {FullScreenOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {FullScreenOnSignature<import("../Observable.js").OnReturn>}
+     * @type {FullScreenOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/control/MousePosition.js
+++ b/src/ol/control/MousePosition.js
@@ -80,12 +80,12 @@ class MousePosition extends Control {
    });

    /***
-     * @type {MousePositionOnSignature<import("../Observable.js").OnReturn>}
+     * @type {MousePositionOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {MousePositionOnSignature<import("../Observable.js").OnReturn>}
+     * @type {MousePositionOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/control/OverviewMap.js
+++ b/src/ol/control/OverviewMap.js
@@ -48,10 +48,10 @@ class ControlledMap extends PluggableMap {
 * @typedef {Object} Options
 * @property {string} [className='ol-overviewmap'] CSS class name.
 * @property {boolean} [collapsed=true] Whether the control should start collapsed or not (expanded).
- * @property {string|HTMLElement} [collapseLabel='«'] Text label to use for the
+ * @property {string|HTMLElement} [collapseLabel='‹'] Text label to use for the
 * expanded overviewmap button. Instead of text, also an element (e.g. a `span` element) can be used.
 * @property {boolean} [collapsible=true] Whether the control can be collapsed or not.
- * @property {string|HTMLElement} [label='»'] Text label to use for the collapsed
+ * @property {string|HTMLElement} [label='›'] Text label to use for the collapsed
 * overviewmap button. Instead of text, also an element (e.g. a `span` element) can be used.
 * @property {Array<import("../layer/Layer.js").default>|import("../Collection.js").default<import("../layer/Layer.js").default>} [layers]
 * Layers for the overview map.
@@ -127,7 +127,7 @@ class OverviewMap extends Control {
      options.tipLabel !== undefined ? options.tipLabel : 'Overview map';

    const collapseLabel =
-      options.collapseLabel !== undefined ? options.collapseLabel : '\u00AB';
+      options.collapseLabel !== undefined ? options.collapseLabel : '\u2039';

    if (typeof collapseLabel === 'string') {
      /**
@@ -140,7 +140,7 @@ class OverviewMap extends Control {
      this.collapseLabel_ = collapseLabel;
    }

-    const label = options.label !== undefined ? options.label : '\u00BB';
+    const label = options.label !== undefined ? options.label : '\u203A';

    if (typeof label === 'string') {
      /**
--- a/src/ol/control/ScaleLine.js
+++ b/src/ol/control/ScaleLine.js
@@ -100,12 +100,12 @@ class ScaleLine extends Control {
    });

    /***
-     * @type {ScaleLineOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ScaleLineOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {ScaleLineOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ScaleLineOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/control/Zoom.js
+++ b/src/ol/control/Zoom.js
@@ -14,7 +14,7 @@ import {easeOut} from '../easing.js';
 * @property {string} [zoomOutClassName=className + '-out'] CSS class name for the zoom-out button.
 * @property {string|HTMLElement} [zoomInLabel='+'] Text label to use for the zoom-in
 * button. Instead of text, also an element (e.g. a `span` element) can be used.
- * @property {string|HTMLElement} [zoomOutLabel='-'] Text label to use for the zoom-out button.
+ * @property {string|HTMLElement} [zoomOutLabel='–'] Text label to use for the zoom-out button.
 * Instead of text, also an element (e.g. a `span` element) can be used.
 * @property {string} [zoomInTipLabel='Zoom in'] Text label to use for the button tip.
 * @property {string} [zoomOutTipLabel='Zoom out'] Text label to use for the button tip.
@@ -61,7 +61,7 @@ class Zoom extends Control {
    const zoomInLabel =
      options.zoomInLabel !== undefined ? options.zoomInLabel : '+';
    const zoomOutLabel =
-      options.zoomOutLabel !== undefined ? options.zoomOutLabel : '\u2212';
+      options.zoomOutLabel !== undefined ? options.zoomOutLabel : '\u2013';

    const zoomInTipLabel =
      options.zoomInTipLabel !== undefined ? options.zoomInTipLabel : 'Zoom in';
--- a/src/ol/css.js
+++ b/src/ol/css.js
@@ -114,3 +114,11 @@ export const getFontParameters = function (fontSpec) {
  style.families = style.family.split(/,\s?/);
  return style;
 };
+
+/**
+ * @param {number} opacity Opacity (0..1).
+ * @return {string} CSS opacity.
+ */
+export function cssOpacity(opacity) {
+  return opacity === 1 ? '' : String(Math.round(opacity * 100) / 100);
+}
--- a/src/ol/dom.js
+++ b/src/ol/dom.js
@@ -27,7 +27,7 @@ export function createCanvasContext2D(
    canvas = new OffscreenCanvas(opt_width || 300, opt_height || 300);
  } else {
    canvas = document.createElement('canvas');
-    canvas.style.all = 'initial';
+    canvas.style.all = 'unset';
  }
  if (opt_width) {
    canvas.width = opt_width;
--- a/src/ol/format/GMLBase.js
+++ b/src/ol/format/GMLBase.js
@@ -90,6 +90,7 @@ const ONLY_WHITESPACE_RE = /^[\s\xa0]*$/;
 * is shared with versioned format classes GML2 and GML3.
 *
 * @abstract
+ * @api
 */
 class GMLBase extends XMLFeature {
  /**
--- a/src/ol/format/IIIFInfo.js
+++ b/src/ol/format/IIIFInfo.js
@@ -40,7 +40,7 @@ import {includes} from '../array.js';
 */

 /**
- * @typedef {Object<string,string|number|Array<number|string|IiifProfile>|Object<string, number>|TileInfo>}
+ * @typedef {Object<string,string|number|Array<number|string|IiifProfile|Object<string, number>|TileInfo>>}
 *    ImageInformationResponse
 */

--- a/src/ol/geom/flat/textpath.js
+++ b/src/ol/geom/flat/textpath.js
@@ -54,7 +54,8 @@ export function drawTextOnPath(
    advance();
  } while (offset < end - stride && segmentM + segmentLength < startM);

-  let interpolate = (startM - segmentM) / segmentLength;
+  let interpolate =
+    segmentLength === 0 ? 0 : (startM - segmentM) / segmentLength;
  const beginX = lerp(x1, x2, interpolate);
  const beginY = lerp(y1, y2, interpolate);

@@ -64,7 +65,7 @@ export function drawTextOnPath(
  while (offset < end - stride && segmentM + segmentLength < endM) {
    advance();
  }
-  interpolate = (endM - segmentM) / segmentLength;
+  interpolate = segmentLength === 0 ? 0 : (endM - segmentM) / segmentLength;
  const endX = lerp(x1, x2, interpolate);
  const endY = lerp(y1, y2, interpolate);

@@ -88,11 +89,12 @@ export function drawTextOnPath(
  x2 = flatCoordinates[offset];
  y2 = flatCoordinates[offset + 1];

+  let previousAngle;
  // All on the same segment
  if (singleSegment) {
    advance();

-    let previousAngle = Math.atan2(y2 - y1, x2 - x1);
+    previousAngle = Math.atan2(y2 - y1, x2 - x1);
    if (reverse) {
      previousAngle += previousAngle > 0 ? -PI : PI;
    }
@@ -102,7 +104,6 @@ export function drawTextOnPath(
    return result;
  }

-  let previousAngle;
  for (let i = 0, ii = text.length; i < ii; ) {
    advance();
    let angle = Math.atan2(y2 - y1, x2 - x1);
@@ -137,7 +138,10 @@ export function drawTextOnPath(
    const chars = reverse
      ? text.substring(ii - iStart, ii - i)
      : text.substring(iStart, i);
-    interpolate = (startM + charLength / 2 - segmentM) / segmentLength;
+    interpolate =
+      segmentLength === 0
+        ? 0
+        : (startM + charLength / 2 - segmentM) / segmentLength;
    const x = lerp(x1, x2, interpolate);
    const y = lerp(y1, y2, interpolate);
    result.push([x, y, charLength / 2, angle, chars]);
--- a/src/ol/interaction/DragAndDrop.js
+++ b/src/ol/interaction/DragAndDrop.js
@@ -108,12 +108,12 @@ class DragAndDrop extends Interaction {
    });

    /***
-     * @type {DragAndDropOnSignature<import("../Observable").OnReturn>}
+     * @type {DragAndDropOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {DragAndDropOnSignature<import("../Observable").OnReturn>}
+     * @type {DragAndDropOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/DragBox.js
+++ b/src/ol/interaction/DragBox.js
@@ -123,12 +123,12 @@ class DragBox extends PointerInteraction {
    super();

    /***
-     * @type {DragBoxOnSignature<import("../Observable").OnReturn>}
+     * @type {DragBoxOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {DragBoxOnSignature<import("../Observable").OnReturn>}
+     * @type {DragBoxOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Draw.js
+++ b/src/ol/interaction/Draw.js
@@ -204,12 +204,12 @@ class Draw extends PointerInteraction {
    super(pointerOptions);

    /***
-     * @type {DrawOnSignature<import("../Observable").OnReturn>}
+     * @type {DrawOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {DrawOnSignature<import("../Observable").OnReturn>}
+     * @type {DrawOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Extent.js
+++ b/src/ol/interaction/Extent.js
@@ -103,12 +103,12 @@ class Extent extends PointerInteraction {
    super(/** @type {import("./Pointer.js").Options} */ (options));

    /***
-     * @type {ExtentOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ExtentOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {ExtentOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ExtentOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Interaction.js
+++ b/src/ol/interaction/Interaction.js
@@ -46,12 +46,12 @@ class Interaction extends BaseObject {
    super();

    /***
-     * @type {InteractionOnSignature<import("../Observable.js").OnReturn>}
+     * @type {InteractionOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {InteractionOnSignature<import("../Observable.js").OnReturn>}
+     * @type {InteractionOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Modify.js
+++ b/src/ol/interaction/Modify.js
@@ -203,12 +203,12 @@ class Modify extends PointerInteraction {
    super(/** @type {import("./Pointer.js").Options} */ (options));

    /***
-     * @type {ModifyOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ModifyOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {ModifyOnSignature<import("../Observable.js").OnReturn>}
+     * @type {ModifyOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Select.js
+++ b/src/ol/interaction/Select.js
@@ -154,8 +154,6 @@ const originalFeatureStyles = {};
 * `toggle`, `add`/`remove`, and `multi` options; a `layers` filter; and a
 * further feature filter using the `filter` option.
 *
- * Selected features are added to an internal unmanaged layer.
- *
 * @fires SelectEvent
 * @api
 */
@@ -167,12 +165,12 @@ class Select extends Interaction {
    super();

    /***
-     * @type {SelectOnSignature<import("../Observable.js").OnReturn>}
+     * @type {SelectOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {SelectOnSignature<import("../Observable.js").OnReturn>}
+     * @type {SelectOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/interaction/Translate.js
+++ b/src/ol/interaction/Translate.js
@@ -140,12 +140,12 @@ class Translate extends PointerInteraction {
    super(/** @type {import("./Pointer.js").Options} */ (options));

    /***
-     * @type {TranslateOnSignature<import("../Observable.js").OnReturn>}
+     * @type {TranslateOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {TranslateOnSignature<import("../Observable.js").OnReturn>}
+     * @type {TranslateOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/layer/Base.js
+++ b/src/ol/layer/Base.js
@@ -60,12 +60,12 @@ class BaseLayer extends BaseObject {
    super();

    /***
-     * @type {BaseLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {BaseLayerOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {BaseLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {BaseLayerOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/layer/BaseTile.js
+++ b/src/ol/layer/BaseTile.js
@@ -72,12 +72,12 @@ class BaseTileLayer extends Layer {
    super(baseOptions);

    /***
-     * @type {BaseTileLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {BaseTileLayerOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {BaseTileLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {BaseTileLayerOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/layer/Group.js
+++ b/src/ol/layer/Group.js
@@ -73,12 +73,12 @@ class LayerGroup extends BaseLayer {
    super(baseOptions);

    /***
-     * @type {GroupOnSignature<import("../Observable.js").OnReturn>}
+     * @type {GroupOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {GroupOnSignature<import("../Observable.js").OnReturn>}
+     * @type {GroupOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/layer/Layer.js
+++ b/src/ol/layer/Layer.js
@@ -79,7 +79,7 @@ import {listen, unlistenByKey} from '../events.js';
 * displayed, irrespective of the source of that data.
 *
 * Layers are usually added to a map with {@link import("../PluggableMap.js").default#addLayer map.addLayer()}. Components
- * like {@link module:ol/interaction/Select~Select} use unmanaged layers
+ * like {@link module:ol/interaction/Draw~Draw} use unmanaged layers
 * internally. These unmanaged layers are associated with the map using
 * {@link module:ol/layer/Layer~Layer#setMap} instead.
 *
@@ -107,12 +107,12 @@ class Layer extends BaseLayer {
    super(baseOptions);

    /***
-     * @type {LayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {LayerOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {LayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {LayerOnSignature<import("../events").EventsKey>}
     */
    this.once;

@@ -348,6 +348,11 @@ class Layer extends BaseLayer {
   * Clean up.
   */
  disposeInternal() {
+    if (this.renderer_) {
+      this.renderer_.dispose();
+      delete this.renderer_;
+    }
+
    this.setSource(null);
    super.disposeInternal();
  }
--- a/src/ol/layer/MapboxVector.js
+++ b/src/ol/layer/MapboxVector.js
@@ -7,7 +7,7 @@ import MVT from '../format/MVT.js';
 import SourceState from '../source/State.js';
 import VectorTileLayer from '../layer/VectorTile.js';
 import VectorTileSource from '../source/VectorTile.js';
-import {applyStyle} from 'ol-mapbox-style';
+import {applyStyle, setupVectorSource} from 'ol-mapbox-style';

 const mapboxBaseUrl = 'https://api.mapbox.com';

@@ -154,7 +154,9 @@ const SourceType = {
 * @property {string} styleUrl The URL of the Mapbox style object to use for this layer.  For a
 * style created with Mapbox Studio and hosted on Mapbox, this will look like
 * 'mapbox://styles/you/your-style'.
- * @property {string} accessToken The access token for your Mapbox style.
+ * @property {string} [accessToken] The access token for your Mapbox style. This has to be provided
+ * for `mapbox://` style urls. For `https://` and other urls, access keys must be part of the style
+ * url.
 * @property {string} [source] If your style uses more than one source, you need to use either the
 * `source` property or the `layers` property to limit rendering to a single vector source.  The
 * `source` property corresponds to the id of a vector source in your Mapbox style.
@@ -377,15 +379,32 @@ class MapboxVectorLayer extends VectorTileLayer {
    }

    const source = this.getSource();
-    source.setUrl(normalizeSourceUrl(styleSource.url, this.accessToken));
-
-    applyStyle(this, style, sourceIdOrLayersList)
-      .then(() => {
-        source.setState(SourceState.READY);
-      })
-      .catch((error) => {
-        this.handleError(error);
+    if (
+      styleSource.url.startsWith('mapbox://') ||
+      styleSource.url.indexOf('{z}') !== -1
+    ) {
+      // Tile source url, handle it directly
+      source.setUrl(normalizeSourceUrl(styleSource.url, this.accessToken));
+      applyStyle(this, style, sourceIdOrLayersList)
+        .then(() => {
+          source.setState(SourceState.READY);
+        })
+        .catch((error) => {
+          this.handleError(error);
+        });
+    } else {
+      // TileJSON url, let ol-mapbox-style handle it
+      setupVectorSource(styleSource, styleSource.url).then((source) => {
+        applyStyle(this, style, sourceIdOrLayersList)
+          .then(() => {
+            this.setSource(source);
+          })
+          .catch((error) => {
+            this.setSource(source);
+            this.handleError(error);
+          });
      });
+    }
  }

  /**
--- a/src/ol/layer/VectorTile.js
+++ b/src/ol/layer/VectorTile.js
@@ -106,12 +106,12 @@ class VectorTileLayer extends BaseVectorLayer {
    );

    /***
-     * @type {VectorTileLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {VectorTileLayerOnSignature<import("../events").EventsKey>}
     */
    this.on;

    /***
-     * @type {VectorTileLayerOnSignature<import("../Observable.js").OnReturn>}
+     * @type {VectorTileLayerOnSignature<import("../events").EventsKey>}
     */
    this.once;

--- a/src/ol/layer/WebGLPoints.js
+++ b/src/ol/layer/WebGLPoints.js
@@ -113,14 +113,6 @@ class WebGLPointsLayer extends Layer {
      attributes: this.parseResult_.attributes,
    });
  }
-
-  /**
-   * Clean up.
-   */
-  disposeInternal() {
-    this.getRenderer().disposeInternal();
-    super.disposeInternal();
-  }
 }

 export default WebGLPointsLayer;
--- a/src/ol/layer/WebGLTile.js
+++ b/src/ol/layer/WebGLTile.js
@@ -255,6 +255,9 @@ function parseStyle(style, bandCount) {
 * property on the layer object; for example, setting `title: 'My Title'` in the
 * options means that `title` is observable, and has get/set accessors.
 *
+ * **Important**: after removing a `WebGLTile` layer from your map, call `layer.dispose()`
+ * to clean up underlying resources.
+ *
 * @extends BaseTileLayer<import("../source/DataTile.js").default|import("../source/TileImage.js").default>
 * @api
 */
@@ -320,4 +323,11 @@ class WebGLTileLayer extends BaseTileLayer {
  }
 }

+/**
+ * Clean up underlying WebGL resources.
+ * @function
+ * @api
+ */
+WebGLTileLayer.prototype.dispose;
+
 export default WebGLTileLayer;
--- a/src/ol/loadingstrategy.js
+++ b/src/ol/loadingstrategy.js
@@ -2,6 +2,8 @@
 * @module ol/loadingstrategy
 */

+import {fromUserExtent, fromUserResolution, toUserExtent} from './proj.js';
+
 /**
 * Strategy function for loading all features with a single request.
 * @param {import("./extent.js").Extent} extent Extent.
@@ -28,7 +30,7 @@ export function bbox(extent, resolution) {
 /**
 * Creates a strategy function for loading features based on a tile grid.
 * @param {import("./tilegrid/TileGrid.js").default} tileGrid Tile grid.
- * @return {function(import("./extent.js").Extent, number): Array<import("./extent.js").Extent>} Loading strategy.
+ * @return {function(import("./extent.js").Extent, number, import("./proj.js").Projection): Array<import("./extent.js").Extent>} Loading strategy.
 * @api
 */
 export function tile(tileGrid) {
@@ -36,11 +38,17 @@ export function tile(tileGrid) {
    /**
     * @param {import("./extent.js").Extent} extent Extent.
     * @param {number} resolution Resolution.
+     * @param {import("./proj.js").Projection} projection Projection.
     * @return {Array<import("./extent.js").Extent>} Extents.
     */
-    function (extent, resolution) {
-      const z = tileGrid.getZForResolution(resolution);
-      const tileRange = tileGrid.getTileRangeForExtentAndZ(extent, z);
+    function (extent, resolution, projection) {
+      const z = tileGrid.getZForResolution(
+        fromUserResolution(resolution, projection)
+      );
+      const tileRange = tileGrid.getTileRangeForExtentAndZ(
+        fromUserExtent(extent, projection),
+        z
+      );
      /** @type {Array<import("./extent.js").Extent>} */
      const extents = [];
      /** @type {import("./tilecoord.js").TileCoord} */
@@ -55,7 +63,9 @@ export function tile(tileGrid) {
          tileCoord[2] <= tileRange.maxY;
          ++tileCoord[2]
        ) {
-          extents.push(tileGrid.getTileCoordExtent(tileCoord));
+          extents.push(
+            toUserExtent(tileGrid.getTileCoordExtent(tileCoord), projection)
+          );
        }
      }
      return extents;
--- a/src/ol/ol.css
+++ b/src/ol/ol.css
@@ -1,7 +1,8 @@
 .ol-box {
  box-sizing: border-box;
  border-radius: 2px;
-  border: 2px solid blue;
+  border: 1.5px solid rgb(179,197,219);
+  background-color: rgba(255,255,255,0.4);
 }

 .ol-mouse-position {
@@ -130,7 +131,6 @@
  margin: 1px;
  padding: 0;
  color: white;
-  font-size: 1.14em;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
@@ -180,13 +180,18 @@
  max-width: calc(100% - 1.3em);
  display: flex;
  flex-flow: row-reverse;
-  align-items: flex-end;
+  align-items: center;
+}
+.ol-attribution a {
+  color: rgba(0,60,136,0.7);
+  text-decoration: none;
 }
 .ol-attribution ul {
  margin: 0;
  padding: 1px .5em;
  color: #000;
  text-shadow: 0 0 2px #fff;
+  font-size: 12px;
 }
 .ol-attribution li {
  display: inline;
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Tim Schaub	a2d6bd3d85	Updates for 6.8	2021-09-24 19:51:28 +00:00
Tim Schaub	264f155fe3	Merge pull request #12785 from mike-000/Promise.allSettled Promise.allSettled polyfill and other browser compatibilty	2021-09-24 19:32:53 +00:00
Tim Schaub	0b1d0c9b6e	Merge pull request #12807 from tschaub/style-tweaks Updated styles	2021-09-24 14:12:56 +00:00
Tim Schaub	f5169aafd3	Merge pull request #12806 from tschaub/simpler-sea-level Update to the WebGL sea level example	2021-09-24 13:50:19 +00:00
Tim Schaub	3db0bf1c6d	Update to the WebGL sea level example	2021-09-24 13:41:19 +00:00
Tim Schaub	f5052149d1	Updated styles	2021-09-24 13:40:54 +00:00
Tim Schaub	01bd84d1fc	Merge pull request #12808 from tschaub/rendering-tests Update expectations for vector tile icon label rendering	2021-09-24 13:40:35 +00:00
Tim Schaub	a5e236fe0c	Update expectations for vector tile icon label rendering	2021-09-24 13:24:14 +00:00
Andreas Hocevar	2e222083de	Merge pull request #12804 from ahocevar/vectortiles-simpler-faster Make vector tiles rendering simpler and a bit faster	2021-09-23 20:38:17 +00:00
Tim Schaub	b03b6b2e87	Merge pull request #12802 from tschaub/enqueue-next Enqueue tiles at the next step in the animation	2021-09-23 20:37:38 +00:00
Andreas Hocevar	9aa890217c	Render images only when we have frame budget left	2021-09-23 20:11:26 +00:00
Andreas Hocevar	74a628ac85	Remove unused tile image render queue	2021-09-23 19:47:10 +00:00
Tim Schaub	4dc66ef8e3	Enqueue tiles at the next resolution in the animation	2021-09-23 17:28:39 +00:00
Andreas Hocevar	1bd0d8187f	Merge pull request #12801 from ahocevar/latest-ol-mapbox-style Update ol-mapbox-style to latest version without ol peer dependency	2021-09-23 16:35:34 +00:00
Andreas Hocevar	6d427050ce	Merge pull request #12792 from ahocevar/no-render-work-when-no-features Do not do any canvas work when there are no features to render	2021-09-23 16:34:47 +00:00
Andreas Hocevar	03f8bf47e1	Update ol-mapbox-style to latest version without ol peer dependency	2021-09-23 14:41:57 +00:00
Andreas Hocevar	3a2c33f827	Merge pull request #12797 from ahocevar/dependency-updates Update geotiff	2021-09-23 14:28:55 +00:00
Andreas Hocevar	276d6cb914	Update related dependencies	2021-09-23 13:35:11 +00:00
Tim Schaub	2435321133	Merge pull request #12799 from tschaub/dispose-webgl-points All layers now call dispose on the renderer	2021-09-23 13:26:22 +00:00
Andreas Hocevar	c934f08866	Update geotiff	2021-09-23 13:24:58 +00:00
Tim Schaub	f357495574	All layers now call dispose on the renderer	2021-09-23 13:14:22 +00:00
Tim Schaub	0db6a021c2	Merge pull request #12798 from tschaub/dispose-webgl-tilelayer More cleanup in the WebGL tile layer's dispose method	2021-09-23 12:34:23 +00:00
Tim Schaub	a332842540	More cleanup in the WebGL tile layer's dispose method	2021-09-23 12:00:00 +00:00
Tim Schaub	2ebbee2340	Merge pull request #12795 from mike-000/wmts New tile source for the WMTS example	2021-09-22 23:51:50 +00:00
mike-000	1776f13f4c	Update the tile source	2021-09-22 16:25:17 +01:00
Tim Schaub	81bdd513df	Merge pull request #12793 from tschaub/set-layers Add a method to set the map layers	2021-09-22 03:17:37 -05:00
Tim Schaub	a63735a649	Add a method to set the map layers	2021-09-21 13:34:35 +00:00
Andreas Hocevar	46b21c2588	Do not do any canvas work when there are no features to render	2021-09-21 11:21:01 +00:00
Andreas Hocevar	b50f4ce107	Merge pull request #12789 from ahocevar/mapbox-vector-layer-tilejson Handle TileJSON urls in Mapbox Style document	2021-09-21 11:08:51 +00:00
Tim Schaub	0505d5d379	Merge pull request #12790 from tschaub/view-promise Allow maps to be configured with a promise for view props	2021-09-21 05:35:14 -05:00
Tim Schaub	d5813deb08	Allow maps to be configured with a promise for view props	2021-09-21 10:25:29 +00:00
Andreas Hocevar	8585d4382b	Handle TileJSON urls in Mapbox Style document	2021-09-20 23:37:53 +00:00
Tim Schaub	79a54e33bb	Merge pull request #12784 from openlayers/dependabot/npm_and_yarn/webpack-dev-server-4.2.1 Bump webpack-dev-server from 4.2.0 to 4.2.1	2021-09-20 12:48:55 -05:00
Tim Schaub	0a2404089e	Merge pull request #12783 from openlayers/dependabot/npm_and_yarn/marked-3.0.4 Bump marked from 3.0.3 to 3.0.4	2021-09-20 12:48:27 -05:00
Tim Schaub	c3cdba3d00	Merge pull request #12782 from openlayers/dependabot/npm_and_yarn/webpack-sources-3.2.1 Bump webpack-sources from 3.2.0 to 3.2.1	2021-09-20 12:48:01 -05:00
Tim Schaub	67034faa60	Merge pull request #12781 from openlayers/dependabot/npm_and_yarn/webpack-5.53.0 Bump webpack from 5.52.1 to 5.53.0	2021-09-20 12:47:30 -05:00
Tim Schaub	878721468e	Merge pull request #12780 from openlayers/dependabot/npm_and_yarn/babel/eslint-parser-7.15.7 Bump @babel/eslint-parser from 7.15.4 to 7.15.7	2021-09-20 12:46:59 -05:00
mike-000	ff6aee0d45	Additional requirements for ol/source/GeoTIFF	2021-09-20 12:25:18 +01:00
mike-000	8be8660b91	Fix range slider for better browser support	2021-09-20 11:39:21 +01:00
mike-000	3b108ef058	add NumpyLoader	2021-09-20 11:25:21 +01:00
mike-000	208e2cb022	Polyfill for Promise.allSettled	2021-09-20 11:21:21 +01:00
mike-000	b4275f887e	Polyfill for Promise.allSettled	2021-09-20 11:17:59 +01:00
dependabot[bot]	7478705871	Bump webpack-dev-server from 4.2.0 to 4.2.1 Bumps [webpack-dev-server](https://github.com/webpack/webpack-dev-server) from 4.2.0 to 4.2.1. - [Release notes](https://github.com/webpack/webpack-dev-server/releases) - [Changelog](https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack/webpack-dev-server/compare/v4.2.0...v4.2.1) --- updated-dependencies: - dependency-name: webpack-dev-server dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-20 10:02:11 +00:00
dependabot[bot]	5dffb0e94e	Bump marked from 3.0.3 to 3.0.4 Bumps [marked](https://github.com/markedjs/marked) from 3.0.3 to 3.0.4. - [Release notes](https://github.com/markedjs/marked/releases) - [Changelog](https://github.com/markedjs/marked/blob/master/release.config.js) - [Commits](https://github.com/markedjs/marked/compare/v3.0.3...v3.0.4) --- updated-dependencies: - dependency-name: marked dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-20 10:01:57 +00:00
dependabot[bot]	1d4c40b05e	Bump webpack-sources from 3.2.0 to 3.2.1 Bumps [webpack-sources](https://github.com/webpack/webpack-sources) from 3.2.0 to 3.2.1. - [Release notes](https://github.com/webpack/webpack-sources/releases) - [Commits](https://github.com/webpack/webpack-sources/compare/v3.2.0...v3.2.1) --- updated-dependencies: - dependency-name: webpack-sources dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-20 10:01:21 +00:00
dependabot[bot]	e40c029f9f	Bump webpack from 5.52.1 to 5.53.0 Bumps [webpack](https://github.com/webpack/webpack) from 5.52.1 to 5.53.0. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v5.52.1...v5.53.0) --- updated-dependencies: - dependency-name: webpack dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-20 10:01:11 +00:00
dependabot[bot]	1344ee83a3	Bump @babel/eslint-parser from 7.15.4 to 7.15.7 Bumps [@babel/eslint-parser](https://github.com/babel/babel/tree/HEAD/eslint/babel-eslint-parser) from 7.15.4 to 7.15.7. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.15.7/eslint/babel-eslint-parser) --- updated-dependencies: - dependency-name: "@babel/eslint-parser" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-20 10:00:56 +00:00
Andreas Hocevar	b2f1d081ed	Merge pull request #12777 from ahocevar/fix-offscreen-canvas Fix offscreen-canvas example	2021-09-18 22:47:26 +02:00
Andreas Hocevar	b7e3695cac	Merge pull request #12778 from ahocevar/vectortile-remove-extra-work Do not render vector tiles unless they are being used	2021-09-18 22:46:41 +02:00
Tim Schaub	391af5a466	Merge pull request #12773 from tschaub/lazy-gl-extensions Enable WebGL extensions when required	2021-09-18 07:26:26 -06:00
MoonE	964b1af72a	Merge pull request #12774 from MoonE/fix-text-declutter Fix text decluttering when segment length is zero	2021-09-18 11:09:15 +02:00
Andreas Hocevar	610fd69120	Do not render vector tiles unless they are being used	2021-09-18 11:02:55 +02:00
Andreas Hocevar	35b3262e0b	Fix offscreen-canvas example	2021-09-18 10:30:34 +02:00
Andreas Hocevar	e5193ffa6e	Use a more restrictive Mapbox token	2021-09-18 09:28:25 +02:00
Maximilian Krög	4be657a28f	Fix text decluttering when segment length is zero	2021-09-17 23:09:56 +02:00
Tim Schaub	367d77d1dc	Merge pull request #12770 from tschaub/avoid-clamped Use Uint8Array instead of Uint8ClampedArray for increased browser compatibility	2021-09-17 14:29:59 -06:00
Tim Schaub	da256e6c00	Enable WebGL extensions when required	2021-09-17 14:14:12 -06:00
Andreas Hocevar	0d06f7b493	Merge pull request #12759 from jumpinjackie/fix/control-typings #12758: Allow undefined to be passed to control setMap(). Also fix type of getMap()	2021-09-17 08:07:39 +02:00
Tim Schaub	836aa4900e	Use Uint8Array instead of Uint8ClampedArray for browser compatibility	2021-09-16 15:10:35 -06:00
Andreas Hocevar	c57c898381	Merge pull request #12760 from ahocevar/opacity Fix opacity handling for tile and vector layers	2021-09-16 19:49:47 +02:00
Tim Schaub	a1eb2481ba	Merge pull request #12764 from webwitcher/imageinformationresponse-fix Fix ImageInformationResponse typedef	2021-09-16 10:16:32 -06:00
Tim Schaub	87aa801939	Merge pull request #12769 from tschaub/fix-anchor Remove extra closing anchor tag	2021-09-16 10:08:09 -06:00
Tim Schaub	0fb5237de2	Remove extra closing anchor tag	2021-09-16 09:59:22 -06:00
Tim Schaub	506b176ef2	Merge pull request #12761 from theduckylittle/datatile-float-textures Add Float Textures for GL Rendering / DataTiles	2021-09-16 09:56:29 -06:00
Tim Schaub	0783a8211f	Adjustments to NumpyTiles example	2021-09-16 09:44:43 -06:00
Martin Hauck	c86841dae0	Update src/ol/format/IIIFInfo.js Co-authored-by: Simon Seyock <8100558+simonseyock@users.noreply.github.com>	2021-09-16 17:15:11 +02:00
Duck	3fc8217254	Add example featuring numpytiles	2021-09-16 07:09:31 -07:00
Martin Hauck	e955eeff21	Fix ImageInformationResponse typedef `TileInfo` should be an array to conform to https://iiif.io/api/image	2021-09-16 11:41:33 +02:00
Andreas Hocevar	2f5e6906b9	Fix opacity handling for tile and vector layers	2021-09-16 08:49:32 +02:00
Duck	05615df1a3	Allow TileTexture to select float or int based textures.	2021-09-15 15:10:55 -07:00
Duck	f2472b7801	Allow DataTile source to include more than four bands.	2021-09-15 15:10:26 -07:00
Duck	17394cc8be	Ensure the texture is loaded into the correct index. The previous code would try to load subsequent textures into the 0th slot.	2021-09-15 15:10:08 -07:00
Duck	5afd25150f	Add additional extension requirements for floating point textures.	2021-09-15 09:35:23 -07:00
mike-000	cb6995d71a	Various fixes for browser compatibility issues (#12740 ) * Replace Math.log2 with ol/math.log2 * TypedArray.from() browser compatibility fallback * listen for input and change events for range	2021-09-15 08:45:12 -06:00
Tim Schaub	f9454ba8e3	Merge pull request #12741 from mike-000/GMLBase Minimal documentation for GMLBase	2021-09-15 08:42:08 -06:00
Tim Schaub	77e457a676	Merge pull request #12750 from openlayers/dependabot/npm_and_yarn/webpack-dev-server-4.2.0 Bump webpack-dev-server from 4.1.0 to 4.2.0	2021-09-15 08:38:20 -06:00
Jackie Ng	67d885d6ef	#12758 : Allow undefined to be passed to control setMap(). Consequently the return type of getMap() now can also be undefined as well.	2021-09-16 00:05:53 +10:00
Andreas Hocevar	0efdef9b40	Merge pull request #12749 from openlayers/dependabot/npm_and_yarn/marked-3.0.3 Bump marked from 3.0.2 to 3.0.3	2021-09-13 17:49:23 +02:00
Andreas Hocevar	860546800f	Merge pull request #12748 from openlayers/dependabot/npm_and_yarn/ol-mapbox-style-6.4.2 Bump ol-mapbox-style from 6.4.1 to 6.4.2	2021-09-13 17:48:56 +02:00
Andreas Hocevar	cccdaf7546	Merge pull request #12747 from openlayers/dependabot/npm_and_yarn/terser-webpack-plugin-5.2.4 Bump terser-webpack-plugin from 5.2.3 to 5.2.4	2021-09-13 17:48:24 +02:00
Andreas Hocevar	ee8fe615f2	Merge pull request #12746 from openlayers/dependabot/npm_and_yarn/babel/preset-env-7.15.6 Bump @babel/preset-env from 7.15.4 to 7.15.6	2021-09-13 17:47:55 +02:00
Andreas Hocevar	d4f77349e7	Merge pull request #12745 from openlayers/dependabot/npm_and_yarn/webpack-5.52.1 Bump webpack from 5.52.0 to 5.52.1	2021-09-13 17:47:18 +02:00
Andreas Hocevar	2523929c4f	Merge pull request #12744 from openlayers/dependabot/npm_and_yarn/webpack-dev-middleware-5.1.0 Bump webpack-dev-middleware from 5.0.0 to 5.1.0	2021-09-13 17:46:41 +02:00
Andreas Hocevar	11ea89468a	Merge pull request #12743 from mike-000/patch-3 Remove docs reference to unmanaged layer and Select	2021-09-13 17:45:45 +02:00
dependabot[bot]	ee7b877b9f	Bump webpack-dev-server from 4.1.0 to 4.2.0 Bumps [webpack-dev-server](https://github.com/webpack/webpack-dev-server) from 4.1.0 to 4.2.0. - [Release notes](https://github.com/webpack/webpack-dev-server/releases) - [Changelog](https://github.com/webpack/webpack-dev-server/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack/webpack-dev-server/compare/v4.1.0...v4.2.0) --- updated-dependencies: - dependency-name: webpack-dev-server dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:02:15 +00:00
dependabot[bot]	bac66e6cbc	Bump marked from 3.0.2 to 3.0.3 Bumps [marked](https://github.com/markedjs/marked) from 3.0.2 to 3.0.3. - [Release notes](https://github.com/markedjs/marked/releases) - [Changelog](https://github.com/markedjs/marked/blob/master/release.config.js) - [Commits](https://github.com/markedjs/marked/compare/v3.0.2...v3.0.3) --- updated-dependencies: - dependency-name: marked dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:02:03 +00:00
dependabot[bot]	08e1f2e8ef	Bump ol-mapbox-style from 6.4.1 to 6.4.2 Bumps [ol-mapbox-style](https://github.com/openlayers/ol-mapbox-style) from 6.4.1 to 6.4.2. - [Release notes](https://github.com/openlayers/ol-mapbox-style/releases) - [Changelog](https://github.com/openlayers/ol-mapbox-style/blob/master/CHANGELOG.md) - [Commits](https://github.com/openlayers/ol-mapbox-style/compare/v6.4.1...v6.4.2) --- updated-dependencies: - dependency-name: ol-mapbox-style dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:01:47 +00:00
dependabot[bot]	24948708e4	Bump terser-webpack-plugin from 5.2.3 to 5.2.4 Bumps [terser-webpack-plugin](https://github.com/webpack-contrib/terser-webpack-plugin) from 5.2.3 to 5.2.4. - [Release notes](https://github.com/webpack-contrib/terser-webpack-plugin/releases) - [Changelog](https://github.com/webpack-contrib/terser-webpack-plugin/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/terser-webpack-plugin/compare/v5.2.3...v5.2.4) --- updated-dependencies: - dependency-name: terser-webpack-plugin dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:01:35 +00:00
dependabot[bot]	5eee0277d2	Bump @babel/preset-env from 7.15.4 to 7.15.6 Bumps [@babel/preset-env](https://github.com/babel/babel/tree/HEAD/packages/babel-preset-env) from 7.15.4 to 7.15.6. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.15.6/packages/babel-preset-env) --- updated-dependencies: - dependency-name: "@babel/preset-env" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:01:18 +00:00
dependabot[bot]	4c278a801f	Bump webpack from 5.52.0 to 5.52.1 Bumps [webpack](https://github.com/webpack/webpack) from 5.52.0 to 5.52.1. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v5.52.0...v5.52.1) --- updated-dependencies: - dependency-name: webpack dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:01:04 +00:00
dependabot[bot]	5ed413ee3c	Bump webpack-dev-middleware from 5.0.0 to 5.1.0 Bumps [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) from 5.0.0 to 5.1.0. - [Release notes](https://github.com/webpack/webpack-dev-middleware/releases) - [Changelog](https://github.com/webpack/webpack-dev-middleware/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack/webpack-dev-middleware/compare/v5.0.0...v5.1.0) --- updated-dependencies: - dependency-name: webpack-dev-middleware dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com>	2021-09-13 10:00:50 +00:00
mike-000	5d937b8c5b	Remove docs reference to unmanaged layer	2021-09-13 10:27:16 +01:00
mike-000	a5ed3ce853	Change Select to Draw to describe unmanaged layers	2021-09-13 10:20:30 +01:00
mike-000	7b725cfdf0	add @api	2021-09-12 16:20:22 +01:00
Andreas Hocevar	c5fafbd6c2	Merge pull request #12734 from ahocevar/still-ie11-why-oh-why Continue supporting IE11 in examples and legacy build	2021-09-11 17:23:03 +02:00
Andreas Hocevar	6085964b61	Merge pull request #12739 from mike-000/patch-2 Change canvas style from initial to unset	2021-09-10 21:50:28 +02:00
mike-000	e0c15c28dc	Change canvas style from initial to unset	2021-09-10 20:18:20 +01:00
Andreas Hocevar	c128051802	Add polyfills to legacy build preview	2021-09-10 18:32:26 +02:00
Andreas Hocevar	0f2ec4d9c5	Add legacy build test map to site/index.html	2021-09-10 18:15:09 +02:00
Andreas Hocevar	ccb9ff6f37	Configure builds so they actually work	2021-09-10 18:15:08 +02:00
Andreas Hocevar	f0b3ce635a	Merge pull request #12731 from ahocevar/user-resolution Handle resolution and tile loadingstrategy with user projection	2021-09-10 17:52:48 +02:00
Tim Schaub	bb20ca3c23	Merge pull request #12736 from simonseyock/onsignature-return OnSignatures return more specific type	2021-09-10 08:33:47 -06:00
Andreas Hocevar	b4d93141ec	Do not mangle properties for built examples	2021-09-10 16:28:42 +02:00
Simon Seyock	ce4f6ccb0d	OnSignatures return more specific type	2021-09-10 16:11:38 +02:00
Andreas Hocevar	fa8aa81840	Continue supporting IE11 in examples and legacy buld	2021-09-10 13:40:25 +02:00
Andreas Hocevar	26fd8a8f59	Better distinguish new example from existing one	2021-09-10 13:15:17 +02:00
Andreas Hocevar	87bcfdeaa4	Merge pull request #12732 from mike-000/patch-1 Add <meta charset="utf-8"> to Quick Start	2021-09-10 13:10:24 +02:00
mike-000	5cf5b7aeb1	Add <meta charset="utf-8"> to Quick Start	2021-09-10 10:14:05 +01:00
Andreas Hocevar	50e89080a4	Use view projection tile grid in tile loadingstrategy	2021-09-10 02:01:47 +02:00
Andreas Hocevar	c9593b0cf6	Adjust resolution for user extent	2021-09-10 02:01:46 +02:00
Tim Schaub	22a0a209ac	Merge pull request #12728 from openlayers/release-v6.7.0 Release v6.7.0	2021-09-09 11:44:08 -06:00
Tim Schaub	eddf8df139	Develop on 6.7.1-dev	2021-09-09 11:35:21 -06:00