fix

Fix control styles on Full Screen Mobile example

.github/codeql/config.yml

@@ -1,4 +0,0 @@
-name: "OpenLayers CodeQL Config"
-
-paths:
-  - src

.github/dependabot.yml

@@ -6,3 +6,7 @@ updates:
     interval: weekly
   open-pull-requests-limit: 10
   versioning-strategy: increase-if-necessary
+- package-ecosystem: github-actions
+  directory: "/"
+  schedule:
+    interval: weekly

.github/workflows/build-preview.yml

@@ -0,0 +1,32 @@
+name: Build Preview
+
+on:
+  pull_request:
+    branches:
+      - main
+
+permissions:
+  contents: read
+
+jobs:
+  build-preview:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+      - run: npm ci
+      - run: ./tasks/build-website.sh -v dev -l dev
+      - uses: actions/upload-artifact@v3
+        with:
+          name: site
+          path: build/site
+      - name: Store pull request number for later use
+        run: |
+          mkdir -p build/pr
+          echo ${{github.event.number}} > build/pr/number
+      - uses: actions/upload-artifact@v3
+        with:
+          name: pr
+          path: build/pr

.github/workflows/deploy-preview.yml

@@ -0,0 +1,96 @@
+name: Deploy Website (Preview)
+
+on:
+  workflow_run:
+    workflows: ["Build Preview"]
+    types:
+      - completed
+
+jobs:
+  deploy-preview:
+    runs-on: ubuntu-latest
+    if: ${{github.event.workflow_run.event == 'pull_request' && github.event.workflow_run.conclusion == 'success'}}
+    steps:
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '16'
+      - run: npm install --global netlify-cli@6
+      - run: npm install unzipper@0.10
+
+      - name: Get pull request number
+        uses: actions/github-script@v6
+        id: pull-request-number
+        with:
+          result-encoding: string
+          script: |
+            const unzipper = require('unzipper');
+
+            const artifacts = await github.rest.actions.listWorkflowRunArtifacts({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              run_id: ${{github.event.workflow_run.id}}
+            });
+
+            const artifact = artifacts.data.artifacts.filter(
+              artifact => artifact.name === 'pr'
+            )[0];
+
+            if (!artifact) {
+              throw new Error('No pr artifact found');
+            }
+
+            const download = await github.rest.actions.downloadArtifact({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              artifact_id: artifact.id,
+              archive_format: 'zip'
+            });
+
+            const directory = await unzipper.Open.buffer(Buffer.from(download.data));
+            const file = directory.files.find(d => d.path === 'number');
+            const content = await file.buffer();
+            return content.toString();
+
+      - uses: dawidd6/action-download-artifact@v2
+        with:
+          github_token: ${{secrets.GITHUB_TOKEN}}
+          workflow: build-preview.yml
+          pr: ${{steps.pull-request-number.outputs.result}}
+          name: site
+          path: build/site
+
+      - name: Deploy to Netlify
+        env:
+          NETLIFY_AUTH_TOKEN: ${{secrets.NETLIFY_AUTH_TOKEN}}
+          NETLIFY_SITE_ID: ${{secrets.NETLIFY_SITE_ID}}
+        run: netlify deploy --dir=build/site --alias=deploy-preview-${{steps.pull-request-number.outputs.result}}
+
+      - name: Add comment to pull request
+        uses: actions/github-script@v6
+        with:
+          script: |
+            const pullRequestNumber = parseInt(${{steps.pull-request-number.outputs.result}}, 10);
+
+            const start = ':package:';
+            const author = 'github-actions[bot]';
+
+            const comments = await github.rest.issues.listComments({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: pullRequestNumber
+            });
+
+            const commentExists = comments.data.some(
+              comment => comment.user.login === author && comment.body.startsWith(start)
+            );
+
+            if (!commentExists) {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: pullRequestNumber,
+                body: `${start} Preview the website for this branch here: https://deploy-preview-${pullRequestNumber}--ol-site.netlify.app/.`
+              });
+            } else {
+              console.log(`Preview URL comment already added to PR #${pullRequestNumber}`);
+            }

.github/workflows/deploy.yml

@@ -0,0 +1,71 @@
+name: Deploy Website
+
+on:
+  push:
+    branches:
+      - main
+    tags:
+      - 'v*.*.*'
+
+concurrency:
+  group: "deploy"
+
+jobs:
+  deploy-branch:
+    if: startsWith(github.ref, 'refs/heads/')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build Website
+        run: ./tasks/build-website.sh -l $(node tasks/get-latest-release.js)
+      - name: Check out openlayers.github.io
+        uses: actions/checkout@v3
+        with:
+          repository: openlayers/openlayers.github.io
+          ssh-key: ${{ secrets.OPENLAYERS_GITHUB_IO_KEY }}
+          path: openlayers.github.io
+      - run: |
+          cp -r build/site/* openlayers.github.io/dist/
+          cd openlayers.github.io
+          if [ -n "$(git status --porcelain)" ]; then
+            git config user.name "$(git --no-pager log --format=format:'%an' -n 1)"
+            git config user.email "$(git --no-pager log --format=format:'%ae' -n 1)"
+            git add .
+            git commit -m "Website updates"
+            git push origin main
+          fi
+  deploy-tag:
+    if: startsWith(github.ref, 'refs/tags/')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+      - name: Install dependencies
+        run: npm ci
+      - name: Assert Latest Release
+        run: node tasks/newest-tag.js --tag ${GITHUB_REF_NAME}
+      - name: Build Website
+        run: ./tasks/build-website.sh -l ${GITHUB_REF_NAME} -v ${GITHUB_REF_NAME}
+      - name: Check out openlayers.github.io
+        uses: actions/checkout@v3
+        with:
+          repository: openlayers/openlayers.github.io
+          ssh-key: ${{ secrets.OPENLAYERS_GITHUB_IO_KEY }}
+          path: openlayers.github.io
+      - run: |
+          cp -r build/site/* openlayers.github.io/dist/
+          cd openlayers.github.io
+          if [ -n "$(git status --porcelain)" ]; then
+            git config user.name "$(git --no-pager log --format=format:'%an' -n 1)"
+            git config user.email "$(git --no-pager log --format=format:'%ae' -n 1)"
+            git add .
+            git commit -m "Website updates"
+            git push origin main
+          fi

.github/workflows/publish.yml

@@ -1,19 +1,25 @@
-name: Publish
+name: Publish Package
 
 on:
   push:
     branches:
       - main
+    tags:
+      - 'v*.*.*'
+
+permissions:
+  contents: read
 
 jobs:
-  publish-npm:
+  publish-branch:
+    if: startsWith(github.ref, 'refs/heads/')
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
-      - uses: actions/setup-node@v1
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
-          node-version: 16
-          registry-url: https://registry.npmjs.org/
+          node-version: '18'
+          registry-url: 'https://registry.npmjs.org'
       - name: Install dependencies
         run: npm ci
       - name: Publish
@@ -24,4 +30,24 @@ jobs:
           cd build/ol
           npm publish --tag dev
         env:
-          NODE_AUTH_TOKEN: ${{secrets.npm_token}}
+          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
+  publish-tag:
+    if: startsWith(github.ref, 'refs/tags/')
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+          registry-url: 'https://registry.npmjs.org'
+      - name: Install dependencies
+        run: npm ci
+      - name: Assert Latest Release
+        run: node tasks/newest-tag.js --tag ${GITHUB_REF_NAME}
+      - name: Publish
+        run: |
+          npm run build-package
+          cd build/ol
+          npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}

.github/workflows/release.yml

@@ -0,0 +1,21 @@
+name: Create Release
+
+on:
+  push:
+    tags:
+      - 'v*.*.*'
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: '18'
+      - name: Install dependencies
+        run: npm ci
+      - name: Build Release Assets
+        run: ./tasks/build-website.sh -l ${GITHUB_REF_NAME} -v ${GITHUB_REF_NAME}
+      - name: Create Release
+        run: node tasks/create-release.js --token ${{secrets.GITHUB_TOKEN}} --tag ${GITHUB_REF_NAME} --legacy build/${GITHUB_REF_NAME}-legacy.zip --site build/${GITHUB_REF_NAME}-site.zip

.github/workflows/security.yml

@@ -10,25 +10,25 @@ on:
   schedule:
     - cron: '0 0 * * 0'  # At 00:00 on Sunday
 
+permissions:
+  contents: read
+
 jobs:
   codeql:
+    permissions:
+      actions: read  # for github/codeql-action/init to get workflow details
+      contents: read  # for actions/checkout to fetch code
+      security-events: write  # for github/codeql-action/analyze to upload SARIF results
     runs-on: ubuntu-latest
 
     steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-        with:
-          # Must fetch at least the immediate parents so that if this is
-          # a pull request then we can checkout the head of the pull request.
-          # Only include this option if you are running this workflow on pull requests.
-          fetch-depth: 2
+      - uses: actions/checkout@v3
 
-      # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@v1
+        uses: github/codeql-action/init@v2
         with:
           languages: javascript
-          config-file: ./.github/codeql/config.yml
+          source-root: src
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v1
+        uses: github/codeql-action/analyze@v2

.github/workflows/test.yml

@@ -11,6 +11,9 @@ on:
 env:
   CI: true
 
+permissions:
+  contents: read
+
 jobs:
   pretest:
     name: Pre-Test
@@ -21,25 +24,12 @@ jobs:
 
     steps:
       - name: Clone Repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Set Node.js Version
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 16
-
-      - name: Determine Cache Directory
-        id: npm-cache
-        run: |
-          echo "::set-output name=dir::$(npm config get cache)"
-
-      - name: Configure Job Cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.npm-cache.outputs.dir }}
-          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-node-
+          node-version: '16'
 
       - name: Install Dependencies
         run: npm ci
@@ -56,25 +46,12 @@ jobs:
 
     steps:
       - name: Clone Repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Set Node.js Version
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 16
-
-      - name: Determine Cache Directory
-        id: npm-cache
-        run: |
-          echo "::set-output name=dir::$(npm config get cache)"
-
-      - name: Configure Job Cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.npm-cache.outputs.dir }}
-          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-node-
+          node-version: '16'
 
       - name: Install Dependencies
         run: npm ci
@@ -91,25 +68,12 @@ jobs:
 
     steps:
       - name: Clone Repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Set Node.js Version
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 16
-
-      - name: Determine Cache Directory
-        id: npm-cache
-        run: |
-          echo "::set-output name=dir::$(npm config get cache)"
-
-      - name: Configure Job Cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.npm-cache.outputs.dir }}
-          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-node-
+          node-version: '16'
 
       - name: Install Dependencies
         run: npm ci
@@ -126,25 +90,12 @@ jobs:
 
     steps:
       - name: Clone Repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Set Node.js Version
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 16
-
-      - name: Determine Cache Directory
-        id: npm-cache
-        run: |
-          echo "::set-output name=dir::$(npm config get cache)"
-
-      - name: Configure Job Cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.npm-cache.outputs.dir }}
-          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-node-
+          node-version: '16'
 
       - name: Install Dependencies
         run: npm ci
@@ -152,8 +103,8 @@ jobs:
       - name: Build the Package
         run: npm run build-package
 
-      - name: Generate the Legacy Build
-        run: npm run build-legacy && npx eslint --fix build/index.js
+      - name: Generate the Full Build
+        run: "npm run build-full"
 
   rendering:
     name: Rendering
@@ -164,25 +115,12 @@ jobs:
 
     steps:
       - name: Clone Repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
 
       - name: Set Node.js Version
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: 16
-
-      - name: Determine Cache Directory
-        id: npm-cache
-        run: |
-          echo "::set-output name=dir::$(npm config get cache)"
-
-      - name: Configure Job Cache
-        uses: actions/cache@v1
-        with:
-          path: ${{ steps.npm-cache.outputs.dir }}
-          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
-          restore-keys: |
-            ${{ runner.os }}-node-
+          node-version: '16'
 
       - name: Install Dependencies
         run: npm ci
@@ -192,7 +130,7 @@ jobs:
 
       - name: Store Rendering Test Artifacts
         if: ${{ always() }}
-        uses: actions/upload-artifact@v2
+        uses: actions/upload-artifact@v3
         with:
           name: rendering-tests
           path: test/rendering/cases/**/actual.png

DEVELOPING.md

@@ -2,7 +2,7 @@
 
 ## Setting up development environment
 
-You will obviously start by
+You will start by
 [forking](https://github.com/openlayers/openlayers/fork) the OpenLayers repository.
 
 ### Development dependencies
@@ -26,6 +26,28 @@ To run the examples you first need to start the dev server:
 
 Then, load <http://localhost:8080/> in your browser.
 
+## Linking Package
+
+The `ol` package is published from the `build/ol` folder of the `openlayers` repo. 
+
+After you've cloned the `openlayers` repo locally run the `npm build-package` to prepare the build then use the `npm link` command to connect it your project. 
+
+Below is an example of how to build and link it to "sample-project"
+
+
+    $ cd openlayers
+    $ npm run build-package
+    $ cd build/ol
+    $ npm link
+    $ cd /sample-project
+    $ npm link ol
+
+To remove the link run the following commands
+
+    $ cd sample-project
+    $ npm unlink --no-save ol
+    $ cd ../openlayers
+    $ npm unlink
 ## Running tests
 
 To run the tests once:

README.md

@@ -23,7 +23,7 @@ new Map({
   layers: [
     new TileLayer({
       source: new XYZ({
-        url: 'https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png'
+        url: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png'
       })
     })
   ],
@@ -36,10 +36,12 @@ new Map({
 
 See the following examples for more detail on bundling OpenLayers with your application:
 
+ * Using [Vite](https://github.com/openlayers/ol-vite)
  * Using [Rollup](https://github.com/openlayers/ol-rollup)
- * Using [Webpack](https://github.com/openlayers/ol-webpack)
+ * Using [webpack](https://github.com/openlayers/ol-webpack)
  * Using [Parcel](https://github.com/openlayers/ol-parcel)
- * Using [Browserify](https://github.com/openlayers/ol-browserify)
+
+For more detail on quick prototyping without the use of a Node.js based setup, see the [Skypack](https://github.com/openlayers/ol-skypack) example.
 
 ## Sponsors
 
@@ -80,29 +82,13 @@ OpenLayers appreciates contributions of all kinds.  We especially want to thank
 
 See our [GitHub sponsors page](https://github.com/sponsors/openlayers) or [Open Collective](https://opencollective.com/openlayers/contribute/sponsors-214/checkout) if you too are interested in becoming a regular sponsor.
 
-## ES Modules
-
-The `ol` package contains a `src/` folder with the sources, authored as [ES Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules). To use these untranspiled sources, either import modules from `ol/src` instead of `ol`, or configure your bundler with an alias pointing to `ol/src` for the `ol` package.
-
 ## TypeScript support
 
 The [ol package](https://npmjs.com/package/ol) includes auto-generated TypeScript declarations as `*.d.ts` files.
 
 ## Supported Browsers
 
-OpenLayers runs on all modern browsers that support [HTML5](https://html.spec.whatwg.org/multipage/) and [ECMAScript 5](https://262.ecma-international.org/5.1/). This includes Chrome, Firefox, Safari and Edge.
-
-For older browsers and platforms (Internet Explorer, Android 4.x, iOS v12 and older, Safari v12 and older), polyfills may be needed for the following browser features:
-
-* [`fetch`](https://caniuse.com/fetch): Available from [polyfill.io](https://polyfill.io/).
-* [`requestAnimationFrame`](https://caniuse.com/requestanimationframe): Available from [polyfill.io](https://polyfill.io/).
-* [`element.prototype.classList` (`add`/`remove`)](https://caniuse.com/classlist): Available from [polyfill.io](https://polyfill.io/).
-* [`URL` API](https://caniuse.com/url): Available from [polyfill.io](https://polyfill.io/).
-* [`TextDecoder`](https://caniuse.com/textencoder): Available from [polyfill.io](https://polyfill.io/).
-* [`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.
+OpenLayers runs on all modern browsers (with greater than 1% global usage).  This includes Chrome, Firefox, Safari and Edge. For older browsers, [polyfills](https://polyfill.io/) will likely need to be added.
 
 ## Documentation
 

changelog/upgrade-notes.md

@@ -1,5 +1,158 @@
 ## Upgrade notes
 
+### Next version
+
+#### Notice to full build users
+
+If you have been using the full (or legacy) build of the library, note that the location of these scripts is changing for this and future releases.  The previous locations were not stable, and although we do not recommend linking to the full build for production applications, there are many instances of this that were breaking due to changing URLs.  See the [download page](https://openlayers.org/download/) for details on the new versioned URLs for the full build.
+
+#### Deprecation of `ol/AssertionError` and error codes
+
+Future versions will no longer throw `ol/AssertionError` with an error `code`. Instead, they will throw `Error` with just the error message.
+
+#### Updating parameters in `ol/source/ImageWMS` and `ol/source/TileWMS`
+
+The `updateParams()` method will be the only way to update parameters. Changes made directly to the `params` object passed as a constructor option will have no effect.
+
+### 7.0.0
+
+#### Removal of deprecated properties and methods
+
+ * The `tilePixelRatio` has been removed from the `DataTile` source.
+ * The `imageSmoothing` option has been removed from sources.
+ * The `undefinedHTML` option has been removed from the `MousePosition` control.
+ * The `forEachLayerAtPixel` method has been removed from the `Map` class.
+ * Deprecated options have been removed from the `Overlay` component.
+ * The `labelCache` has been removed from the `ol/render/canvas.js` module.
+
+#### Internet Explorer is no longer supported
+
+Please see https://docs.microsoft.com/en-us/lifecycle/announcements/internet-explorer-11-end-of-support.
+
+#### ol/coordinate.js
+
+The `toStringHDMS` function from the `ol/coordinate.js` module now formats longitude, latitude pairs so that the minutes and seconds are omitted if they are zero.  This changes the values displayed on graticules.
+
+#### ol/layer/Graticule
+
+The default `intervals` now align with integer minutes and seconds better suited to the default label formatter.  If formatting in decimal degrees you may wish to specify custom `intervals` suited to that format.
+
+#### ol/Collection
+
+Inserting with `setAt` or `insertAt` beyond the current length used to create a sparse Collection with `undefined` inserted for any missing indexes.  This will now throw an error instead.
+
+#### ol/control/MousePosition
+
+The control will now by default keep displaying the last mouse position when the mouse leaves the viewport.  With `placeholder: ' '` you can keep the old behaviour.  The `placeholder` option no longer accepts `false` as a valid value, instead simply omit the option.  The `undefinedHTML` option has been removed. You should use `placeholder` instead.
+
+#### ol/PluggableMap
+
+The `PluggableMap` class has been removed.  If you want to create a custom map class, extend the `Map` class instead.
+
+#### ol/style/Icon and ol/style/RegularShape
+
+`ol/style/Image` and subclasses `displacement` is no longer scaled with the image.  If you previously expected this unintended behavior you should now increase the displacement when setting the scale.
+
+### 6.15.0
+
+#### Deprecated `tilePixelRatio` option for data tile sources.
+
+If you were previously trying to scale data tiles using the `tilePixelRatio` property for data tile sources (this is rare), you should now use the explicit `tileSize` and `tileGrid` properties.  The source's `tileSize` represents the source tile dimensions and the tile grid's `tileSize` represents the desired rendered dimensions.
+
+```js
+const source = new DataTileSource({
+  tileSize: [512, 512], // source tile size
+  tileGrid: createXYZ({tileSize: [256, 256]}), // rendered tile size
+});
+```
+
+#### Fixed coordinate dimension handling in `ol/proj`'s `addCoordinateTransforms`
+
+The `forward` and `inverse` functions passed to `addCooordinateTransforms` now receive a coordinate with all dimensions of the original coordinate, not just two. If you previosly had coordinates with more than two dimensions and added a transform like
+```js
+addCoordinateTransforms(
+    'EPSG:4326',
+    new Projection({code: 'latlong', units: 'degrees'}),
+    function(coordinate) { return coordinate.reverse(); },
+    function(coordinate) { return coordinate.reverse(); }
+);
+```
+you have to change that to
+```js
+addCoordinateTransforms(
+    'EPSG:4326',
+    new Projection({code: 'latlong', units: 'degrees'}),
+    function(coordinate) { return coordinate.slice(0, 2).reverse() },
+    function(coordinate) { return coordinate.slice(0, 2).reverse() }
+);
+```
+
+#### Replacement of string enums with union types
+
+This change only affects users that were using the non-API string enums
+
+* ol/OverlayPositioning
+* ol/extent/Corner
+* ol/format/FormatType
+* ol/geom/GeometryType
+* ol/source/State
+* ol/source/WMSServerType
+* ol/source/WMTSRequestEncoding
+
+Instead of these, use the respective `string`s, which are now typesafe by means of union types.
+
+### v6.14.0
+
+No special changes are required when upgrading to the 6.14.0 release.
+
+### v6.13.0
+
+#### New `layer.getData()` method
+
+Raster layers (static images, image tiles, data tiles) have a new `layer.getData(pixel)` method that returns the pixel data at the provided location.  The return value depends on the underlying source data type.  For example, a GeoTIFF may return a `Float32Array` with one value per band, while a PNG rendered from a tile layer will return a `Uint8ClampedArray` of RGBA values.
+
+If you were previously using the `map.forEachLayerAtPixel()` method, you should use the new `layer.getData()` method instead.  The old method returns composite pixel values from multiple layers and is limited to RGBA values.  The new method doesn't suffer from these shortcomings and is more performant.
+
+#### Deprecated `map.forEachLayerAtPixel()` method
+
+The `map.forEachLayerAtPixel()` method has been deprecated.  It will be removed (or its behavior may change) in the next major release.  Please use the `layer.getData()` method instead.
+
+### v6.12.0
+
+No special changes are required when upgrading to the 6.12.0 release.
+
+### v6.11.0
+
+No special changes are required when upgrading to the 6.11.0 release.
+
+### v6.10.0
+
+#### New `interpolate` option for sources
+
+Sources now have an `interpolate` option.  This option controls whether data from the source is interpolated when resampling.
+
+For `ol/source/DataTile` sources, the default is `interpolate: false`.  This means that when a data tile source is used with a WebGL tile layer renderer, your style expression will have access to pixel values in the data tiles without interpolation.  If this option is set to true, linear interpolation will be used when over- or under-sampling the data.
+
+#### Deprecation of the `imageSmoothing` option for sources
+
+The `imageSmoothing` option for sources has been deprecated and will be removed in the next major release.  Use the `interpolate` option instead.
+
+```js
+// if you were using `imageSmoothing`
+const before = new TileSource({
+  imageSmoothing: false
+});
+
+// use the `interpolate` option instead
+const after = new TileSource({
+  interpolate: false
+});
+```
+
+### v6.9.0
+
+There should be nothing special required when upgrading from v6.8 to v6.9.
+
 ### v6.8.0
 
 There should be nothing special required when upgrading from v6.7 to v6.8.

changelog/v6.10.0.md

@@ -0,0 +1,200 @@
+# 6.10.0
+
+Just in time for the new year, the 6.10 release brings another great batch of features and fixes for your OpenLayers applications.
+
+#### WebGL rendering
+
+You can now update the style for your WebGL tile layers with `layer.setStyle()`.  Keep in mind that it is more efficient to use style variables if you want to adjust styling on every render frame.  However, in cases where you want to completely reconfigure the style, you can use the new `layer.setStyle()` method.
+
+Additional WebGL tile layer rendering enhancements:
+ * A new `palette` operator was added that allows styling raster data based on a colormap.
+ * The `band` operator accepts expressions for the band number (in addition to numeric literals) – allowing for bands to be set by user provided style variables, for example.
+ * Tile layers now dispatch `prerender`, `postrender`, `precompose` and `postcompose` events with access to the WebGL rendering context.
+ * Layers that are adjacent to one another now share a single canvas element and rendering context – allowing for more layers in your maps before exhausting the browser's context limit.
+
+#### Vector tiles
+
+The Mapbox vector layer now works more easily with other vector tile providers.  In addition, vector tile layers can now be configured with a background color.
+
+#### New `interpolate` option for sources
+
+Sources now have an `interpolate` option.  This option controls whether data from the source is interpolated when resampling.
+
+For `ol/source/DataTile` sources, the default is `interpolate: false`.  This means that when a data tile source is used with a WebGL tile layer renderer, your style expression will have access to pixel values in the data tiles without interpolation.  If this option is set to true, linear interpolation will be used when over- or under-sampling the data.
+
+#### Deprecation of the `imageSmoothing` option for sources
+
+The `imageSmoothing` option for sources has been deprecated and will be removed in the next major release.  Use the `interpolate` option instead.
+
+```js
+// if you were using `imageSmoothing`
+const before = new TileSource({
+  imageSmoothing: false
+});
+
+// use the `interpolate` option instead
+const after = new TileSource({
+  interpolate: false
+});
+```
+
+#### List of all changes
+
+See below for more features and fixes.
+
+ * [#13155](https://github.com/openlayers/openlayers/pull/13155) - Allow interpolation to be configured for data tile sources ([@tschaub](https://github.com/tschaub))
+ * [#13165](https://github.com/openlayers/openlayers/pull/13165) - Do not exceed maximum call stack when parsing TopoJSON ([@ahocevar](https://github.com/ahocevar))
+ * [#13158](https://github.com/openlayers/openlayers/pull/13158) - Add example for dynamic clusters ([@ahocevar](https://github.com/ahocevar))
+ * [#13156](https://github.com/openlayers/openlayers/pull/13156) - Ensure that tile range covers all pixels ([@tschaub](https://github.com/tschaub))
+ * [#13154](https://github.com/openlayers/openlayers/pull/13154) - Update Export Map example to handle WebGL ([@mike-000](https://github.com/mike-000))
+ * [#13147](https://github.com/openlayers/openlayers/pull/13147) - Support rendering with a palette in WebGL ([@tschaub](https://github.com/tschaub))
+ * [#13142](https://github.com/openlayers/openlayers/pull/13142) - Include transpacific flights in Flight Animation example ([@mike-000](https://github.com/mike-000))
+ * [#13150](https://github.com/openlayers/openlayers/pull/13150) - Include layer opacity in Heatmap shader ([@mike-000](https://github.com/mike-000))
+ * [#13149](https://github.com/openlayers/openlayers/pull/13149) - Add layer also for programmatically selected features ([@ahocevar](https://github.com/ahocevar))
+ * [#13151](https://github.com/openlayers/openlayers/pull/13151) - Avoid error accessing attributes when context is lost ([@mike-000](https://github.com/mike-000))
+ * [#13144](https://github.com/openlayers/openlayers/pull/13144) - Replace deprecated syntax in example ([@mike-000](https://github.com/mike-000))
+ * [#13131](https://github.com/openlayers/openlayers/pull/13131) - Unset canvas css in stylesheet ([@ahocevar](https://github.com/ahocevar))
+ * [#13130](https://github.com/openlayers/openlayers/pull/13130) - Allow WebGL tile layers to be constructed without a source ([@tschaub](https://github.com/tschaub))
+ * [#13126](https://github.com/openlayers/openlayers/pull/13126) - Preserve the drawing buffer by default for WebGL layers ([@tschaub](https://github.com/tschaub))
+ * [#13127](https://github.com/openlayers/openlayers/pull/13127) - Fix for range slider on IE ([@mike-000](https://github.com/mike-000))
+ * [#13095](https://github.com/openlayers/openlayers/pull/13095) - Render is only complete when no tiles are queued ([@ahocevar](https://github.com/ahocevar))
+ * [#13120](https://github.com/openlayers/openlayers/pull/13120) - Populate view's object properties ([@ahocevar](https://github.com/ahocevar))
+ * [#13102](https://github.com/openlayers/openlayers/pull/13102) - update line-arrows example ([@jipexu](https://github.com/jipexu))
+ * [#13119](https://github.com/openlayers/openlayers/pull/13119) - Dispatch precompose and postcompose events for WebGL layers ([@tschaub](https://github.com/tschaub))
+ * [#13118](https://github.com/openlayers/openlayers/pull/13118) - Add a layer opacity example ([@tschaub](https://github.com/tschaub))
+ * [#13115](https://github.com/openlayers/openlayers/pull/13115) - Lazily create resources for worker ([@tschaub](https://github.com/tschaub))
+ * [#13103](https://github.com/openlayers/openlayers/pull/13103) - Assume limited precision when rounding ([@tschaub](https://github.com/tschaub))
+ * [#13097](https://github.com/openlayers/openlayers/pull/13097) - Use correct terrain-rgb tile size and update max zoom ([@mike-000](https://github.com/mike-000))
+ * [#13101](https://github.com/openlayers/openlayers/pull/13101) - Fix View set center to undefined ([@M393](https://github.com/M393))
+ * [#13085](https://github.com/openlayers/openlayers/pull/13085) - Add layer background ([@ahocevar](https://github.com/ahocevar))
+ * [#13083](https://github.com/openlayers/openlayers/pull/13083) - Support expressions for band arguments ([@tschaub](https://github.com/tschaub))
+ * [#13084](https://github.com/openlayers/openlayers/pull/13084) - Normalize relative sprite and glyph urls for style url ([@ahocevar](https://github.com/ahocevar))
+ * [#13020](https://github.com/openlayers/openlayers/pull/13020) - Allow WebGL tile layer style to be updated ([@tschaub](https://github.com/tschaub))
+ * [#13073](https://github.com/openlayers/openlayers/pull/13073) - Fall back to standard load handling when decode fails ([@ahocevar](https://github.com/ahocevar))
+ * [#13077](https://github.com/openlayers/openlayers/pull/13077) - update draw and modify features example ([@jipexu](https://github.com/jipexu))
+ * [#13069](https://github.com/openlayers/openlayers/pull/13069) - Normalize based on GDAL stats metadata ([@tschaub](https://github.com/tschaub))
+ * [#13070](https://github.com/openlayers/openlayers/pull/13070) - Use source minzoom if not configured otherwise ([@ahocevar](https://github.com/ahocevar))
+ * [#13065](https://github.com/openlayers/openlayers/pull/13065) - Fix typo in example ([@jipexu](https://github.com/jipexu))
+ * [#13060](https://github.com/openlayers/openlayers/pull/13060) - Avoid fetching data outside the grid extent ([@tschaub](https://github.com/tschaub))
+ * [#13054](https://github.com/openlayers/openlayers/pull/13054) - Updates for newer version of the OGC API spec draft ([@ahocevar](https://github.com/ahocevar))
+ * [#13045](https://github.com/openlayers/openlayers/pull/13045) - Fix tiles and background handling ([@ahocevar](https://github.com/ahocevar))
+ * [#13030](https://github.com/openlayers/openlayers/pull/13030) - Correctly set popover position in geographic example ([@MoonE](https://github.com/MoonE))
+ * [#13031](https://github.com/openlayers/openlayers/pull/13031) - Allow data tile source loader to return a value or a promise ([@tschaub](https://github.com/tschaub))
+ * [#13026](https://github.com/openlayers/openlayers/pull/13026) - Fix strokeStyle documentation ([@ahocevar](https://github.com/ahocevar))
+ * [#13027](https://github.com/openlayers/openlayers/pull/13027) - Restore the security scan workflow ([@openlayers](https://github.com/openlayers))
+ * [#13025](https://github.com/openlayers/openlayers/pull/13025) - Add background to MapboxVector layer ([@ahocevar](https://github.com/ahocevar))
+ * [#13013](https://github.com/openlayers/openlayers/pull/13013) - Use appropriate UNPACK_ALIGNMENT for data textures ([@mike-000](https://github.com/mike-000))
+ * [#13021](https://github.com/openlayers/openlayers/pull/13021) - Add the renderer type to generic layer template variables ([@tschaub](https://github.com/tschaub))
+ * [#13022](https://github.com/openlayers/openlayers/pull/13022) - Update the security scan task ([@tschaub](https://github.com/tschaub))
+ * [#13015](https://github.com/openlayers/openlayers/pull/13015) - Additional types for WebGL renderer, sources, and tiles ([@tschaub](https://github.com/tschaub))
+ * [#13012](https://github.com/openlayers/openlayers/pull/13012) - Remove unused dependencies ([@tschaub](https://github.com/tschaub))
+ * [#12976](https://github.com/openlayers/openlayers/pull/12976) - Handle ReprojTile in ol/layer/WebGLTile ([@mike-000](https://github.com/mike-000))
+ * [#13011](https://github.com/openlayers/openlayers/pull/13011) - Use registry URL when publishing ([@tschaub](https://github.com/tschaub))
+ * [#13009](https://github.com/openlayers/openlayers/pull/13009) - Use workflow_run event to deploy pull request previews ([@tschaub](https://github.com/tschaub))
+ * [#12965](https://github.com/openlayers/openlayers/pull/12965) - Allow canvas reuse for WebGL layers ([@tschaub](https://github.com/tschaub))
+ * [#12999](https://github.com/openlayers/openlayers/pull/12999) - Fix style related apidoc issues ([@MoonE](https://github.com/MoonE))
+ * [#12978](https://github.com/openlayers/openlayers/pull/12978) - Add null to style jsdoc of VectorImage ([@EvertEt](https://github.com/EvertEt))
+ * [#12997](https://github.com/openlayers/openlayers/pull/12997) - Lazily create the WebGL helper ([@tschaub](https://github.com/tschaub))
+ * [#12996](https://github.com/openlayers/openlayers/pull/12996) - Align labels with the Select elements in the Raster Reprojection example ([@mike-000](https://github.com/mike-000))
+ * [#12994](https://github.com/openlayers/openlayers/pull/12994) - Add a map property to layers ([@tschaub](https://github.com/tschaub))
+ * [#12987](https://github.com/openlayers/openlayers/pull/12987) - Browser test config update ([@tschaub](https://github.com/tschaub))
+ * [#12939](https://github.com/openlayers/openlayers/pull/12939) - Example that demonstrates a color expression using variables ([@tschaub](https://github.com/tschaub))
+ * [#12962](https://github.com/openlayers/openlayers/pull/12962) - No context sharing when layer opacity is set ([@ahocevar](https://github.com/ahocevar))
+ * [#12964](https://github.com/openlayers/openlayers/pull/12964) - Updated Bing Maps key ([@tschaub](https://github.com/tschaub))
+ * [#12958](https://github.com/openlayers/openlayers/pull/12958) - Reuse temporary canvas in getDataAtPixel() ([@mike-000](https://github.com/mike-000))
+ * [#12893](https://github.com/openlayers/openlayers/pull/12893) - Allow map target to be an external window ([@andrewcoder002](https://github.com/andrewcoder002))
+ * [#12955](https://github.com/openlayers/openlayers/pull/12955) - Make MapboxVector layer work in more access key scenarios ([@ahocevar](https://github.com/ahocevar))
+ * [#12935](https://github.com/openlayers/openlayers/pull/12935) - fix bug #12913 ([@mrpan](https://github.com/mrpan))
+ * [#12933](https://github.com/openlayers/openlayers/pull/12933) - Include WebGL context in render events for WebGL layers ([@tschaub](https://github.com/tschaub))
+ * [#12917](https://github.com/openlayers/openlayers/pull/12917) - Make removeFeature consistent with other remove methods ([@mike-000](https://github.com/mike-000))
+ * [#12918](https://github.com/openlayers/openlayers/pull/12918) - Add setDisplacement method to ol/style/Image and subclasses ([@mike-000](https://github.com/mike-000))
+ * [#12930](https://github.com/openlayers/openlayers/pull/12930) - Fix flaky view animation test ([@MoonE](https://github.com/MoonE))
+ * [#12915](https://github.com/openlayers/openlayers/pull/12915) - Test the new pull request deploy previews ([@tschaub](https://github.com/tschaub))
+ * [#12916](https://github.com/openlayers/openlayers/pull/12916) - Updates to deploy-preview job ([@openlayers](https://github.com/openlayers))
+ * [#12914](https://github.com/openlayers/openlayers/pull/12914) - Build site preview as a GitHub action ([@tschaub](https://github.com/tschaub))
+ * [#12891](https://github.com/openlayers/openlayers/pull/12891) - Restore browser compatibility where possible ([@mike-000](https://github.com/mike-000))
+ * [#12899](https://github.com/openlayers/openlayers/pull/12899) - Update docs to mention Vite ([@tschaub](https://github.com/tschaub))
+ * [#12890](https://github.com/openlayers/openlayers/pull/12890) - Release 6.9.0 ([@openlayers](https://github.com/openlayers))
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * [#13162](https://github.com/openlayers/openlayers/pull/13162) - Bump yargs from 17.3.0 to 17.3.1 ([@openlayers](https://github.com/openlayers))
+ * [#13163](https://github.com/openlayers/openlayers/pull/13163) - Bump rollup from 2.61.1 to 2.62.0 ([@openlayers](https://github.com/openlayers))
+ * [#13161](https://github.com/openlayers/openlayers/pull/13161) - Bump webpack-dev-server from 4.6.0 to 4.7.1 ([@openlayers](https://github.com/openlayers))
+ * [#13160](https://github.com/openlayers/openlayers/pull/13160) - Bump puppeteer from 13.0.0 to 13.0.1 ([@openlayers](https://github.com/openlayers))
+ * [#13140](https://github.com/openlayers/openlayers/pull/13140) - Bump @rollup/plugin-node-resolve from 13.0.6 to 13.1.1 ([@openlayers](https://github.com/openlayers))
+ * [#13132](https://github.com/openlayers/openlayers/pull/13132) - Bump copy-webpack-plugin from 10.1.0 to 10.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#13141](https://github.com/openlayers/openlayers/pull/13141) - Bump webpack-dev-middleware from 5.2.2 to 5.3.0 ([@openlayers](https://github.com/openlayers))
+ * [#13133](https://github.com/openlayers/openlayers/pull/13133) - Bump eslint from 8.4.1 to 8.5.0 ([@openlayers](https://github.com/openlayers))
+ * [#13139](https://github.com/openlayers/openlayers/pull/13139) - Bump @babel/core from 7.16.0 to 7.16.5 ([@openlayers](https://github.com/openlayers))
+ * [#13136](https://github.com/openlayers/openlayers/pull/13136) - Bump @babel/preset-env from 7.16.4 to 7.16.5 ([@openlayers](https://github.com/openlayers))
+ * [#13137](https://github.com/openlayers/openlayers/pull/13137) - Bump express from 4.17.1 to 4.17.2 ([@openlayers](https://github.com/openlayers))
+ * [#13138](https://github.com/openlayers/openlayers/pull/13138) - Bump ol-mapbox-style from 6.7.0 to 6.8.1 ([@openlayers](https://github.com/openlayers))
+ * [#13134](https://github.com/openlayers/openlayers/pull/13134) - Bump marked from 4.0.7 to 4.0.8 ([@openlayers](https://github.com/openlayers))
+ * [#13106](https://github.com/openlayers/openlayers/pull/13106) - Bump webpack from 5.64.4 to 5.65.0 ([@openlayers](https://github.com/openlayers))
+ * [#13108](https://github.com/openlayers/openlayers/pull/13108) - Bump rollup from 2.60.2 to 2.61.1 ([@openlayers](https://github.com/openlayers))
+ * [#13107](https://github.com/openlayers/openlayers/pull/13107) - Bump copy-webpack-plugin from 10.0.0 to 10.1.0 ([@openlayers](https://github.com/openlayers))
+ * [#13105](https://github.com/openlayers/openlayers/pull/13105) - Bump eslint from 8.4.0 to 8.4.1 ([@openlayers](https://github.com/openlayers))
+ * [#13109](https://github.com/openlayers/openlayers/pull/13109) - Bump marked from 4.0.6 to 4.0.7 ([@openlayers](https://github.com/openlayers))
+ * [#13110](https://github.com/openlayers/openlayers/pull/13110) - Bump puppeteer from 12.0.1 to 13.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#13111](https://github.com/openlayers/openlayers/pull/13111) - Bump clean-css-cli from 5.4.2 to 5.5.0 ([@openlayers](https://github.com/openlayers))
+ * [#13091](https://github.com/openlayers/openlayers/pull/13091) - Bump rollup from 2.60.1 to 2.60.2 ([@openlayers](https://github.com/openlayers))
+ * [#13089](https://github.com/openlayers/openlayers/pull/13089) - Bump eslint from 8.3.0 to 8.4.0 ([@openlayers](https://github.com/openlayers))
+ * [#13090](https://github.com/openlayers/openlayers/pull/13090) - Bump marked from 4.0.5 to 4.0.6 ([@openlayers](https://github.com/openlayers))
+ * [#13093](https://github.com/openlayers/openlayers/pull/13093) - Bump yargs from 17.2.1 to 17.3.0 ([@openlayers](https://github.com/openlayers))
+ * [#13092](https://github.com/openlayers/openlayers/pull/13092) - Bump puppeteer from 12.0.0 to 12.0.1 ([@openlayers](https://github.com/openlayers))
+ * [#13088](https://github.com/openlayers/openlayers/pull/13088) - Bump geotiff from 1.0.8 to 1.0.9 ([@openlayers](https://github.com/openlayers))
+ * [#13057](https://github.com/openlayers/openlayers/pull/13057) - Bump puppeteer from 11.0.0 to 12.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#13055](https://github.com/openlayers/openlayers/pull/13055) - Bump webpack from 5.64.2 to 5.64.4 ([@openlayers](https://github.com/openlayers))
+ * [#13056](https://github.com/openlayers/openlayers/pull/13056) - Bump webpack-dev-server from 4.5.0 to 4.6.0 ([@openlayers](https://github.com/openlayers))
+ * [#13058](https://github.com/openlayers/openlayers/pull/13058) - Bump marked from 4.0.4 to 4.0.5 ([@openlayers](https://github.com/openlayers))
+ * [#13032](https://github.com/openlayers/openlayers/pull/13032) - Bump webpack from 5.64.0 to 5.64.2 ([@openlayers](https://github.com/openlayers))
+ * [#13033](https://github.com/openlayers/openlayers/pull/13033) - Bump webpack-sources from 3.2.1 to 3.2.2 ([@openlayers](https://github.com/openlayers))
+ * [#13034](https://github.com/openlayers/openlayers/pull/13034) - Bump rollup from 2.60.0 to 2.60.1 ([@openlayers](https://github.com/openlayers))
+ * [#13035](https://github.com/openlayers/openlayers/pull/13035) - Bump copy-webpack-plugin from 9.1.0 to 10.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#13036](https://github.com/openlayers/openlayers/pull/13036) - Bump webpack-dev-middleware from 5.2.1 to 5.2.2 ([@openlayers](https://github.com/openlayers))
+ * [#13037](https://github.com/openlayers/openlayers/pull/13037) - Bump @babel/preset-env from 7.16.0 to 7.16.4 ([@openlayers](https://github.com/openlayers))
+ * [#13038](https://github.com/openlayers/openlayers/pull/13038) - Bump marked from 4.0.3 to 4.0.4 ([@openlayers](https://github.com/openlayers))
+ * [#13039](https://github.com/openlayers/openlayers/pull/13039) - Bump eslint from 8.2.0 to 8.3.0 ([@openlayers](https://github.com/openlayers))
+ * [#13040](https://github.com/openlayers/openlayers/pull/13040) - Bump ol-mapbox-style from 6.5.2 to 6.5.3 ([@openlayers](https://github.com/openlayers))
+ * [#13041](https://github.com/openlayers/openlayers/pull/13041) - Bump karma from 6.3.8 to 6.3.9 ([@openlayers](https://github.com/openlayers))
+ * [#13001](https://github.com/openlayers/openlayers/pull/13001) - Bump webpack from 5.62.1 to 5.64.0 ([@openlayers](https://github.com/openlayers))
+ * [#13002](https://github.com/openlayers/openlayers/pull/13002) - Bump terser-webpack-plugin from 5.2.4 to 5.2.5 ([@openlayers](https://github.com/openlayers))
+ * [#13003](https://github.com/openlayers/openlayers/pull/13003) - Bump copy-webpack-plugin from 9.0.1 to 9.1.0 ([@openlayers](https://github.com/openlayers))
+ * [#13004](https://github.com/openlayers/openlayers/pull/13004) - Bump rollup from 2.59.0 to 2.60.0 ([@openlayers](https://github.com/openlayers))
+ * [#13005](https://github.com/openlayers/openlayers/pull/13005) - Bump webpack-dev-server from 4.4.0 to 4.5.0 ([@openlayers](https://github.com/openlayers))
+ * [#13006](https://github.com/openlayers/openlayers/pull/13006) - Bump ol-mapbox-style from 6.5.1 to 6.5.2 ([@openlayers](https://github.com/openlayers))
+ * [#13007](https://github.com/openlayers/openlayers/pull/13007) - Bump marked from 4.0.0 to 4.0.3 ([@openlayers](https://github.com/openlayers))
+ * [#13008](https://github.com/openlayers/openlayers/pull/13008) - Bump glob from 7.1.7 to 7.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#12968](https://github.com/openlayers/openlayers/pull/12968) - Bump sinon from 11.1.2 to 12.0.1 ([@openlayers](https://github.com/openlayers))
+ * [#12969](https://github.com/openlayers/openlayers/pull/12969) - Bump marked from 3.0.8 to 4.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#12973](https://github.com/openlayers/openlayers/pull/12973) - Bump eslint from 8.1.0 to 8.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#12972](https://github.com/openlayers/openlayers/pull/12972) - Bump karma-firefox-launcher from 2.1.1 to 2.1.2 ([@openlayers](https://github.com/openlayers))
+ * [#12971](https://github.com/openlayers/openlayers/pull/12971) - Bump puppeteer from 10.4.0 to 11.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#12970](https://github.com/openlayers/openlayers/pull/12970) - Bump karma from 6.3.6 to 6.3.8 ([@openlayers](https://github.com/openlayers))
+ * [#12967](https://github.com/openlayers/openlayers/pull/12967) - Bump webpack from 5.61.0 to 5.62.1 ([@openlayers](https://github.com/openlayers))
+ * [#12948](https://github.com/openlayers/openlayers/pull/12948) - Bump webpack from 5.59.1 to 5.61.0 ([@openlayers](https://github.com/openlayers))
+ * [#12945](https://github.com/openlayers/openlayers/pull/12945) - Bump rollup from 2.58.3 to 2.59.0 ([@openlayers](https://github.com/openlayers))
+ * [#12946](https://github.com/openlayers/openlayers/pull/12946) - Bump @babel/preset-env from 7.15.8 to 7.16.0 ([@openlayers](https://github.com/openlayers))
+ * [#12947](https://github.com/openlayers/openlayers/pull/12947) - Bump @babel/core from 7.15.8 to 7.16.0 ([@openlayers](https://github.com/openlayers))
+ * [#12949](https://github.com/openlayers/openlayers/pull/12949) - Bump karma from 6.3.5 to 6.3.6 ([@openlayers](https://github.com/openlayers))
+ * [#12944](https://github.com/openlayers/openlayers/pull/12944) - Bump webpack-dev-server from 4.3.1 to 4.4.0 ([@openlayers](https://github.com/openlayers))
+ * [#12923](https://github.com/openlayers/openlayers/pull/12923) - Bump @rollup/plugin-commonjs from 21.0.0 to 21.0.1 ([@openlayers](https://github.com/openlayers))
+ * [#12922](https://github.com/openlayers/openlayers/pull/12922) - Bump webpack-cli from 4.9.0 to 4.9.1 ([@openlayers](https://github.com/openlayers))
+ * [#12929](https://github.com/openlayers/openlayers/pull/12929) - Bump rollup from 2.58.0 to 2.58.3 ([@openlayers](https://github.com/openlayers))
+ * [#12920](https://github.com/openlayers/openlayers/pull/12920) - Bump marked from 3.0.7 to 3.0.8 ([@openlayers](https://github.com/openlayers))
+ * [#12924](https://github.com/openlayers/openlayers/pull/12924) - Bump clean-css-cli from 5.4.1 to 5.4.2 ([@openlayers](https://github.com/openlayers))
+ * [#12926](https://github.com/openlayers/openlayers/pull/12926) - Bump @rollup/plugin-node-resolve from 13.0.5 to 13.0.6 ([@openlayers](https://github.com/openlayers))
+ * [#12928](https://github.com/openlayers/openlayers/pull/12928) - Bump babel-loader from 8.2.2 to 8.2.3 ([@openlayers](https://github.com/openlayers))
+ * [#12921](https://github.com/openlayers/openlayers/pull/12921) - Bump webpack from 5.58.2 to 5.59.1 ([@openlayers](https://github.com/openlayers))
+ * [#12927](https://github.com/openlayers/openlayers/pull/12927) - Bump eslint from 8.0.1 to 8.1.0 ([@openlayers](https://github.com/openlayers))
+ * [#12919](https://github.com/openlayers/openlayers/pull/12919) - Bump karma from 6.3.4 to 6.3.5 ([@openlayers](https://github.com/openlayers))
+ * [#12902](https://github.com/openlayers/openlayers/pull/12902) - Bump eslint from 7.32.0 to 8.0.1 ([@openlayers](https://github.com/openlayers))
+ * [#12904](https://github.com/openlayers/openlayers/pull/12904) - Bump mocha from 9.1.2 to 9.1.3 ([@openlayers](https://github.com/openlayers))
+ * [#12905](https://github.com/openlayers/openlayers/pull/12905) - Bump glob from 7.1.7 to 7.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#12903](https://github.com/openlayers/openlayers/pull/12903) - Bump webpack from 5.58.1 to 5.58.2 ([@openlayers](https://github.com/openlayers))
+
+
+</details>

changelog/v6.11.0.md

@@ -0,0 +1,32 @@
+# 6.11.0
+
+This release follows up on the 6.10 release with a fix for Mapbox vector layers rendered over other layers.  A handful of other fixes and features are included.  See below for more detail.
+
+ * [#13195](https://github.com/openlayers/openlayers/pull/13195) - Use getFeaturesInExtent ([@ahocevar](https://github.com/ahocevar))
+ * [#13200](https://github.com/openlayers/openlayers/pull/13200) - Use interpolate option in Sea Level example ([@mike-000](https://github.com/mike-000))
+ * [#13201](https://github.com/openlayers/openlayers/pull/13201) - Fix typo in example description ([@mike-000](https://github.com/mike-000))
+ * [#13177](https://github.com/openlayers/openlayers/pull/13177) - Use ecoregions data ([@tschaub](https://github.com/tschaub))
+ * [#13198](https://github.com/openlayers/openlayers/pull/13198) - Avoid failure if existing target has no background color ([@tschaub](https://github.com/tschaub))
+ * [#13186](https://github.com/openlayers/openlayers/pull/13186) - Add getDataAtPixel() method for WebGL ([@mike-000](https://github.com/mike-000))
+ * [#13196](https://github.com/openlayers/openlayers/pull/13196) - typo fix for cog-stretch example ([@bradh](https://github.com/bradh))
+ * [#13190](https://github.com/openlayers/openlayers/pull/13190) - Fix base vector layer template generics ([@ahocevar](https://github.com/ahocevar))
+ * [#13180](https://github.com/openlayers/openlayers/pull/13180) - Always use ES modules from geotiff.js ([@ahocevar](https://github.com/ahocevar))
+ * [#13179](https://github.com/openlayers/openlayers/pull/13179) - Use Buffer and data uri when Blob is not available ([@ahocevar](https://github.com/ahocevar))
+ * [#13178](https://github.com/openlayers/openlayers/pull/13178) - Use background property for vector layers ([@tschaub](https://github.com/tschaub))
+ * [#13175](https://github.com/openlayers/openlayers/pull/13175) - Allow nodejs 12 to build the examples again ([@MoonE](https://github.com/MoonE))
+ * [#13176](https://github.com/openlayers/openlayers/pull/13176) - Add `attributions` and `attributionsCollapsible` options to `ol/source/DataTile` ([@mike-000](https://github.com/mike-000))
+ * [#13171](https://github.com/openlayers/openlayers/pull/13171) - Correct scale bar in EPSG:4326 ([@mike-000](https://github.com/mike-000))
+ * [#13168](https://github.com/openlayers/openlayers/pull/13168) - Release 6.10.0 ([@openlayers](https://github.com/openlayers))
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * [#13182](https://github.com/openlayers/openlayers/pull/13182) - Bump eslint from 8.5.0 to 8.6.0 ([@openlayers](https://github.com/openlayers))
+ * [#13184](https://github.com/openlayers/openlayers/pull/13184) - Bump @rollup/plugin-node-resolve from 13.1.1 to 13.1.2 ([@openlayers](https://github.com/openlayers))
+ * [#13183](https://github.com/openlayers/openlayers/pull/13183) - Bump @babel/core from 7.16.5 to 7.16.7 ([@openlayers](https://github.com/openlayers))
+ * [#13185](https://github.com/openlayers/openlayers/pull/13185) - Bump webpack-dev-server from 4.7.1 to 4.7.2 ([@openlayers](https://github.com/openlayers))
+ * [#13181](https://github.com/openlayers/openlayers/pull/13181) - Bump @babel/preset-env from 7.16.5 to 7.16.7 ([@openlayers](https://github.com/openlayers))
+
+
+</details>

changelog/v6.12.0.md

@@ -0,0 +1,30 @@
+# 6.12.0
+
+The 6.12 release brings a few small fixes and enhancements.  See below for a complete list.
+
+ * Transitive dependency update (by @openlayers in https://github.com/openlayers/openlayers/pull/13240)
+ * Re-enable image smoothing after rendering (by @mike-000 in https://github.com/openlayers/openlayers/pull/13236)
+ * Describe use of className with declutter (by @mike-000 in https://github.com/openlayers/openlayers/pull/13237)
+ * added run to npm command (by @lklepner in https://github.com/openlayers/openlayers/pull/13231)
+ * Document how to link package during development (by @lklepner in https://github.com/openlayers/openlayers/pull/13228)
+ * Default CORS mode for WebGL rendered sources (by @tschaub in https://github.com/openlayers/openlayers/pull/13227)
+ * Support the wrapX option for WebGL rendered tile sources (by @tschaub in https://github.com/openlayers/openlayers/pull/13226)
+ * Update ol-mapbox-style (by @tschaub in https://github.com/openlayers/openlayers/pull/13224)
+ * Do not fire modifyend event when nothing was modified (by @ahocevar in https://github.com/openlayers/openlayers/pull/13219)
+ * Draw VectorTiles with interpolate in hybrid mode again (by @M393 in https://github.com/openlayers/openlayers/pull/13221)
+ * Fix some typos in ModifyInteraction documentation (by @EvertEt in https://github.com/openlayers/openlayers/pull/13216)
+ * Fix MVT incorrect feature data handling (by @EvertEt in https://github.com/openlayers/openlayers/pull/13217)
+ * Format the changelog so contributors can be highlighted (by @tschaub in https://github.com/openlayers/openlayers/pull/13205)
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * Bump karma from 6.3.9 to 6.3.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13209)
+ * Bump shx from 0.3.3 to 0.3.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13211)
+ * Bump @rollup/plugin-node-resolve from 13.1.2 to 13.1.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13210)
+ * Bump rollup from 2.62.0 to 2.63.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13208)
+ * Bump marked from 4.0.8 to 4.0.9 (by @openlayers in https://github.com/openlayers/openlayers/pull/13207)
+
+
+</details>

changelog/v6.13.0.md

@@ -0,0 +1,139 @@
+# 6.13.0
+
+## Overview
+
+The 6.13 release brings several exciting new features and improvements:
+* A new `layer.getData()` method to get pixel data for a single layer (see details below).
+* Support for rich text labels in `ol/style/Text`, to use different font styles and fonts in a single label.
+* The `useGeograpic()` and `setUserProjection()` functions in the `ol/proj` module are now part of the official API. These functions make it easier to work with geographic coordinates or local projections.
+* Improvements for WebGL Tile and Points layers.
+* Performance improvements on `ol/Feature`, to avoid event creation when there are no listeners.
+* Update of geotiff.js to v2, to fix some build issues that users reported.
+* Improvements to the auto-generated TypeScript types.
+
+## Details
+
+### New `layer.getData()` method
+
+Raster layers (static images, image tiles, data tiles) have a new `layer.getData(pixel)` method that returns the pixel data at the provided location.  The return value depends on the underlying source data type.  For example, a GeoTIFF may return a `Float32Array` with one value per band, while a PNG rendered from a tile layer will return a `Uint8ClampedArray` of RGBA values.
+
+If you were previously using the `map.forEachLayerAtPixel()` method, you should use the new `layer.getData()` method instead.  The old method returns composite pixel values from multiple layers and is limited to RGBA values.  The new method doesn't suffer from these shortcomings and is more performant.
+
+### Deprecated `map.forEachLayerAtPixel()` method
+
+The `map.forEachLayerAtPixel()` method has been deprecated.  It will be removed (or its behavior may change) in the next major release.  Please use the `layer.getData()` method instead.
+
+## List of all changes
+
+See below for a complete list of features and fixes.
+
+ * Update ol-mapbox-style for rich text labels support (by @ahocevar in https://github.com/openlayers/openlayers/pull/13418)
+ * Increase GeoTIFF resolutions tolerance (by @ahocevar in https://github.com/openlayers/openlayers/pull/13417)
+ * Check for graticule resolution change and fix unrotated size (by @mike-000 in https://github.com/openlayers/openlayers/pull/13415)
+ * Rich text labels (by @ahocevar in https://github.com/openlayers/openlayers/pull/13410)
+ * Clear image when source's image is not ready (by @yonda-yonda in https://github.com/openlayers/openlayers/pull/13398)
+ * Fix setting View resolution or center to undefined (by @MoonE in https://github.com/openlayers/openlayers/pull/13393)
+ * Fix clone of icon loses imgSize when cache is full (by @MoonE in https://github.com/openlayers/openlayers/pull/13390)
+ * Use same clipping method for vector and image tiles (by @ahocevar in https://github.com/openlayers/openlayers/pull/13392)
+ * Less clipping of target resolution tiles (by @ahocevar in https://github.com/openlayers/openlayers/pull/13391)
+ * Change remaining links to point to class page instead of module (by @MoonE in https://github.com/openlayers/openlayers/pull/13385)
+ * User projection API (by @ahocevar in https://github.com/openlayers/openlayers/pull/13383)
+ * Fix wrong types when using `"skipLibCheck": false` (by @seravifer in https://github.com/openlayers/openlayers/pull/13382)
+ * Fix JsDoc references (by @MoonE in https://github.com/openlayers/openlayers/pull/13374)
+ * Fix VectorSource isEmpty without spatial index (by @MoonE in https://github.com/openlayers/openlayers/pull/13373)
+ * Document difference between Vector and VectorImage layers (by @ahocevar in https://github.com/openlayers/openlayers/pull/13371)
+ * Fix `ol/source/Cluster#setSource` type annotation (by @MoonE in https://github.com/openlayers/openlayers/pull/12998)
+ * Preload tiles for WebGL tile layers (by @tschaub in https://github.com/openlayers/openlayers/pull/13357)
+ * Avoid event creation when there are no listeners (by @MoonE in https://github.com/openlayers/openlayers/pull/13358)
+ * Add floor, round and ceil to style expressions (by @mike-000 in https://github.com/openlayers/openlayers/pull/13363)
+ * Support WebGL layers in ol/source/Raster (by @mike-000 in https://github.com/openlayers/openlayers/pull/13361)
+ * Improve some null types to prepare for strictNullChecks (by @EvertEt in https://github.com/openlayers/openlayers/pull/13301)
+ * Reset globalAlpha back to its initial after mutating it for drawing layers (by @Amirh0sseinHZ in https://github.com/openlayers/openlayers/pull/13351)
+ * Removing an unnecessary word from DEVELOPING.md (by @Amirh0sseinHZ in https://github.com/openlayers/openlayers/pull/13352)
+ * Get pixel data (by @tschaub in https://github.com/openlayers/openlayers/pull/13338)
+ * Remove warning for `@type` annotation by jsdoc (by @MoonE in https://github.com/openlayers/openlayers/pull/13350)
+ * Improve some null types for strictNullChecks (by @EvertEt in https://github.com/openlayers/openlayers/pull/13334)
+ * Dispose of webgl contexts (by @MoonE in https://github.com/openlayers/openlayers/pull/13336)
+ * Fix error when accessing ready property of renderer (by @MoonE in https://github.com/openlayers/openlayers/pull/13337)
+ * Pass tilePixelRatio and gutter to TileTexture (by @mike-000 in https://github.com/openlayers/openlayers/pull/13269)
+ * Improve some nullable map types (by @EvertEt in https://github.com/openlayers/openlayers/pull/13328)
+ * Avoid rendering outside WebGL layer and source extent (by @tschaub in https://github.com/openlayers/openlayers/pull/13333)
+ * Avoid duplicate imports (by @tschaub in https://github.com/openlayers/openlayers/pull/13332)
+ * Add updateStyleVariables method to WebGLPoints layer (by @ahocevar in https://github.com/openlayers/openlayers/pull/13294)
+ * Fix rendercomplete for WebGLPoints layer and subclasses (by @ahocevar in https://github.com/openlayers/openlayers/pull/13323)
+ * fix: fix casing for z-index (by @OSHistory in https://github.com/openlayers/openlayers/pull/13319)
+ * Fix typo CSS class name for the expanded attributions button (by @fredj in https://github.com/openlayers/openlayers/pull/13315)
+ * Improve types for tile layers (by @ahocevar in https://github.com/openlayers/openlayers/pull/13299)
+ * Document geometry type (by @ahocevar in https://github.com/openlayers/openlayers/pull/13298)
+ * Add function to convert RenderFeature to Feature (by @MoonE in https://github.com/openlayers/openlayers/pull/13297)
+ * Update to geotiff@2 (by @ahocevar in https://github.com/openlayers/openlayers/pull/13292)
+ * Re-assign style variables on setStyle() (by @ahocevar in https://github.com/openlayers/openlayers/pull/13293)
+ * add @api comment on getAllLayers method (by @XiaofengZeng in https://github.com/openlayers/openlayers/pull/13261)
+ * Allowing to pass additional options to the geotiff.js source (by @constantinius in https://github.com/openlayers/openlayers/pull/13290)
+ * Defaults for generic types (by @ahocevar in https://github.com/openlayers/openlayers/pull/13291)
+ * Load api navigation dynamically to reduce needed disk space (by @MoonE in https://github.com/openlayers/openlayers/pull/13229)
+ * Remove unneeded `src=""` (by @mike-000 in https://github.com/openlayers/openlayers/pull/13271)
+ * Support multiple sources for WebGL tile layers (by @ahocevar in https://github.com/openlayers/openlayers/pull/13212)
+ * Add crossOrigin option to LiteralSymbolStyle (by @mike-000 in https://github.com/openlayers/openlayers/pull/13259)
+ * Avoid the redirect from unpkg.com (by @tschaub in https://github.com/openlayers/openlayers/pull/13242)
+ * Updates for the 6.12.0 release (by @openlayers in https://github.com/openlayers/openlayers/pull/13241)
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * Bump express from 4.17.2 to 4.17.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13402)
+ * Bump puppeteer from 13.3.1 to 13.3.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13401)
+ * Bump mocha from 9.2.0 to 9.2.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13403)
+ * Bump webpack from 5.68.0 to 5.69.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13404)
+ * Bump ol-mapbox-style from 6.8.3 to 6.9.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13406)
+ * Bump rollup from 2.67.1 to 2.67.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13405)
+ * Bump @babel/core from 7.17.2 to 7.17.5 (by @openlayers in https://github.com/openlayers/openlayers/pull/13407)
+ * Bump @babel/core from 7.17.0 to 7.17.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13381)
+ * Bump karma from 6.3.15 to 6.3.16 (by @openlayers in https://github.com/openlayers/openlayers/pull/13379)
+ * Bump eslint from 8.8.0 to 8.9.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13377)
+ * Bump puppeteer from 13.1.3 to 13.3.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13376)
+ * Bump follow-redirects from 1.14.7 to 1.14.8 (by @openlayers in https://github.com/openlayers/openlayers/pull/13372)
+ * Bump geotiff from 2.0.3 to 2.0.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13339)
+ * Bump globby from 13.1.0 to 13.1.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13340)
+ * Bump rollup from 2.66.1 to 2.67.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13342)
+ * Bump @babel/core from 7.16.12 to 7.17.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13343)
+ * Bump karma from 6.3.12 to 6.3.15 (by @openlayers in https://github.com/openlayers/openlayers/pull/13344)
+ * Bump webpack from 5.67.0 to 5.68.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13345)
+ * Bump webpack-dev-server from 4.7.3 to 4.7.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13346)
+ * Bump sinon from 13.0.0 to 13.0.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13348)
+ * Bump rollup from 2.66.0 to 2.66.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13318)
+ * Bump karma from 6.3.11 to 6.3.12 (by @openlayers in https://github.com/openlayers/openlayers/pull/13314)
+ * Bump geotiff from 2.0.2 to 2.0.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13313)
+ * Bump puppeteer from 13.1.1 to 13.1.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13317)
+ * Bump sinon from 12.0.1 to 13.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13316)
+ * Bump jsdoc from 3.6.9 to 3.6.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13312)
+ * Bump copy-webpack-plugin from 10.2.1 to 10.2.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13311)
+ * Bump clean-css-cli from 5.5.0 to 5.5.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13310)
+ * Bump eslint from 8.7.0 to 8.8.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13309)
+ * Bump webpack-cli from 4.9.1 to 4.9.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13305)
+ * Bump globby from 13.0.0 to 13.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13308)
+ * Bump marked from 4.0.10 to 4.0.12 (by @openlayers in https://github.com/openlayers/openlayers/pull/13307)
+ * Use exactly typescript@4.6.0-beta (by @openlayers in https://github.com/openlayers/openlayers/pull/13306)
+ * Bump globby from 12.2.0 to 13.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13281)
+ * Bump @babel/core from 7.16.7 to 7.16.12 (by @openlayers in https://github.com/openlayers/openlayers/pull/13278)
+ * Bump webpack from 5.66.0 to 5.67.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13277)
+ * Bump puppeteer from 13.0.1 to 13.1.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13280)
+ * Bump rollup from 2.64.0 to 2.66.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13279)
+ * Bump @babel/preset-env from 7.16.8 to 7.16.11 (by @openlayers in https://github.com/openlayers/openlayers/pull/13276)
+ * Bump copy-webpack-plugin from 10.2.0 to 10.2.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13275)
+ * Bump jsdoc from 3.6.7 to 3.6.9 (by @openlayers in https://github.com/openlayers/openlayers/pull/13274)
+ * Bump ol-mapbox-style from 6.8.2 to 6.8.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13273)
+ * Bump mocha from 9.1.4 to 9.2.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13272)
+ * Bump eslint from 8.6.0 to 8.7.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13246)
+ * Bump mocha from 9.1.3 to 9.1.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13247)
+ * Bump webpack-sources from 3.2.2 to 3.2.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13248)
+ * Bump webpack from 5.65.0 to 5.66.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13249)
+ * Bump globby from 12.0.2 to 12.2.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13250)
+ * Bump @babel/preset-env from 7.16.7 to 7.16.8 (by @openlayers in https://github.com/openlayers/openlayers/pull/13251)
+ * Bump rollup from 2.63.0 to 2.64.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13252)
+ * Bump karma from 6.3.10 to 6.3.11 (by @openlayers in https://github.com/openlayers/openlayers/pull/13253)
+ * Bump marked from 4.0.9 to 4.0.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13243)
+
+
+</details>

changelog/v6.14.0.md

@@ -0,0 +1,55 @@
+# 6.14.0
+
+The 6.14 release includes a few new features and fixes.  The new `loadstart` and `loadend` events make it easy to add loading indicators to your maps.  Enhancements to the snap interaction add support for snapping to points coincident with lines and improve performance.  A change to WebGL rendering works around [an issue](https://bugs.webkit.org/show_bug.cgi?id=238196) in Safari 15.4.  Find detail on these improvements and more in the full list of changes below.
+
+#### List of all changes
+
+See below for a complete list of features and fixes.
+
+ * Store rendered source on the layer instead of the layer state (by @tschaub in https://github.com/openlayers/openlayers/pull/13509)
+ * Change imageSmoothing to interpolate in tests (by @mike-000 in https://github.com/openlayers/openlayers/pull/13506)
+ * Fallback if `OES_texture_float_linear` is not supported (by @mike-000 in https://github.com/openlayers/openlayers/pull/13505)
+ * Workaround for Safari WebGL issue (by @tschaub in https://github.com/openlayers/openlayers/pull/13492)
+ * Separate geometry and extent parsing (by @ahocevar in https://github.com/openlayers/openlayers/pull/13490)
+ * Add loadstart and loadend map events (by @ahocevar in https://github.com/openlayers/openlayers/pull/13491)
+ * Add documentation for precompose and postcopose to ol/layer/WebGLTile (by @ahocevar in https://github.com/openlayers/openlayers/pull/13482)
+ * Fix legacy build (by @ahocevar in https://github.com/openlayers/openlayers/pull/13469)
+ * Fix Text#setText jsDoc (by @rycgar in https://github.com/openlayers/openlayers/pull/13466)
+ * Do not warn about coordinates when view projection is configured (by @ahocevar in https://github.com/openlayers/openlayers/pull/13464)
+ * Reset image when empty (by @ahocevar in https://github.com/openlayers/openlayers/pull/13463)
+ * Revert image transition regression (by @ahocevar in https://github.com/openlayers/openlayers/pull/13460)
+ * Improve Snap interaction performance (by @MoonE in https://github.com/openlayers/openlayers/pull/13455)
+ * Snap Interaction can snap to Point on line segment (by @T-MAPY in https://github.com/openlayers/openlayers/pull/13446)
+ * Initialize variable before use in FullScreen control (by @MoonE in https://github.com/openlayers/openlayers/pull/13447)
+ * Ensure FullScreen button has classname set on render. (by @themoffster in https://github.com/openlayers/openlayers/pull/13444)
+ * Guard PluggableMap against null renderer (by @EvertEt in https://github.com/openlayers/openlayers/pull/13437)
+ * Fix rendercomplete with invisible WebGLPoints layer (by @M393 in https://github.com/openlayers/openlayers/pull/13434)
+ * Handle layers without renderer properly (by @ahocevar in https://github.com/openlayers/openlayers/pull/13424)
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * Bump minimist from 1.2.5 to 1.2.6 (by @openlayers in https://github.com/openlayers/openlayers/pull/13501)
+ * Bump node-forge from 1.2.1 to 1.3.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13498)
+ * Bump yargs from 17.3.1 to 17.4.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13493)
+ * Bump @babel/core from 7.17.5 to 7.17.8 (by @openlayers in https://github.com/openlayers/openlayers/pull/13494)
+ * Bump puppeteer from 13.4.1 to 13.5.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13472)
+ * Bump karma-chrome-launcher from 3.1.0 to 3.1.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13474)
+ * Bump mocha from 9.2.1 to 9.2.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13475)
+ * Bump proj4 from 2.7.5 to 2.8.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13476)
+ * Bump rollup from 2.70.0 to 2.70.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13477)
+ * Bump ol-mapbox-style from 7.0.0 to 7.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13473)
+ * Bump rollup from 2.69.0 to 2.70.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13449)
+ * Bump webpack from 5.69.1 to 5.70.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13450)
+ * Bump puppeteer from 13.4.0 to 13.4.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13451)
+ * Bump karma from 6.3.16 to 6.3.17 (by @openlayers in https://github.com/openlayers/openlayers/pull/13452)
+ * Bump typescript from 4.6.0-beta to 4.6.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13453)
+ * Bump puppeteer from 13.3.2 to 13.4.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13427)
+ * Bump fs-extra from 10.0.0 to 10.0.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13429)
+ * Bump @rollup/plugin-commonjs from 21.0.1 to 21.0.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13430)
+ * Bump rollup from 2.67.3 to 2.69.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13442)
+ * Bump @rollup/plugin-babel from 5.3.0 to 5.3.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13426)
+
+
+</details>

changelog/v6.14.1.md

@@ -0,0 +1,4 @@
+# 6.14.1
+
+The 6.14.1 release is a patch to correct a version discrepancy in the `package-lock.json` file.  See the [changelog for 6.14.0](https://github.com/openlayers/openlayers/releases/tag/v6.14.0) for new features and fixes since 6.13.
+

changelog/v6.15.0.md

@@ -0,0 +1,241 @@
+# 6.15.0
+
+## Overview
+
+The 6.15 release brings several fixes and improvements:
+* Faster vector tile rendering for soures with non-standard tile grids
+* Reduced canvas memory footprint for increased stability on iOS devices and better rendering performance
+* Fixed a bug that prevented tiles from expiring from the tile cache in the correct order
+* Better type safety with an increasing number of `null` checks and union types
+* New `setFill` and `setStroke` methods for `RegularShape` symbols
+* Vector symbol and text decluttering on the style level
+* Fixed pointer event handling on touch devices when layer visibility changes
+* New `justify` option for text styles
+* New `Link` interation for adding center, zoom, rotation and active layers to the URL
+* Easier css styling of the scale bar, and in addition to `minWidth`, the scale line can now also be configured with a `maxWidth`
+
+## Details
+
+### Deprecated `tilePixelRatio` option for data tile sources.
+
+If you were previously trying to scale data tiles using the `tilePixelRatio` property for data tile sources (this is rare), you should now use the explicit `tileSize` and `tileGrid` properties.  The source's `tileSize` represents the source tile dimensions and the tile grid's `tileSize` represents the desired rendered dimensions.
+
+```js
+const source = new DataTileSource({
+  tileSize: [512, 512], // source tile size
+  tileGrid: createXYZ({tileSize: [256, 256]}), // rendered tile size
+});
+```
+
+### Fixed coordinate dimension handling in `ol/proj`'s `addCoordinateTransforms`
+
+The `forward` and `inverse` functions passed to `addCooordinateTransforms` now receive a coordinate with all dimensions of the original coordinate, not just two. If you previosly had coordinates with more than two dimensions and added a transform like
+```js
+addCoordinateTransforms(
+    'EPSG:4326',
+    new Projection({code: 'latlong', units: 'degrees'}),
+    function(coordinate) { return coordinate.reverse(); },
+    function(coordinate) { return coordinate.reverse(); }
+);
+```
+you have to change that to
+```js
+addCoordinateTransforms(
+    'EPSG:4326',
+    new Projection({code: 'latlong', units: 'degrees'}),
+    function(coordinate) { return coordinate.slice(0, 2).reverse() },
+    function(coordinate) { return coordinate.slice(0, 2).reverse() }
+);
+```
+
+### Replacement of string enums with union types
+
+This change only affects users that were using the non-API string enums
+
+* ol/OverlayPositioning
+* ol/extent/Corner
+* ol/format/FormatType
+* ol/geom/GeometryType
+* ol/source/State
+* ol/source/WMSServerType
+* ol/source/WMTSRequestEncoding
+
+Instead of these, use the respective `string`s, which are now typesafe by means of union types.
+
+## List of all changes
+
+See below for a complete list of features and fixes.
+
+ * Base vector tile render tile grid on the source grid (by @mike-000 in https://github.com/openlayers/openlayers/pull/13832)
+ * ability to change the color of the scalebar (by @jipexu in https://github.com/openlayers/openlayers/pull/13834)
+ * Reduce canvas memory footprint for better iOS stability (by @ahocevar in https://github.com/openlayers/openlayers/pull/13823)
+ * Use union types instead of enums (by @ahocevar in https://github.com/openlayers/openlayers/pull/12696)
+ * remove XYZ-ESRI -4326-512 example (by @jipexu in https://github.com/openlayers/openlayers/pull/13817)
+ * Remove HERE Maps example (by @mike-000 in https://github.com/openlayers/openlayers/pull/13819)
+ * Checkcontenteditable (by @jipexu in https://github.com/openlayers/openlayers/pull/13787)
+ * Add null return type for TileGrid functions (by @EvertEt in https://github.com/openlayers/openlayers/pull/13674)
+ * Add setFill and setStroke to Shapes (by @theduckylittle in https://github.com/openlayers/openlayers/pull/13747)
+ * Include displacement and declutterMode in Icon style clone (by @mike-000 in https://github.com/openlayers/openlayers/pull/13803)
+ * Do not refresh use time for tiles when collecting used source tiles (by @M393 in https://github.com/openlayers/openlayers/pull/13799)
+ * Change WKB readFeature(s) return type to Feature (by @mike-000 in https://github.com/openlayers/openlayers/pull/13800)
+ * d3 version update (by @jipexu in https://github.com/openlayers/openlayers/pull/13784)
+ * Better fix for changing pointer ids on event target change (by @ahocevar in https://github.com/openlayers/openlayers/pull/13771)
+ * Fix source band calculation when configured with multiple sources (by @ahocevar in https://github.com/openlayers/openlayers/pull/13762)
+ * Clean up tracked pointers when the event target has changed (by @ahocevar in https://github.com/openlayers/openlayers/pull/13770)
+ * Fix modifying polygons with overlapping vertices (by @hargasinski in https://github.com/openlayers/openlayers/pull/13745)
+ * Support GML polygons with ring curves instead of linear rings (by @ahocevar in https://github.com/openlayers/openlayers/pull/13749)
+ * Fix typo in method names (by @MoonE in https://github.com/openlayers/openlayers/pull/13750)
+ * Load GeoTiff from Blob #13189 #13703 (by @m-mohr in https://github.com/openlayers/openlayers/pull/13724)
+ * improve text width calculation (by @IQGeo in https://github.com/openlayers/openlayers/pull/12106)
+ * Fix tile pyramid getData() (by @mike-000 in https://github.com/openlayers/openlayers/pull/13712)
+ * Improve icon-sprite-webgl example (by @MoonE in https://github.com/openlayers/openlayers/pull/13709)
+ * Fix hitdetection for icon with offset and pixelratio != 1 (by @MoonE in https://github.com/openlayers/openlayers/pull/13627)
+ * Wait for icons to be loaded before firing rendercomplete event (by @MoonE in https://github.com/openlayers/openlayers/pull/13626)
+ * Change typedef to boolean (by @mike-000 in https://github.com/openlayers/openlayers/pull/13702)
+ * #13690 VectorSource#getFeaturesInExtent add projection parameter (by @burleight in https://github.com/openlayers/openlayers/pull/13691)
+ * Update ESLint config and plugins (by @tschaub in https://github.com/openlayers/openlayers/pull/13701)
+ * Flip extent coordinates for projections with ne* axis order (by @ahocevar in https://github.com/openlayers/openlayers/pull/13688)
+ * Link interaction (by @tschaub in https://github.com/openlayers/openlayers/pull/13689)
+ * Test improvements (by @MoonE in https://github.com/openlayers/openlayers/pull/13676)
+ * Add  null return type (by @ahocevar in https://github.com/openlayers/openlayers/pull/13673)
+ * fix currentClip == null (by @CNS-Solutions in https://github.com/openlayers/openlayers/pull/13672)
+ * Handle NaN nodata (by @tschaub in https://github.com/openlayers/openlayers/pull/13669)
+ * Fix for parcel error while building examples (by @arekgotfryd in https://github.com/openlayers/openlayers/pull/13656)
+ * Explicit data tile size (by @tschaub in https://github.com/openlayers/openlayers/pull/13648)
+ * Decluttering mode by style (by @CNS-Solutions in https://github.com/openlayers/openlayers/pull/13566)
+ * Output GeoTIFF tile load errors to console (by @mike-000 in https://github.com/openlayers/openlayers/pull/13645)
+ * Fix typos in upgrade notes (by @openlayers in https://github.com/openlayers/openlayers/pull/13641)
+ * Let transform function transform all dimensions it is capable of (by @ahocevar in https://github.com/openlayers/openlayers/pull/13637)
+ * Fix dependabot config (by @tschaub in https://github.com/openlayers/openlayers/pull/13614)
+ * Include GitHub actions in the dependabot config (by @turrisxyz in https://github.com/openlayers/openlayers/pull/13611)
+ * Do not reload data tiles if already loaded or loading (by @mike-000 in https://github.com/openlayers/openlayers/pull/13594)
+ * Limit permissions for GitHub actions (by @turrisxyz in https://github.com/openlayers/openlayers/pull/13607)
+ * Handle rotation with non-square tiles (by @tschaub in https://github.com/openlayers/openlayers/pull/13603)
+ * Properly document loadstart and loadend events (by @ahocevar in https://github.com/openlayers/openlayers/pull/13595)
+ * Update OSM Vector Tiles attribution (by @mike-000 in https://github.com/openlayers/openlayers/pull/13568)
+ * WebGLPointsLayer wrapX support - partially addressing #11131 (by @burleight in https://github.com/openlayers/openlayers/pull/13528)
+ * Add `justify` option for text style (by @rycgar in https://github.com/openlayers/openlayers/pull/13571)
+ * Do not assert null projection (by @mike-000 in https://github.com/openlayers/openlayers/pull/13565)
+ * Improve Projection and Scale example calculations (by @mike-000 in https://github.com/openlayers/openlayers/pull/13496)
+ * Add geometryLayout property to Draw interaction (by @drnextgis in https://github.com/openlayers/openlayers/pull/13546)
+ * Updates for ol-mapbox-style v8 (by @ahocevar in https://github.com/openlayers/openlayers/pull/13552)
+ * NM symbol unit (by @jipexu in https://github.com/openlayers/openlayers/pull/13554)
+ * Update backgrounds when function returns a different color (by @ahocevar in https://github.com/openlayers/openlayers/pull/13550)
+ * Handle gutter in WebGL tile renderer (by @mike-000 in https://github.com/openlayers/openlayers/pull/13547)
+ * Do not add second interaction in Pinch Zoom example (by @mike-000 in https://github.com/openlayers/openlayers/pull/13551)
+ * Bugfix for GML parsing with multiple property elements with XML attributes (by @ejn in https://github.com/openlayers/openlayers/pull/12936)
+ * Fix small typo in docs (by @bartvde in https://github.com/openlayers/openlayers/pull/13536)
+ * Update type annotations for GMLBase (by @ahocevar in https://github.com/openlayers/openlayers/pull/13533)
+ * Add optional maxWidth for ScaleLine control (by @bartvde in https://github.com/openlayers/openlayers/pull/13531)
+ * Include tile gutter in offsets for getData() methods (by @mike-000 in https://github.com/openlayers/openlayers/pull/13521)
+ * Updates for the 6.14.1 release (by @openlayers in https://github.com/openlayers/openlayers/pull/13511)
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * Bump rollup from 2.76.0 to 2.77.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13841)
+ * Bump @types/geojson from 7946.0.8 to 7946.0.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13842)
+ * Bump @babel/preset-env from 7.18.6 to 7.18.9 (by @openlayers in https://github.com/openlayers/openlayers/pull/13843)
+ * Bump clean-css-cli from 5.6.0 to 5.6.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13844)
+ * Bump marked from 4.0.17 to 4.0.18 (by @openlayers in https://github.com/openlayers/openlayers/pull/13845)
+ * Bump @babel/core from 7.18.6 to 7.18.9 (by @openlayers in https://github.com/openlayers/openlayers/pull/13846)
+ * Bump puppeteer from 15.3.2 to 15.4.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13847)
+ * Bump eslint from 8.19.0 to 8.20.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13848)
+ * Bump puppeteer from 15.3.0 to 15.3.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13824)
+ * Bump rollup from 2.75.7 to 2.76.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13825)
+ * Bump @babel/core from 7.18.5 to 7.18.6 (by @openlayers in https://github.com/openlayers/openlayers/pull/13806)
+ * Bump webpack-dev-server from 4.9.2 to 4.9.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13810)
+ * Bump @babel/preset-env from 7.18.2 to 7.18.6 (by @openlayers in https://github.com/openlayers/openlayers/pull/13808)
+ * Bump puppeteer from 15.1.1 to 15.3.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13807)
+ * Bump es-main from 1.0.2 to 1.2.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13809)
+ * Bump eslint from 8.18.0 to 8.19.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13811)
+ * Bump @rollup/plugin-commonjs from 22.0.0 to 22.0.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13793)
+ * Bump puppeteer from 14.4.1 to 15.1.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13794)
+ * Bump eslint from 8.17.0 to 8.18.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13776)
+ * Bump typescript from 4.7.3 to 4.7.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13777)
+ * Bump karma from 6.3.20 to 6.4.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13775)
+ * Bump puppeteer from 14.3.0 to 14.4.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13778)
+ * Bump rollup from 2.75.6 to 2.75.7 (by @openlayers in https://github.com/openlayers/openlayers/pull/13779)
+ * Bump source-map-loader from 3.0.1 to 4.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13754)
+ * Bump @babel/core from 7.18.2 to 7.18.5 (by @openlayers in https://github.com/openlayers/openlayers/pull/13755)
+ * Bump marked from 4.0.16 to 4.0.17 (by @openlayers in https://github.com/openlayers/openlayers/pull/13756)
+ * Bump puppeteer from 14.2.1 to 14.3.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13757)
+ * Bump rollup from 2.75.5 to 2.75.6 (by @openlayers in https://github.com/openlayers/openlayers/pull/13758)
+ * Bump webpack-cli from 4.9.2 to 4.10.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13759)
+ * Bump webpack-dev-server from 4.9.1 to 4.9.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13760)
+ * Bump globby from 13.1.1 to 13.1.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13761)
+ * Bump eslint from 8.16.0 to 8.17.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13732)
+ * Bump typescript from 4.7.2 to 4.7.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13730)
+ * Bump webpack from 5.72.1 to 5.73.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13731)
+ * Bump rollup from 2.75.3 to 2.75.5 (by @openlayers in https://github.com/openlayers/openlayers/pull/13733)
+ * Bump puppeteer from 14.1.1 to 14.2.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13734)
+ * Bump webpack-dev-server from 4.9.0 to 4.9.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13735)
+ * Bump @babel/core from 7.18.0 to 7.18.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13717)
+ * Bump rollup from 2.74.1 to 2.75.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13718)
+ * Bump @types/offscreencanvas from 2019.6.4 to 2019.7.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13716)
+ * Bump typescript from 4.6.4 to 4.7.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13719)
+ * Bump @babel/preset-env from 7.18.0 to 7.18.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13720)
+ * Bump ol-mapbox-style from 8.0.8 to 8.1.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13715)
+ * Bump eslint from 8.9.0 to 8.16.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13693)
+ * Bump @babel/core from 7.17.10 to 7.18.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13694)
+ * Bump rollup from 2.73.0 to 2.74.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13699)
+ * Bump copy-webpack-plugin from 10.2.4 to 11.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13695)
+ * Bump webpack-dev-middleware from 5.3.1 to 5.3.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13696)
+ * Bump marked from 4.0.15 to 4.0.16 (by @openlayers in https://github.com/openlayers/openlayers/pull/13697)
+ * Bump @babel/preset-env from 7.17.10 to 7.18.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13698)
+ * Bump puppeteer from 14.1.0 to 14.1.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13700)
+ * Bump rollup from 2.72.1 to 2.73.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13680)
+ * Bump webpack from 5.72.0 to 5.72.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13681)
+ * Bump karma from 6.3.19 to 6.3.20 (by @openlayers in https://github.com/openlayers/openlayers/pull/13679)
+ * Bump puppeteer from 13.7.0 to 14.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13678)
+ * Bump ol-mapbox-style from 8.0.7 to 8.0.8 (by @openlayers in https://github.com/openlayers/openlayers/pull/13682)
+ * Bump yargs from 17.4.1 to 17.5.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13683)
+ * Bump rollup from 2.71.1 to 2.72.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13661)
+ * Bump sinon from 13.0.2 to 14.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13659)
+ * Bump webpack-dev-server from 4.8.1 to 4.9.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13662)
+ * Bump @rollup/plugin-node-resolve from 13.2.1 to 13.3.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13663)
+ * Bump ol-mapbox-style from 8.0.5 to 8.0.7 (by @openlayers in https://github.com/openlayers/openlayers/pull/13602)
+ * Bump marked from 4.0.14 to 4.0.15 (by @openlayers in https://github.com/openlayers/openlayers/pull/13628)
+ * Bump express from 4.18.0 to 4.18.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13629)
+ * Bump rollup from 2.70.2 to 2.71.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13630)
+ * Bump typescript from 4.6.3 to 4.6.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13631)
+ * Bump mocha from 9.2.2 to 10.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13632)
+ * Bump @babel/core from 7.17.9 to 7.17.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13633)
+ * Bump @babel/preset-env from 7.16.11 to 7.17.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13634)
+ * Bump github/codeql-action from 1 to 2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13616)
+ * Bump actions/setup-node from 2 to 3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13617)
+ * Bump actions/upload-artifact from 2 to 3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13615)
+ * Bump actions/checkout from 2 to 3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13618)
+ * Bump actions/github-script from 5 to 6 (by @openlayers in https://github.com/openlayers/openlayers/pull/13619)
+ * Bump puppeteer from 13.6.0 to 13.7.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13620)
+ * Bump express from 4.17.3 to 4.18.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13621)
+ * Bump @rollup/plugin-commonjs from 21.1.0 to 22.0.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13596)
+ * Bump puppeteer from 13.5.2 to 13.6.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13600)
+ * Bump pixelmatch from 5.2.1 to 5.3.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13598)
+ * Bump babel-loader from 8.2.4 to 8.2.5 (by @openlayers in https://github.com/openlayers/openlayers/pull/13601)
+ * Bump karma from 6.3.18 to 6.3.19 (by @openlayers in https://github.com/openlayers/openlayers/pull/13599)
+ * Bump sinon from 13.0.1 to 13.0.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13582)
+ * Bump async from 2.6.3 to 2.6.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13583)
+ * Bump @rollup/plugin-commonjs from 21.0.3 to 21.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13578)
+ * Bump fs-extra from 10.0.1 to 10.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13579)
+ * Bump karma from 6.3.17 to 6.3.18 (by @openlayers in https://github.com/openlayers/openlayers/pull/13580)
+ * Bump rollup from 2.70.1 to 2.70.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13581)
+ * Bump @rollup/plugin-node-resolve from 13.1.3 to 13.2.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13577)
+ * Bump webpack from 5.71.0 to 5.72.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13557)
+ * Bump @babel/core from 7.17.8 to 7.17.9 (by @openlayers in https://github.com/openlayers/openlayers/pull/13560)
+ * Bump webpack-dev-server from 4.7.4 to 4.8.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13559)
+ * Bump marked from 4.0.12 to 4.0.14 (by @openlayers in https://github.com/openlayers/openlayers/pull/13558)
+ * Bump yargs from 17.4.0 to 17.4.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13556)
+ * Bump webpack from 5.70.0 to 5.71.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13538)
+ * Bump jsdoc-plugin-typescript from 2.0.6 to 2.0.7 (by @openlayers in https://github.com/openlayers/openlayers/pull/13537)
+ * Bump puppeteer from 13.5.1 to 13.5.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13539)
+ * Bump clean-css-cli from 5.5.2 to 5.6.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13540)
+ * Bump typescript from 4.6.2 to 4.6.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13514)
+ * Bump babel-loader from 8.2.3 to 8.2.4 (by @openlayers in https://github.com/openlayers/openlayers/pull/13513)
+ * Bump @rollup/plugin-commonjs from 21.0.2 to 21.0.3 (by @openlayers in https://github.com/openlayers/openlayers/pull/13515)
+ * Bump serve-static from 1.14.2 to 1.15.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13512)
+ * Bump geotiff from 2.0.4 to 2.0.5 (by @openlayers in https://github.com/openlayers/openlayers/pull/13517)
+
+
+</details>

changelog/v6.15.1.md

@@ -0,0 +1,4 @@
+# 6.15.1
+
+The 6.15.1 release is a patch to ensure that a layer gets rendered when its source has completed loading.  See the [changelog for 6.15.0](https://github.com/openlayers/openlayers/releases/tag/v6.15.0) for new features and fixes since 6.14.
+

changelog/v6.8.1.md

@@ -1,4 +1,4 @@
-# 6.6.1
+# 6.8.1
 
 This is a patch release which updates `ol.css` to restore a legible control button size in applications that do not have a css `font-size` set for `button` elements.
 

changelog/v6.9.0.md

@@ -0,0 +1,51 @@
+# 6.9.0
+
+The 6.9 release brings a few new features and a number of fixes.  GeoTIFF sources now have a `normalize` option.  Set `normalize: false` if you want your style expressions to work with raw floating point values instead of normalized values from 0 to 1.  The GeoTIFF source also now uses nodata values from the source imagery – so in most cases you don't need to specify this yourself.  For people configuring vector layers with styles that use custom rendering, you can now get hit detection on the rendered result.  See details on these features and other included fixes below.
+
+ * [#12813](https://github.com/openlayers/openlayers/pull/12813) - Do not replace icon color if image not loaded ([@mike-000](https://github.com/mike-000))
+ * [#12870](https://github.com/openlayers/openlayers/pull/12870) - Fix publicPath problem in legacy build ([@ahocevar](https://github.com/ahocevar))
+ * [#12889](https://github.com/openlayers/openlayers/pull/12889) - Simplified ESLint config ([@tschaub](https://github.com/tschaub))
+ * [#12875](https://github.com/openlayers/openlayers/pull/12875) - Only trigger change event if animating a tile transition ([@tschaub](https://github.com/tschaub))
+ * [#12885](https://github.com/openlayers/openlayers/pull/12885) - Fix typeDefs for several Control modules ([@MatthijsBon](https://github.com/MatthijsBon))
+ * [#12861](https://github.com/openlayers/openlayers/pull/12861) - Update geotiff to 1.0.8; allow version range ([@ahocevar](https://github.com/ahocevar))
+ * [#12865](https://github.com/openlayers/openlayers/pull/12865) - Add a note about installing git before using create-ol-app ([@tschaub](https://github.com/tschaub))
+ * [#12847](https://github.com/openlayers/openlayers/pull/12847) - Add more definitions for GeoTIFF types ([@tschaub](https://github.com/tschaub))
+ * [#12850](https://github.com/openlayers/openlayers/pull/12850) - Fix issues with animate on View without center or resolution ([@MoonE](https://github.com/MoonE))
+ * [#12846](https://github.com/openlayers/openlayers/pull/12846) - Use nodata values in the GeoTIFF headers for fill value ([@tschaub](https://github.com/tschaub))
+ * [#12837](https://github.com/openlayers/openlayers/pull/12837) - forEachLayerAtPixel return null for unsupported layer types ([@mike-000](https://github.com/mike-000))
+ * [#12836](https://github.com/openlayers/openlayers/pull/12836) - Support a normalize option on the GeoTIFF source ([@tschaub](https://github.com/tschaub))
+ * [#12646](https://github.com/openlayers/openlayers/pull/12646) - Support for hit detection in styles with custom rendering ([@ashchurova](https://github.com/ashchurova))
+ * [#12831](https://github.com/openlayers/openlayers/pull/12831) - Fix rendering VectorImage with no features in view extent ([@MoonE](https://github.com/MoonE))
+ * [#12830](https://github.com/openlayers/openlayers/pull/12830) - bugfix: Fix type of `layers` option in `OverviewMap` ([@ejn](https://github.com/ejn))
+ * [#12815](https://github.com/openlayers/openlayers/pull/12815) - Spelling correction ([@tschaub](https://github.com/tschaub))
+ * [#12812](https://github.com/openlayers/openlayers/pull/12812) - Release v6.8.1 ([@openlayers](https://github.com/openlayers))
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * [#12881](https://github.com/openlayers/openlayers/pull/12881) - Bump webpack from 5.56.1 to 5.58.1 ([@openlayers](https://github.com/openlayers))
+ * [#12882](https://github.com/openlayers/openlayers/pull/12882) - Bump marked from 3.0.4 to 3.0.7 ([@openlayers](https://github.com/openlayers))
+ * [#12878](https://github.com/openlayers/openlayers/pull/12878) - Bump webpack-dev-server from 4.3.0 to 4.3.1 ([@openlayers](https://github.com/openlayers))
+ * [#12879](https://github.com/openlayers/openlayers/pull/12879) - Bump @babel/preset-env from 7.15.6 to 7.15.8 ([@openlayers](https://github.com/openlayers))
+ * [#12880](https://github.com/openlayers/openlayers/pull/12880) - Bump @babel/eslint-parser from 7.15.7 to 7.15.8 ([@openlayers](https://github.com/openlayers))
+ * [#12884](https://github.com/openlayers/openlayers/pull/12884) - Bump @babel/core from 7.15.5 to 7.15.8 ([@openlayers](https://github.com/openlayers))
+ * [#12877](https://github.com/openlayers/openlayers/pull/12877) - Bump webpack-cli from 4.8.0 to 4.9.0 ([@openlayers](https://github.com/openlayers))
+ * [#12854](https://github.com/openlayers/openlayers/pull/12854) - Bump webpack from 5.54.0 to 5.56.1 ([@openlayers](https://github.com/openlayers))
+ * [#12857](https://github.com/openlayers/openlayers/pull/12857) - Bump webpack-dev-server from 4.2.1 to 4.3.0 ([@openlayers](https://github.com/openlayers))
+ * [#12856](https://github.com/openlayers/openlayers/pull/12856) - Bump @rollup/plugin-commonjs from 20.0.0 to 21.0.0 ([@openlayers](https://github.com/openlayers))
+ * [#12855](https://github.com/openlayers/openlayers/pull/12855) - Bump rollup from 2.57.0 to 2.58.0 ([@openlayers](https://github.com/openlayers))
+ * [#12853](https://github.com/openlayers/openlayers/pull/12853) - Bump clean-css-cli from 5.3.3 to 5.4.1 ([@openlayers](https://github.com/openlayers))
+ * [#12822](https://github.com/openlayers/openlayers/pull/12822) - Bump glob from 7.1.7 to 7.2.0 ([@openlayers](https://github.com/openlayers))
+ * [#12824](https://github.com/openlayers/openlayers/pull/12824) - Bump rollup from 2.56.3 to 2.57.0 ([@openlayers](https://github.com/openlayers))
+ * [#12818](https://github.com/openlayers/openlayers/pull/12818) - Bump threads from 1.6.5 to 1.7.0 ([@openlayers](https://github.com/openlayers))
+ * [#12821](https://github.com/openlayers/openlayers/pull/12821) - Bump @rollup/plugin-node-resolve from 13.0.4 to 13.0.5 ([@openlayers](https://github.com/openlayers))
+ * [#12823](https://github.com/openlayers/openlayers/pull/12823) - Bump walk from 2.3.14 to 2.3.15 ([@openlayers](https://github.com/openlayers))
+ * [#12819](https://github.com/openlayers/openlayers/pull/12819) - Bump webpack-dev-middleware from 5.1.0 to 5.2.1 ([@openlayers](https://github.com/openlayers))
+ * [#12820](https://github.com/openlayers/openlayers/pull/12820) - Bump mocha from 9.1.1 to 9.1.2 ([@openlayers](https://github.com/openlayers))
+ * [#12817](https://github.com/openlayers/openlayers/pull/12817) - Bump yargs from 17.1.1 to 17.2.1 ([@openlayers](https://github.com/openlayers))
+ * [#12825](https://github.com/openlayers/openlayers/pull/12825) - Bump webpack from 5.53.0 to 5.54.0 ([@openlayers](https://github.com/openlayers))
+ * [#12826](https://github.com/openlayers/openlayers/pull/12826) - Bump puppeteer from 10.2.0 to 10.4.0 ([@openlayers](https://github.com/openlayers))
+
+
+</details>

changelog/v7.0.0.md

@@ -0,0 +1,169 @@
+# 7.0.0
+
+The 7.0 release includes an impressive batch of features and fixes from over 90 pull requests.  We're excited about a new foundation for WebGL vector rendering.  The previous point rendering functionality has been extended to include lines and polygons.  The rendering API is still low level and experimental.  Future releases will include a higher level styling API.  In developing the new WebGL rendering functionality, we changed the signature for a number of methods on a helper class that had been marked as part of the API in 6.x releases.  While this is technically a breaking change, it is unlikely that applications were using this helper class, so upgrades should be straightforward.
+
+We took advantage of the breaking change in the WebGL helper class to remove a few other deprecated parts of the API.  In addition, since Microsoft ended support for Internet Explorer a few months ago, we decided to do the same.
+
+### Backwards incompatible changes
+
+#### Removal of deprecated properties and methods
+
+ * The `tilePixelRatio` has been removed from the `DataTile` source.
+ * The `imageSmoothing` option has been removed from sources.
+ * The `undefinedHTML` option has been removed from the `MousePosition` control.
+ * The `forEachLayerAtPixel` method has been removed from the `Map` class.
+ * Deprecated options have been removed from the `Overlay` component.
+ * The `labelCache` has been removed from the `ol/render/canvas.js` module.
+
+#### Internet Explorer is no longer supported
+
+Please see https://docs.microsoft.com/en-us/lifecycle/announcements/internet-explorer-11-end-of-support.
+
+#### ol/webgl/Helper.js
+
+The `Helper` constructor from the `ol/webgl/Helper.js` module is no longer part of the public API.
+
+#### ol/coordinate.js
+
+The `toStringHDMS` function from the `ol/coordinate.js` module now formats longitude, latitude pairs so that the minutes and seconds are omitted if they are zero.  This changes the values displayed on graticules.
+
+#### ol/layer/Graticule
+
+The default `intervals` now align with integer minutes and seconds better suited to the default label formatter.  If formatting in decimal degrees you may wish to specify custom `intervals` suited to that format.
+
+#### ol/Collection
+
+Inserting with `setAt` or `insertAt` beyond the current length used to create a sparse Collection with `undefined` inserted for any missing indexes.  This will now throw an error instead.
+
+#### ol/control/MousePosition
+
+The control will now by default keep displaying the last mouse position when the mouse leaves the viewport.  With `placeholder: ' '` you can keep the old behaviour.  The `placeholder` option no longer accepts `false` as a valid value, instead simply omit the option.  The `undefinedHTML` option has been removed. You should use `placeholder` instead.
+
+#### ol/PluggableMap
+
+The `PluggableMap` class has been removed.  If you want to create a custom map class, extend the `Map` class instead.
+
+#### ol/style/Icon and ol/style/RegularShape
+
+`ol/style/Image` and subclasses `displacement` is no longer scaled with the image.  If you previously expected this unintended behavior you should now increase the displacement when setting the scale.
+
+### List of all changes
+
+See below for a complete list of features and fixes.
+
+ * Make the website deploy job succeed even if there are no changes (by @tschaub in https://github.com/openlayers/openlayers/pull/14017)
+ * Release actions (by @tschaub in https://github.com/openlayers/openlayers/pull/14014)
+ * Properly clear and refresh reprojected sources (by @ahocevar in https://github.com/openlayers/openlayers/pull/14013)
+ * Remove ENABLE_RASTER_REPROJECTION flag (by @ahocevar in https://github.com/openlayers/openlayers/pull/14011)
+ * Force render after update in Icon Scale example (by @mike-000 in https://github.com/openlayers/openlayers/pull/14012)
+ * Update ol-mapbox-style to v9.0.0 (by @ahocevar in https://github.com/openlayers/openlayers/pull/14009)
+ * Replace the Icon Scale example (by @mike-000 in https://github.com/openlayers/openlayers/pull/14007)
+ * Improve description of displacement in docs (by @mike-000 in https://github.com/openlayers/openlayers/pull/14006)
+ * Remove IE workarounds for legacy build, examples, and workers (by @tschaub in https://github.com/openlayers/openlayers/pull/13995)
+ * Use the full table for constructor options (by @tschaub in https://github.com/openlayers/openlayers/pull/13998)
+ * Do not scale Icon and RegularShape displacement (by @mike-000 in https://github.com/openlayers/openlayers/pull/13975)
+ * Support user projections in Drag and Drop (by @mike-000 in https://github.com/openlayers/openlayers/pull/14003)
+ * Avoid append only cache in WebGL tile layers (by @tschaub in https://github.com/openlayers/openlayers/pull/13997)
+ * Fix immediate renderer text rotation with offset (by @mike-000 in https://github.com/openlayers/openlayers/pull/13981)
+ * Build and deploy the website (by @openlayers in https://github.com/openlayers/openlayers/pull/13984)
+ * Small example template fixes (by @openlayers in https://github.com/openlayers/openlayers/pull/13992)
+ * Fix wording in API docs (by @openlayers in https://github.com/openlayers/openlayers/pull/13991)
+ * Nicer links in the API docs (by @tschaub in https://github.com/openlayers/openlayers/pull/13970)
+ * Minor adjustments to the website style (by @tschaub in https://github.com/openlayers/openlayers/pull/13989)
+ * Fix copying of non-linked ol.css, clean example build (by @MoonE in https://github.com/openlayers/openlayers/pull/13988)
+ * Fix kml-timezone example calculations (by @MoonE in https://github.com/openlayers/openlayers/pull/13982)
+ * Fix some errors in examples (by @MoonE in https://github.com/openlayers/openlayers/pull/13977)
+ * Update FontAwesome to v6.1.2 (by @MoonE in https://github.com/openlayers/openlayers/pull/13978)
+ * Use correct bands with `LUMINANCE_ALPHA` (by @mike-000 in https://github.com/openlayers/openlayers/pull/13974)
+ * Remove opt_ prefix (by @tschaub in https://github.com/openlayers/openlayers/pull/13972)
+ * Fix bandcount per texture for 8, 12, 16, etc. bands (by @mike-000 in https://github.com/openlayers/openlayers/pull/13973)
+ * Do not apply #12467 change to Icons (by @mike-000 in https://github.com/openlayers/openlayers/pull/13955)
+ * Remove more IE compatibility (by @MoonE in https://github.com/openlayers/openlayers/pull/13971)
+ * Remove workaround and docs for IE 11 (by @tschaub in https://github.com/openlayers/openlayers/pull/13965)
+ * Remove circular dependency (by @tschaub in https://github.com/openlayers/openlayers/pull/13967)
+ * Update link to sponsors (by @tschaub in https://github.com/openlayers/openlayers/pull/13968)
+ * Bundle code for the map on the homepage (by @tschaub in https://github.com/openlayers/openlayers/pull/13966)
+ * Website build (by @tschaub in https://github.com/openlayers/openlayers/pull/13961)
+ * Remove polyfills for IE and Android 4 (by @tschaub in https://github.com/openlayers/openlayers/pull/13963)
+ * Replace VERSION in un-transpiled source (by @MoonE in https://github.com/openlayers/openlayers/pull/13957)
+ * Use const in docs and other places (by @MoonE in https://github.com/openlayers/openlayers/pull/13958)
+ * Add few missing new lines in example source listing (by @MoonE in https://github.com/openlayers/openlayers/pull/13959)
+ * Fix js error in api pages on load (by @MoonE in https://github.com/openlayers/openlayers/pull/13956)
+ * Minor simplification (by @JakobMiksch in https://github.com/openlayers/openlayers/pull/13953)
+ * Fix typo and formatting in upgrade notes (by @mike-000 in https://github.com/openlayers/openlayers/pull/13946)
+ * Fixes to export examples (by @mike-000 in https://github.com/openlayers/openlayers/pull/13947)
+ * Fix WebGL points layer flaky test (by @jahow in https://github.com/openlayers/openlayers/pull/13944)
+ * Scaleline (by @MoonE in https://github.com/openlayers/openlayers/pull/13943)
+ * Improve loading of kmz file in example (by @MoonE in https://github.com/openlayers/openlayers/pull/13942)
+ * Fix KML default icon anchor with https icon url (by @MoonE in https://github.com/openlayers/openlayers/pull/13941)
+ * Use nicer functions, remove old code (by @MoonE in https://github.com/openlayers/openlayers/pull/13937)
+ * Render vector tile vectors in correct sequence for the postrender event (by @ahocevar in https://github.com/openlayers/openlayers/pull/13939)
+ * Remove workaround for missing TypedArray.from function (by @MoonE in https://github.com/openlayers/openlayers/pull/13936)
+ * Remove check for context.setLineDash (by @MoonE in https://github.com/openlayers/openlayers/pull/13933)
+ * Remove deprecated DataTile source `tilePixelRatio` (by @mike-000 in https://github.com/openlayers/openlayers/pull/13930)
+ * Remove input type="range" `change` event listeners where `input` events are also used (by @mike-000 in https://github.com/openlayers/openlayers/pull/13932)
+ * Remove deprecated `imageSmoothing` source options (by @mike-000 in https://github.com/openlayers/openlayers/pull/13931)
+ * Updated map background (by @tschaub in https://github.com/openlayers/openlayers/pull/13926)
+ * Include babel for CodeSandbox (by @tschaub in https://github.com/openlayers/openlayers/pull/13923)
+ * Remove reference to ES6 as ES2017 already listed (by @mike-000 in https://github.com/openlayers/openlayers/pull/13922)
+ * Style updates for examples and API docs (by @tschaub in https://github.com/openlayers/openlayers/pull/13917)
+ * Remove Google Analytics and cookie consent (by @tschaub in https://github.com/openlayers/openlayers/pull/13916)
+ * Fix map render test (by @MoonE in https://github.com/openlayers/openlayers/pull/13915)
+ * Uniformly grayscale controls (by @tschaub in https://github.com/openlayers/openlayers/pull/13908)
+ * Remove PluggableMap (by @tschaub in https://github.com/openlayers/openlayers/pull/13914)
+ * Remove MousePosition's deprecated undefinedHTML option (by @MoonE in https://github.com/openlayers/openlayers/pull/13911)
+ * Remove IconImage color fallback for IE (by @MoonE in https://github.com/openlayers/openlayers/pull/13912)
+ * Remove IE fallbacks (by @MoonE in https://github.com/openlayers/openlayers/pull/13907)
+ * Fix editing of export-map example on codesandbox (by @MoonE in https://github.com/openlayers/openlayers/pull/13910)
+ * Improve Collection type-safety (by @MoonE in https://github.com/openlayers/openlayers/pull/13902)
+ * Re-export the link interaction from the interactions module (by @tschaub in https://github.com/openlayers/openlayers/pull/13906)
+ * Replace enums with typedefs (by @MoonE in https://github.com/openlayers/openlayers/pull/13905)
+ * Accept an object literal for static layer styling (by @tschaub in https://github.com/openlayers/openlayers/pull/13900)
+ * Update jsdoc-plugin-typescript to fix markdown in type annotations (by @ahocevar in https://github.com/openlayers/openlayers/pull/13903)
+ * Wait until first load to create icon image (by @tschaub in https://github.com/openlayers/openlayers/pull/13899)
+ * Make Text options typesafe (by @MoonE in https://github.com/openlayers/openlayers/pull/13901)
+ * Align graticule default intervals to minutes and seconds (by @mike-000 in https://github.com/openlayers/openlayers/pull/13897)
+ * Publish untranspiled sources (by @tschaub in https://github.com/openlayers/openlayers/pull/13891)
+ * Improve reprojection WMS config for better performance (by @ahocevar in https://github.com/openlayers/openlayers/pull/13880)
+ * Omit minutes and seconds from HDMS formatting if zero (by @tschaub in https://github.com/openlayers/openlayers/pull/13893)
+ * Use Object.assign (by @tschaub in https://github.com/openlayers/openlayers/pull/13888)
+ * Remove unused worker (by @tschaub in https://github.com/openlayers/openlayers/pull/13892)
+ * Remove find and findIndex from array module (by @tschaub in https://github.com/openlayers/openlayers/pull/13887)
+ * Use Math.cosh and Math.log2 (by @tschaub in https://github.com/openlayers/openlayers/pull/13890)
+ * Use Object.values (by @tschaub in https://github.com/openlayers/openlayers/pull/13889)
+ * Remove workaround for Array.prototype.includes (by @tschaub in https://github.com/openlayers/openlayers/pull/13884)
+ * Codesandbox and bundler improvements for examples (by @ahocevar in https://github.com/openlayers/openlayers/pull/13879)
+ * Remove deprecated method PluggableMap#forEachLayerAtPixel ... (by @MoonE in https://github.com/openlayers/openlayers/pull/13868)
+ * Remove unused assertion numbers (by @MoonE in https://github.com/openlayers/openlayers/pull/13869)
+ * Remove deprecated Overlay options (by @MoonE in https://github.com/openlayers/openlayers/pull/13838)
+ * WebGL vector renderer for polygons, lines and points (by @jahow in https://github.com/openlayers/openlayers/pull/13461)
+ * Fix reloading tiles in case of an error with tile.load() (by @ahocevar in https://github.com/openlayers/openlayers/pull/13863)
+ * Handle multipolygons with empty polygons (by @ahocevar in https://github.com/openlayers/openlayers/pull/13860)
+ * Replace enums with typedef (by @MoonE in https://github.com/openlayers/openlayers/pull/13858)
+ * Remove deprecated label cache (by @MoonE in https://github.com/openlayers/openlayers/pull/13837)
+ * Update dev version to 7.0.0 (by @MoonE in https://github.com/openlayers/openlayers/pull/13850)
+ * Release v6.15.1 (by @openlayers in https://github.com/openlayers/openlayers/pull/13852)
+ * Recover from incorrect rebase after removal of string enums (by @ahocevar in https://github.com/openlayers/openlayers/pull/13835)
+ * Updates for the 6.15.0 release (by @openlayers in https://github.com/openlayers/openlayers/pull/13851)
+
+
+<details>
+  <summary>Dependency Updates</summary>
+
+ * Bump webpack-dev-server from 4.9.3 to 4.10.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13986)
+ * Bump rollup from 2.77.2 to 2.78.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13985)
+ * Bump eslint from 8.21.0 to 8.22.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13987)
+ * Bump @babel/preset-env from 7.18.9 to 7.18.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13948)
+ * Bump @babel/core from 7.18.9 to 7.18.10 (by @openlayers in https://github.com/openlayers/openlayers/pull/13949)
+ * Bump @rollup/plugin-commonjs from 22.0.1 to 22.0.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13951)
+ * Bump puppeteer from 15.5.0 to 16.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13950)
+ * Bump rollup from 2.77.0 to 2.77.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13919)
+ * Bump eslint from 8.20.0 to 8.21.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13920)
+ * Bump jsdoc-plugin-typescript from 2.0.7 to 2.1.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13875)
+ * Bump puppeteer from 15.4.0 to 15.5.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13871)
+ * Bump webpack from 5.73.0 to 5.74.0 (by @openlayers in https://github.com/openlayers/openlayers/pull/13870)
+ * Bump jsdoc from 3.6.10 to 3.6.11 (by @openlayers in https://github.com/openlayers/openlayers/pull/13873)
+ * Bump terser from 5.7.2 to 5.14.2 (by @openlayers in https://github.com/openlayers/openlayers/pull/13859)
+
+
+</details>

config/jsdoc/api/conf.json

@@ -14,6 +14,7 @@
     ]
   },
   "plugins": [
+    "jsdoc-plugin-intersection",
     "config/jsdoc/plugins/markdown.cjs",
     "jsdoc-plugin-typescript",
     "config/jsdoc/plugins/inline-options.cjs",

config/jsdoc/api/index.md

@@ -27,6 +27,7 @@
         <a href="module-ol_layer_Tile-TileLayer.html">ol/layer/Tile</a><br>
         <a href="module-ol_layer_Image-ImageLayer.html">ol/layer/Image</a><br>
         <a href="module-ol_layer_Vector-VectorLayer.html">ol/layer/Vector</a><br>
+        <a href="module-ol_layer_VectorImage-VectorImageLayer.html">ol/layer/VectorImage</a><br>
         <a href="module-ol_layer_VectorTile-VectorTileLayer.html">ol/layer/VectorTile</a><br>
         <a href="module-ol_layer_WebGLTile-WebGLTileLayer.html">ol/layer/WebGLTile</a>
       </div>
@@ -36,7 +37,7 @@
     <div class="card h-100 bg-light">
       <div class="card-body">
         <h4 class="card-title">Controls</h4>
-        <a href="module-ol_control.html#.defaults">Map default controls</a><br>
+        <a href="module-ol_control_defaults#.defaults">Map default controls</a><br>
         <a href="module-ol_control_Control-Control.html">All controls</a>
       </div>
     </div>
@@ -45,7 +46,7 @@
     <div class="card h-100 bg-light">
       <div class="card-body">
         <h4 class="card-title">Interactions</h4>
-        <a href="module-ol_interaction.html#~defaults">Map default interactions</a><br>
+        <a href="module-ol_interaction_defaults#.defaults">Map default interactions</a><br>
         Interactions for <a href="module-ol_Feature-Feature.html">vector features</a>
         <ul><li><a href="module-ol_interaction_Select-Select.html">ol/interaction/Select</a></li>
           <li><a href="module-ol_interaction_Draw-Draw.html">ol/interaction/Draw</a></li>
@@ -72,8 +73,8 @@
     <div class="card h-100 bg-light">
       <div class="card-body">
         <h4 class="card-title">Projections</h4>
-          <p>All coordinates and extents need to be provided in view projection (default: EPSG:3857). To transform coordinates from and to geographic, use <a href="module-ol_proj.html#.fromLonLat">ol/proj#fromLonLat()</a> and <a href="module-ol_proj.html#.toLonLat">ol/proj#toLonLat()</a>. For extents and other projections, use <a href="module-ol_proj.html#.transformExtent">ol/proj#transformExtent()</a> and <a href="module-ol_proj.html#.transform">ol/proj#transform()</a>.<p>
-          <a href="module-ol_proj.html">ol/proj</a>
+          <p>All coordinates and extents need to be provided in view projection (default: EPSG:3857). To transform coordinates from and to geographic, use <a href="module-ol_proj.html#.fromLonLat">fromLonLat()</a> and <a href="module-ol_proj.html#.toLonLat">toLonLat()</a>. For extents and other projections, use <a href="module-ol_proj.html#.transformExtent">transformExtent()</a> and <a href="module-ol_proj.html#.transform">transform()</a>.</p>
+          <p>Find these functions and more in the <a href="module-ol_proj.html">ol/proj</a> module.</p>
       </div>
     </div>
   </div>
@@ -81,7 +82,7 @@
     <div class="card h-100 bg-light">
       <div class="card-body">
         <h4 class="card-title">Observable objects</h4>
-        <p>Changes to all <a href="module-ol_Object-BaseObject.html">ol/Object</a>s can be observed by calling the <a href="module-ol_Object-BaseObject.html#on">object.on('propertychange')</a> method.  Listeners receive an <a href="module-ol_Object.ObjectEvent.html">ol/Object.ObjectEvent</a> with information on the changed property and old value.</p>
+        <p>Changes to all <a href="module-ol_Object-BaseObject.html">Object</a>s can be observed by calling the <a href="module-ol_Object-BaseObject.html#on">object.on('propertychange')</a> method.  Listeners receive an <a href="module-ol_Object.ObjectEvent.html">ObjectEvent</a> with information on the changed property and old value.</p>
       </div>
     </div>
   </div>

config/jsdoc/api/template/publish.js

@@ -17,7 +17,6 @@ const taffy = require('taffydb').taffy;
 const handle = require('jsdoc/lib/jsdoc/util/error').handle;
 const helper = require('jsdoc/lib/jsdoc/util/templateHelper');
 const htmlsafe = helper.htmlsafe;
-const linkto = helper.linkto;
 const resolveAuthorLinks = helper.resolveAuthorLinks;
 const outdir = env.opts.destination;
 
@@ -32,6 +31,78 @@ function find(spec) {
   return helper.find(data, spec);
 }
 
+function getShortName(longname) {
+  if (!longname.includes('module:ol/')) {
+    return longname;
+  }
+  if (longname.includes('|')) {
+    return longname;
+  }
+  if (longname.includes('<')) {
+    return longname;
+  }
+  return longname.split(/[\~\.#\:]/).pop();
+}
+
+function linkto(longname, linkText, cssClass, fragmentId) {
+  if (linkText) {
+    return helper.linkto(longname, linkText, cssClass, fragmentId);
+  }
+
+  if (!longname.includes('module:ol/')) {
+    return helper.linkto(longname, linkText, cssClass, fragmentId);
+  }
+
+  // check for `Array<foo|bar>` types (but allow `Array<foo>|Array<bar>` types)
+  let openBrackets = 0;
+  let parseTypes = false;
+  for (const c of longname) {
+    if (c === '<') {
+      openBrackets += 1;
+      continue;
+    }
+    if (c === '>') {
+      openBrackets -= 1;
+      continue;
+    }
+    if (openBrackets > 0 && c === '|') {
+      parseTypes = true;
+      break;
+    }
+  }
+  if (parseTypes) {
+    // collections or generics with unions get parsed by catharsis and
+    // will unfortunamely include long module:ol/foo names
+    return helper.linkto(longname, '', cssClass, fragmentId);
+  }
+
+  // handle union types
+  if (longname.includes('|')) {
+    return longname
+      .split('|')
+      .map((part) => linkto(part, '', cssClass, fragmentId))
+      .join(' | ');
+  }
+
+  const match = longname.match(/(.+?)\.?<(.+)>$/);
+  // handle generics and collections
+  if (match) {
+    return (
+      linkto(match[1], '', cssClass, fragmentId) +
+      '<' +
+      linkto(match[2], '', cssClass, fragmentId) +
+      '>'
+    );
+  }
+
+  return helper.linkto(
+    longname,
+    htmlsafe(getShortName(longname)),
+    cssClass,
+    fragmentId
+  );
+}
+
 function tutoriallink(tutorial) {
   return helper.toTutorial(tutorial, null, {
     tag: 'em',
@@ -85,15 +156,44 @@ function addSignatureParams(f) {
   f.signature = (f.signature || '') + '(' + params.join(', ') + ')';
 }
 
+/**
+ * Copied from https://github.com/jsdoc/jsdoc/blob/main/packages/jsdoc/lib/jsdoc/util/templateHelper.js
+ * Modified to call our own `linkto` to shorten names.
+ * @param {Object} doclet The doclet.
+ * @param {Array} [doclet.yields] The returns.
+ * @param {Array} [doclet.returns] The returns.
+ * @param {string} cssClass The css class.
+ * @return {Array} The returns.
+ */
+function getSignatureReturns({yields, returns}, cssClass) {
+  let returnTypes = [];
+
+  if (yields || returns) {
+    (yields || returns).forEach((r) => {
+      if (r && r.type && r.type.names) {
+        if (!returnTypes.length) {
+          returnTypes = r.type.names;
+        }
+      }
+    });
+  }
+
+  if (returnTypes && returnTypes.length) {
+    returnTypes = returnTypes.map((r) => linkto(r, '', cssClass));
+  }
+
+  return returnTypes;
+}
+
 function addSignatureReturns(f) {
-  const returnTypes = helper.getSignatureReturns(f);
+  const returnTypes = getSignatureReturns(f);
 
   f.signature = '<span class="signature">' + (f.signature || '') + '</span>';
 
   if (returnTypes.length) {
     f.signature +=
       '<span class="fa fa-arrow-circle-right"></span><span class="type-signature returnType">' +
-      (returnTypes.length ? '{' + returnTypes.join('|') + '}' : '') +
+      (returnTypes.length ? '{' + returnTypes.join(' | ') + '}' : '') +
       '</span>';
   }
 }
@@ -110,12 +210,10 @@ function addSignatureTypes(f) {
 
 function shortenPaths(files, commonPrefix) {
   // always use forward slashes
-  const regexp = new RegExp('\\\\', 'g');
-
   Object.keys(files).forEach(function (file) {
     files[file].shortened = files[file].resolved
       .replace(commonPrefix, '')
-      .replace(regexp, '/');
+      .replaceAll('\\', '/');
   });
 
   return files;
@@ -138,6 +236,13 @@ function getPathFromDoclet(doclet) {
   return filepath;
 }
 
+function preprocessLinks(text) {
+  return text.replaceAll(
+    /\{@link (module:ol\/\S+?)\}/g,
+    (match, longname) => `{@link ${longname} ${getShortName(longname)}}`
+  );
+}
+
 function generate(title, docs, filename, resolveLinks) {
   resolveLinks = resolveLinks === false ? false : true;
 
@@ -152,7 +257,7 @@ function generate(title, docs, filename, resolveLinks) {
   let html = view.render('container.tmpl', docData);
 
   if (resolveLinks) {
-    html = helper.resolveLinks(html); // turn {@link foo} into <a href="foodoc.html">foo</a>
+    html = helper.resolveLinks(preprocessLinks(html)); // turn {@link foo} into <a href="foodoc.html">foo</a>
   }
 
   fs.writeFileSync(outpath, html, 'utf8');
@@ -223,7 +328,7 @@ function getPrettyName(doclet) {
 
 /**
  * Create the navigation sidebar.
- * @param {object} members The members that will be used to create the sidebar.
+ * @param {Object} members The members that will be used to create the sidebar.
  * @param {Array<Object>} members.classes Classes.
  * @param {Array<Object>} members.externals Externals.
  * @param {Array<Object>} members.globals Globals.
@@ -364,13 +469,12 @@ exports.publish = function (taffyData, opts, tutorials) {
       doclet.examples = doclet.examples.map(function (example) {
         let caption, code;
 
-        if (
-          example.match(
-            /^\s*<caption>([\s\S]+?)<\/caption>(\s*[\n\r])([\s\S]+)$/i
-          )
-        ) {
-          caption = RegExp.$1;
-          code = RegExp.$3;
+        const match = example.match(
+          /^\s*<caption>([\s\S]+?)<\/caption>(?:\s*[\n\r])([\s\S]+)$/i
+        );
+        if (match) {
+          caption = match[1];
+          code = match[2];
         }
 
         return {
@@ -461,7 +565,7 @@ exports.publish = function (taffyData, opts, tutorials) {
   data().each(function (doclet) {
     const url = helper.longnameToUrl[doclet.longname];
 
-    if (url.indexOf('#') > -1) {
+    if (url.includes('#')) {
       doclet.id = helper.longnameToUrl[doclet.longname].split(/#/).pop();
     } else {
       doclet.id = doclet.name;
@@ -493,6 +597,7 @@ exports.publish = function (taffyData, opts, tutorials) {
   // add template helpers
   view.find = find;
   view.linkto = linkto;
+  view.getShortName = getShortName;
   view.resolveAuthorLinks = resolveAuthorLinks;
   view.tutoriallink = tutoriallink;
   view.htmlsafe = htmlsafe;
@@ -500,6 +605,7 @@ exports.publish = function (taffyData, opts, tutorials) {
 
   // once for all
   view.nav = buildNav(members);
+
   attachModuleSymbols(
     find({kind: ['class', 'function'], longname: {left: 'module:'}}),
     members.modules
@@ -518,7 +624,16 @@ exports.publish = function (taffyData, opts, tutorials) {
   // index page displays information from package.json and lists files
   const files = find({kind: 'file'});
 
-  view.navigationHtml = helper.resolveLinks(view.partial('navigation.tmpl'));
+  view.navigationItems = view.nav.reduce(function (dict, item) {
+    dict[item.longname] = item;
+    return dict;
+  }, {});
+  const navigationHtml = helper.resolveLinks(
+    view.nav.map((item) => view.partial('navigation.tmpl', {item})).join('')
+  );
+  const navHtmlPath = path.join(outdir, 'navigation.tmpl.html');
+  fs.writeFileSync(navHtmlPath, navigationHtml, 'utf8');
+
   generate(
     'Index',
     [

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

@@ -1,17 +1,11 @@
 (function() {
-    var counter = 0;
-    var numbered;
-    var source = document.getElementsByClassName('prettyprint source');
-
-    if (source && source[0]) {
-        source = source[0].getElementsByTagName('code')[0];
-
-        numbered = source.innerHTML.split('\n');
-        numbered = numbered.map(function(item) {
-            counter++;
-            return '<span id="line' + counter + '"></span>' + item;
-        });
-
-        source.innerHTML = numbered.join('\n');
+    const source = document.querySelector('.prettyprint.source > code');
+    if (source) {
+        source.innerHTML = source.innerHTML
+            .split('\n')
+            .map(function (item, i) {
+                return '<span id="line' + (i + 1) + '"></span>' + item;
+            })
+            .join('\n');
     }
 })();

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

@@ -62,21 +62,49 @@ $(function () {
       $navList.addClass('search-empty');
       return 'search-empty';
     })();
+    let initialCurrent = navListNode.querySelector('li.item');
+    const longname = initialCurrent && initialCurrent.dataset.longname;
     let manualToggles = {};
-
-    // Show an item related a current documentation automatically
-    const longname = $('.page-title').data('filename')
-      .replace(/\.[a-z]+$/, '')
-      .replace('module-', 'module:')
-      .replace(/_/g, '/')
-      .replace(/-/g, '~');
-    const currentItem = navListNode.querySelector('.item[data-longname="' + longname + '"]');
-    if (currentItem) {
-      $navList.prepend(currentItem);
+    if (initialCurrent) {
+      manualToggles[longname] = $(initialCurrent);
     }
+
+    fetch('./navigation.tmpl.html').then(function (response) {
+      return response.text();
+    }).then(function (text) {
+      navListNode.innerHTML = text;
+
+      // Show an item related a current documentation automatically
+      const currentItem = navListNode.querySelector('.item[data-longname="' + longname + '"]');
+      if (currentItem) {
+        $navList.prepend(currentItem);
+        search.$currentItem = $(currentItem);
+      }
+      $classItems = undefined;
+      $members = undefined;
+
+      // Search again with full navigation, if user already searched
+      manualToggles = {};
+      const lastTerm = search.lastSearchTerm;
+      search.lastSearchTerm = undefined;
+      if (currentItem) {
+        const fa = currentItem.querySelector('.title > .fa');
+        fa.classList.add('no-transition');
+        setTimeout(function () {
+          fa.classList.remove('no-transition');
+        }, 0);
+      }
+      doSearch(lastTerm || '');
+
+      // Transfer manual toggle state to newly loaded current node
+      if (initialCurrent && initialCurrent.classList.contains('toggle-manual')) {
+        search.manualToggle(search.$currentItem, initialCurrent.classList.contains('toggle-manual-show'));
+      }
+    });
+
     return {
       $navList: $navList,
-      $currentItem: currentItem ? $(currentItem) : undefined,
+      $currentItem: initialCurrent ? $(initialCurrent) : undefined,
       lastSearchTerm: undefined,
       lastState: {},
       lastClasses: undefined,
@@ -240,7 +268,7 @@ $(function () {
 
   // Toggle when click an item element
   search.$navList.on('click', '.toggle', function (e) {
-    if (event.target.tagName.toLowerCase() === 'a') {
+    if (e.target.tagName === 'A') {
       return;
     }
     const clsItem = $(this).closest('.item');
@@ -249,28 +277,28 @@ $(function () {
   });
 
   // warn about outdated version
-  var currentVersion = document.getElementById('package-version').innerHTML;
-  var packageUrl = 'https://raw.githubusercontent.com/openlayers/openlayers.github.io/build/package.json';
-  fetch(packageUrl).then(function(response) {
+  const currentVersion = document.getElementById('package-version').innerHTML;
+  const releaseUrl = 'https://cdn.jsdelivr.net/npm/ol/package.json';
+  fetch(releaseUrl).then(function(response) {
     return response.json();
   }).then(function(json) {
-    var latestVersion = json.version;
+    const latestVersion = json.version;
     document.getElementById('latest-version').innerHTML = latestVersion;
-    var url = window.location.href;
-    var branchSearch = url.match(/\/([^\/]*)\/apidoc\//);
-    var cookieText = 'dismissed=-' + latestVersion + '-';
-    var dismissed = document.cookie.indexOf(cookieText) != -1;
+    const url = window.location.href;
+    const branchSearch = url.match(/\/([^\/]*)\/apidoc\//);
+    const storageKey = 'dismissed=-' + latestVersion;
+    const dismissed = localStorage.getItem(storageKey) === 'true';
     if (branchSearch && !dismissed && /^v[0-9\.]*$/.test(branchSearch[1]) && currentVersion != latestVersion) {
-      var link = url.replace(branchSearch[0], '/latest/apidoc/');
+      const link = url.replace(branchSearch[0], '/latest/apidoc/');
       fetch(link, {method: 'head'}).then(function(response) {
-        var a = document.getElementById('latest-link');
+        const a = document.getElementById('latest-link');
         a.href = response.status == 200 ? link : '../../latest/apidoc/';
       });
-      var latestCheck = document.getElementById('latest-check');
+      const latestCheck = document.getElementById('latest-check');
       latestCheck.style.display = '';
       document.getElementById('latest-dismiss').onclick = function() {
         latestCheck.style.display = 'none';
-        document.cookie = cookieText;
+        localStorage.setItem(storageKey, 'true');
       }
     }
   });

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

@@ -5,6 +5,7 @@
 
 .navbar-brand img {
   height: 35px;
+  width: 35px;
   vertical-align: middle;
   margin-right: 5px;
   display: inline-block;
@@ -71,6 +72,11 @@ li {
 .navigation-list {
   padding: 0 15px 0 15px;
 }
+.no-transition,
+.no-transition:after,
+.no-transition:before {
+    transition: none!important;
+}
 @supports (position: sticky) {
   .navigation {
     position: sticky;
@@ -78,7 +84,7 @@ li {
     height: calc(100vh - 54px);
   }
   .navigation-list {
-    overflow: auto;
+    overflow-y: auto;
     /* 54px navbar height */
     /* 4.25rem + 2px  searchbox height */
     /* 25px navigation padding */
@@ -94,7 +100,7 @@ li {
     position: inherit;
   }
   .navigation-list {
-    overflow: auto;
+    overflow-y: auto;
     max-height: 33vh;
     height: inherit;
   }
@@ -166,7 +172,6 @@ li {
 }
 .navigation li.item .title {
   cursor: pointer;
-  display: -ms-flexbox;
   display: flex;
   font-size: 0.85em;
 }
@@ -206,6 +211,10 @@ li {
   padding-left: 8px;
 }
 
+.navigation-list li.loading {
+  display: block;
+  height: 101vh;
+}
 /* search state */
 /* show all classes when search is empty */
 .navigation-list.search-empty .item {

config/jsdoc/api/template/static/theme

@@ -0,0 +1 @@
+../../../../../site/src/theme

config/jsdoc/api/template/tmpl/container.tmpl

@@ -46,7 +46,7 @@
         <script async type="text/javascript" src="https://cdn.carbonads.com/carbon.js?serve=CE7DV53U&placement=openlayersorg" id="_carbonads_js"></script>
       </div>
     <?js if (doc.classdesc) { ?>
-      <div class="class-description col-lg-7 align-self-center pl-0"><?js= doc.classdesc ?></div>
+      <div class="class-description col-lg-7 align-self-center ps-0"><?js= doc.classdesc ?></div>
     <?js } ?>
     </div>
 </header>
@@ -79,13 +79,13 @@
 
     <?js if (doc.kind == 'class') {
       var subclasses = self.find(function() {
-        return this.augments && this.augments.indexOf(doc.longname) > -1;
+        return this.augments && this.augments.includes(doc.longname);
       })
       if (subclasses.length) {
     ?>
         <h3 class="subsection-title">Subclasses</h3>
         <ul><?js subclasses.forEach(function(s) { ?>
-          <li><?js= self.linkto(s.longname, s.longname) ?>
+          <li><?js= self.linkto(s.longname) ?>
             <?js= (s.interface ? '(Interface)' : '') ?>
           </li>
         <?js }); ?></ul>
@@ -95,7 +95,7 @@
         <h3 class="subsection-title">Extends</h3>
 
         <ul><?js doc.augments.forEach(function(a) { ?>
-            <li><?js= self.linkto(a, a) ?></li>
+            <li><?js= self.linkto(a) ?></li>
         <?js }); ?></ul>
     <?js } ?>
 
@@ -103,7 +103,7 @@
         <h3 class="subsection-title">Mixes In</h3>
 
         <ul><?js doc.mixes.forEach(function(a) { ?>
-            <li><?js= self.linkto(a, a) ?></li>
+            <li><?js= self.linkto(a) ?></li>
         <?js }); ?></ul>
     <?js } ?>
 
@@ -111,7 +111,7 @@
         <h3 class="subsection-title">Requires</h3>
 
         <ul><?js doc.requires.forEach(function(r) { ?>
-            <li><?js= self.linkto(r, r) ?></li>
+            <li><?js= self.linkto(r) ?></li>
         <?js }); ?></ul>
     <?js } ?>
 
@@ -162,7 +162,7 @@
         var methods = self.find({kind: 'function', memberof: title === 'Global' ? {isUndefined: true} : doc.longname});
         if (methods && methods.length && methods.forEach) {
     ?>
-        <h3 class="subsection-title">Methods</h3>
+        <h3 class="subsection-title"><?js= doc.kind === 'module' ? 'Functions' : 'Methods' ?></h3>
 
         <dl><?js methods.forEach(function(m) { ?>
             <?js m.parent = doc ?>

config/jsdoc/api/template/tmpl/examples.tmpl

@@ -6,7 +6,7 @@
         <p class="code-caption"><?js= example.caption ?></p>
     <?js } ?>
 
-    <?js if (example.code.toString().indexOf('<pre>') === -1) { ?>
+    <?js if (!example.code.toString().includes('<pre>')) { ?>
     <pre class="prettyprint"><code><?js= example.code ?></code></pre>
     <?js } else { ?>
     <?js= example.code.replace(/<pre>/g, '<pre class="prettyprint">') ?>

config/jsdoc/api/template/tmpl/layout.tmpl

@@ -4,130 +4,93 @@ var version = obj.packageInfo.version;
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="utf-8">
-    <script>
-    var gaProperty = 'UA-2577926-1';
-    // Disable tracking if the opt-out cookie exists.
-    var disableStr = 'ga-disable-' + gaProperty;
-    if (document.cookie.indexOf(disableStr + '=true') > -1) {
-      window[disableStr] = true;
-    }
-    function gaOptout() {
-      document.cookie = disableStr + '=true; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
-      window[disableStr] = true;
-    }
-    function gaOptoutRevoke() {
-      document.cookie = disableStr + '=false; expires=Thu, 31 Dec 2099 23:59:59 UTC; path=/';
-      window[disableStr] = false;
-    }
-    </script>
-    <!-- Global site tag (gtag.js) - Google Analytics -->
-    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-2577926-1"></script>
-    <script>
-      window.dataLayer = window.dataLayer || [];
-      function gtag(){dataLayer.push(arguments);}
-      gtag('js', new Date());
-      gtag('config', 'UA-2577926-1', { 'anonymize_ip': true });
-    </script>
-    <link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.css" />
-    <script src="//cdnjs.cloudflare.com/ajax/libs/cookieconsent2/3.1.0/cookieconsent.min.js"></script>
-    <script>
-    window.addEventListener("load", function() {
-      window.cookieconsent.initialise({
-        'palette': {
-          'popup': {
-            'background': '#eaf7f7',
-            'text': '#5c7291'
-          },
-          'button': {
-            'background': '#56cbdb',
-            'text': '#ffffff'
-          }
-        },
-        'theme': 'edgeless',
-        'type': 'opt-out',
-        'onInitialise': function (status) {
-          if (!this.hasConsented()) {
-            gaOptout()
-          }
-        },
-        'onStatusChange': function(status, chosenBefore) {
-          if (!this.hasConsented()) {
-            gaOptout()
-          }
-        },
-        'onRevokeChoice': function() {
-          gaOptoutRevoke()
-        }
-      })
-    });
-    </script>
+    <meta charset="UTF-8">
     <title>OpenLayers v<?js= version ?> API - <?js= title ?></title>
-    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch"></script>
-    <script src="scripts/prettify/prettify.js"> </script>
-    <script src="scripts/prettify/lang-css.js"> </script>
-    <script src="scripts/jquery.min.js"> </script>
-    <script src="scripts/bootstrap.bundle.min.js"> </script>
-    <!--[if lt IE 9]>
-      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
-    <![endif]-->
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" type="text/css">
-    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
-    <link type="text/css" rel="stylesheet" href="styles/bootstrap.min.css">
-    <link type="text/css" rel="stylesheet" href="styles/jaguar.css">
-    <link type="text/css" rel="stylesheet" href="styles/site.css">
+    <script src="scripts/prettify/prettify.js"></script>
+    <script src="scripts/prettify/lang-css.js"></script>
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/fontawesome.min.css" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/solid.css" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.1.2/css/brands.css" crossorigin="anonymous">
+    <link rel="stylesheet" type="text/css" href="styles/prettify-tomorrow.css">
+    <link rel="stylesheet" type="text/css" href="styles/jaguar.css">
+    <link rel="stylesheet" type="text/css" href="styles/carbon.css">
+    <link rel="stylesheet" type="text/css" href="/theme/ol.css">
+    <link rel="stylesheet" type="text/css" href="/theme/site.css">
   </head>
   <body>
-    <div class="container-fluid">
-      <header class="navbar navbar-expand-sm navbar-dark mb-3 py-0 fixed-top" role="navigation">
-        <a class="navbar-brand" href="https://openlayers.org/"><img src="logo-70x70.png" alt="">&nbsp;OpenLayers</a>
+    <header class="navbar navbar-expand-sm navbar-dark mb-3 px-3 py-0 fixed-top" role="navigation">
+      <a class="navbar-brand" href="/"><img src="/theme/img/logo-dark.svg" width="70" height="70" alt="">&nbsp;OpenLayers</a>
+      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#olmenu" aria-controls="olmenu" aria-expanded="false" aria-label="Toggle navigation">
+        <span class="navbar-toggler-icon"></span>
+      </button>
 
-        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#olmenu" aria-controls="olmenu" aria-expanded="false" aria-label="Toggle navigation">
-          <span class="navbar-toggler-icon"></span>
-        </button>
-
-        <!-- menu items that get hidden below 768px width -->
-        <nav class="collapse navbar-collapse" id="olmenu">
-          <ul class="navbar-nav ml-auto">
+      <!-- menu items that get hidden below 768px width -->
+      <nav class="collapse navbar-collapse" id="olmenu">
+        <ul class="navbar-nav ms-auto">
           <li class="nav-item dropdown">
-            <a class="nav-link dropdown-toggle" href="#" id="docdropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Docs</a>
-            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="docdropdown">
-              <a class="dropdown-item" href="/en/latest/doc/">Docs</a>
+            <a class="nav-link dropdown-toggle" href="#" id="docdropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Docs</a>
+            <div class="dropdown-menu dropdown-menu-end" aria-labelledby="docdropdown">
+              <a class="dropdown-item" href="/doc/">Docs</a>
               <div class="dropdown-divider"></div>
-                <a class="dropdown-item" href="../doc/quickstart.html"><i class="fa fa-check fa-fw mr-2 fa-lg"></i>Quick Start</a>
-                <a class="dropdown-item" href="../doc/faq.html"><i class="fa fa-question fa-fw mr-2 fa-lg"></i>FAQ</a>
-                <a class="dropdown-item" href="../doc/tutorials/"><i class="fa fa-book fa-fw mr-2 fa-lg"></i>Tutorials</a>
-                <a class="dropdown-item" href="/workshop/"><i class="fa fa-graduation-cap fa-fw mr-2 fa-lg"></i>Workshop</a>
+                <a class="dropdown-item" href="/doc/quickstart.html"><i class="fa fa-check fa-fw me-2 fa-lg"></i>Quick Start</a>
+                <a class="dropdown-item" href="/doc/faq.html"><i class="fa fa-question fa-fw me-2 fa-lg"></i>FAQ</a>
+                <a class="dropdown-item" href="/doc/tutorials/"><i class="fa fa-book fa-fw me-2 fa-lg"></i>Tutorials</a>
+                <a class="dropdown-item" href="/workshop/"><i class="fa fa-graduation-cap fa-fw me-2 fa-lg"></i>Workshop</a>
                 <div class="dropdown-divider"></div>
-                <a class="dropdown-item" href="https://stackoverflow.com/questions/tagged/openlayers"><i class="fa fa-stack-overflow fa-fw mr-2"></i>Ask a Question</a>
+                <a class="dropdown-item" href="https://stackoverflow.com/questions/tagged/openlayers"><i class="fab fa-stack-overflow fa-fw me-2"></i>Ask a Question</a>
             </div>
           </li>
           <li class="nav-item"><a class="nav-link" href="../examples/">Examples</a></li>
-          <li class="nav-item active"><a class="nav-link" href="../apidoc/"><i class="fa fa-sitemap mr-1"></i>API</a></li>
+          <li class="nav-item active"><a class="nav-link" href="../apidoc/"><i class="fa fa-sitemap me-1"></i>API</a></li>
           <li class="nav-item dropdown">
-            <a class="nav-link dropdown-toggle" href="#" id="codedropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Code</a>
-            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="codedropdown">
-              <a class="dropdown-item" href="https://github.com/openlayers/openlayers"><i class="fa fa-github fa-fw mr-2 fa-lg"></i>Repository</a>
-              <a class="dropdown-item" href="/download/"><i class="fa fa-download fa-fw mr-2 fa-lg"></i>Download</a>
+            <a class="nav-link dropdown-toggle" href="#" id="codedropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Code</a>
+            <div class="dropdown-menu dropdown-menu-end" aria-labelledby="codedropdown">
+              <a class="dropdown-item" href="https://github.com/openlayers/openlayers"><i class="fab fa-github fa-fw me-2 fa-lg"></i>Repository</a>
+              <a class="dropdown-item" href="/download/"><i class="fa fa-download fa-fw me-2 fa-lg"></i>Download</a>
             </div>
-           </li>
-          </ul>
-        </nav>
-      </header>
+          </li>
+        </ul>
+      </nav>
+    </header>
+
+    <div class="container-fluid">
       <div id="wrap" class="row">
-          <?js= this.navigationHtml ?>
-          <div class="main col-md-8 col-lg-9">
-              <h1 class="page-title" data-filename="<?js= filename ?>"><?js= title ?></h1>
-              <div id="latest-check" class="alert alert-warning alert-dismissible" role="alert" style="display:none">
-                <button id="latest-dismiss" type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                This documentation is for OpenLayers v<span id="package-version"><?js= version ?></span>. The <a id="latest-link" href="#" class="alert-link">latest</a> is v<span id="latest-version"></span>.
-              </div>
-              <?js= content ?>
+        <div class="navigation col-md-4 col-lg-3">
+          <div class="search-wrapper">
+            <div class="search">
+              <input id="search" type="text" autocomplete="off" class="form-control input-sm" placeholder="Search Documentation">
+            </div>
           </div>
+          <div class="navigation-list-wrapper">
+            <ul class="navigation-list search-empty"><?js
+              const item = this.navigationItems[docs[0].longname];
+              const listItem = item
+                ? this.partial('navigation.tmpl', {
+                    item: item,
+                    classes: ' toggle-manual toggle-manual-show',
+                  })
+                : '';
+              ?><?js= listItem ?>
+              <li class="loading">Loading …
+            </ul>
+          </div>
+        </div>
+
+        <div class="main col-md-8 col-lg-9">
+          <h1 class="page-title" data-filename="<?js= filename ?>"><?js= title ?></h1>
+          <div id="latest-check" class="alert alert-warning alert-dismissible" role="alert" style="display:none">
+            <button id="latest-dismiss" type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+            This documentation is for OpenLayers v<span id="package-version"><?js= version ?></span>. The <a id="latest-link" href="#" class="alert-link">latest</a> is v<span id="latest-version"></span>.
+          </div>
+          <?js= content ?>
+        </div>
       </div>
-      <script>prettyPrint();</script>
-      <script src="scripts/linenumber.js"></script>
-      <script src="scripts/main.js"></script>
     </div>
+    <script>prettyPrint();</script>
+    <script src="scripts/linenumber.js"></script>
+    <script src="scripts/main.js"></script>
   </body>
 </html>

config/jsdoc/api/template/tmpl/members.tmpl

@@ -5,7 +5,7 @@ var typeSignature = '';
 
 if (data.type && data.type.names) {
     data.type.names.forEach(function (name) {
-        typeSignature += '<span class="type-signature type ' + name.toLowerCase() + '">{' + self.linkto(name, self.htmlsafe(name)) + '}</span> ';
+        typeSignature += '<span class="type-signature type ' + name.toLowerCase() + '">{' + self.linkto(name) + '}</span> ';
     });
 }
 ?>
@@ -14,7 +14,7 @@ if (data.type && data.type.names) {
         <div class="anchor" id="<?js= id ?>">
         </div>
         <h4 class="name">
-            <?js= data.attribs + (data.scope === 'static' ? longname : name.indexOf('module:') === 0 ? name.split('/').pop() : name)  + typeSignature ?>
+            <?js= data.attribs + (data.scope === 'static' ? longname : name.startsWith('module:') ? name.split('/').pop() : name)  + typeSignature ?>
             <?js= this.partial('stability.tmpl', data) ?>
         </h4>
     </div>

config/jsdoc/api/template/tmpl/method.tmpl

@@ -14,7 +14,7 @@ if (/-dev$/.test(version)) {
         <div class="anchor" id="<?js= id ?>">
         </div>
         <h4 class="name">
-            <?js= data.attribs + (kind === 'class' ? 'new ' : '') + (data.scope === 'static' ? longname : name) + (kind !== 'event' ? data.signature : '') ?>
+            <?js= data.attribs + (kind === 'class' ? 'new ' : '') + this.getShortName(longname) + (kind !== 'event' ? data.signature : '') ?>
             <?js if (data.inherited || data.inherits) { ?>
                 <span class="inherited"><?js= this.linkto(data.inherits, 'inherited') ?></span>
             <?js } ?>
@@ -34,8 +34,9 @@ if (/-dev$/.test(version)) {
 </dt>
 <dd class="<?js= (data.stability && data.stability !== 'stable') ? 'unstable' : '' ?>">
 
-<?js if (data.parent && data.parent.kind == 'module' && data.parent.name.split('ol/').length < 3) { ?>
-  <pre class="prettyprint source"><code>import {<?js= data.name ?>} from '<?js= data.parent.name ?>';</code></pre>
+<?js if (data.parent && data.parent.kind == 'module') { ?>
+    <?js const importName = data.isDefaultExport ? data.name : `{${data.name}}`; ?>
+    <pre class="prettyprint source"><code>import <?js= importName ?> from '<?js= data.parent.name ?>';</code></pre>
 <?js } ?>
 
     <?js if (data.description) { ?>
@@ -55,7 +56,7 @@ if (/-dev$/.test(version)) {
 
     <?js if (data['this']) { ?>
         <h5>This:</h5>
-        <ul><li><?js= this.linkto(data['this'], data['this']) ?></li></ul>
+        <ul><li><?js= this.linkto(data['this']) ?></li></ul>
     <?js } ?>
 
     <?js if (data.stability || kind !== 'class') { ?>

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

@@ -2,7 +2,7 @@
 var self = this;
 
 function toShortName(name) {
-    return name.indexOf('module:') === 0 ? name.split('/').pop() : name;
+    return name.startsWith('module:') ? name.split('/').pop() : name;
 }
 
 function getItemCssClass(type) {
@@ -16,12 +16,12 @@ function getItemCssClass(type) {
 
 const printListItem = (member) => {
     const shortName = toShortName(member.name); ?>
-                    <li data-name="<?js= shortName.toLowerCase() ?>"><?js= self.linkto(member.longname, shortName) ?><?js
+            <li data-name="<?js= shortName.toLowerCase() ?>"><?js= self.linkto(member.longname, shortName) ?><?js
 };
 const printListItemWithStability = (member) => {
     const shortName = toShortName(member.name);
     const cls = member.stability && member.stability !== 'stable' ? ' class="unstable"' : ''; ?>
-                    <li data-name="<?js= shortName.toLowerCase() ?>"<?js= cls ?>><?js= self.linkto(member.longname, shortName) ?><?js
+            <li data-name="<?js= shortName.toLowerCase() ?>"<?js= cls ?>><?js= self.linkto(member.longname, shortName) ?><?js
 };
 const printFiresListItem = (eventName) => {
     const ancestor = self.find({longname: eventName})[0] ||
@@ -32,43 +32,28 @@ const printFiresListItem = (eventName) => {
     } else {
         const cls = ancestor.stability && ancestor.stability !== 'stable' ? ' class="unstable"' : '';
         const shortName = toShortName(ancestor.name); ?>
-                    <li data-name="<?js= shortName.toLowerCase() ?>"<?js= cls ?>><?js= shortName ?><?js
+            <li data-name="<?js= shortName.toLowerCase() ?>"<?js= cls ?>><?js= shortName ?><?js
     }
 };
 
 function listContent(item, title, listItemPrinter) {
     const type = title.toLowerCase();
     if (item[type] && item[type].length) { ?>
-            <div class="member-list" data-type="<?js= type ?>">
-                <span class="subtitle"><?js= title ?></span>
-                <ul><?js
-        item[type].forEach(function (v) {
-            listItemPrinter(v);
-         }); ?>
-                </ul>
-            </div><?js
-    }
-}
-?>
-<div class="navigation col-md-4 col-lg-3">
-    <div class="search-wrapper">
-        <div class="search">
-            <input id="search" type="text" autocomplete="off" class="form-control input-sm" placeholder="Search Documentation">
-        </div>
-    </div>
-    <div class="navigation-list-wrapper">
-        <ul class="navigation-list search-empty"><?js
-            this.nav.forEach(function (item) { ?>
-            <li class="item item-<?js= item.type ?>" data-longname="<?js= item.longname ?>" data-name="<?js= item.prettyname.toLowerCase() ?>">
-                <span class="title toggle">
-                    <span class="fa <?js= getItemCssClass(item.type) ?> mr-2 mt-1"></span>
-                    <span><?js= self.linkto(item.longname, item.prettyname.replace(/[.~\/]/g, '\u200b$&')) ?></span>
-                </span><?js
-                    listContent(item, 'Members', printListItem);
-                    listContent(item, 'Typedefs', printListItemWithStability);
-                    listContent(item, 'Methods', printListItemWithStability);
-                    listContent(item, 'Fires', printFiresListItem);
-            }); ?>
+    <div class="member-list" data-type="<?js= type ?>">
+        <span class="subtitle"><?js= title ?></span>
+        <ul><?js
+        item[type].forEach((v) => listItemPrinter(v)); ?>
         </ul>
-    </div>
-</div>
+    </div><?js
+    }
+} ?>
+<li class="item item-<?js= item.type ?><?js= obj.classes || '' ?>" data-longname="<?js= item.longname ?>" data-name="<?js= item.prettyname.toLowerCase() ?>">
+    <span class="title toggle">
+        <span class="fa <?js= getItemCssClass(item.type) ?> me-2 mt-1"></span>
+        <span><?js= self.linkto(item.longname, item.prettyname.replace(/[.~\/]/g, '\u200b$&')) ?></span>
+    </span><?js
+listContent(item, 'Members', printListItem);
+listContent(item, 'Typedefs', printListItemWithStability);
+listContent(item, 'Methods', printListItemWithStability);
+listContent(item, 'Fires', printFiresListItem);
+?>

config/jsdoc/api/template/tmpl/observables.tmpl

@@ -8,7 +8,7 @@
     <th>Name</th>
     <th>Type</th>
     <th>Settable</th>
-    <th><a href="module-ol_Object.ObjectEvent.html">ol/Object.ObjectEvent</a> type</th>
+    <th><a href="module-ol_Object.ObjectEvent.html">ObjectEvent</a> type</th>
     <th class="last">Description</th>
   </tr>
   </thead>

config/jsdoc/api/template/tmpl/params.tmpl

@@ -5,7 +5,7 @@
     var parentParam = null;
     params.forEach(function(param, i) {
         if (!param) { return; }
-        if ( parentParam && param.name && param.name.indexOf(parentParam.name + '.') === 0 ) {
+        if (parentParam && param.name && param.name.startsWith(parentParam.name + '.')) {
             param.name = param.name.substr(parentParam.name.length+1);
             parentParam.subparams = parentParam.subparams || [];
             parentParam.subparams.push(param);
@@ -23,10 +23,10 @@
     var colspan = 2;
     params.forEach(function(param) {
         if (!param) { return; }
-        if (param.type && param.type.names && param.type.names.indexOf('undefined') !== -1) {
+        if (param.type && param.type.names && param.type.names.includes('undefined')) {
             param.optional = true;
         }
-        if (param.name.indexOf('var_') == 0) {
+        if (param.name.startsWith('var_')) {
             params.hasAttributes = true;
             param.variable = true;
         }
@@ -58,19 +58,35 @@
 	<tbody>
 	<?js
         var self = this;
+
+        if (params[0].name === 'options' && params[0].subparams) {
+            var onlyOptions = true;
+            for (var i = 1; i < params.length; ++i) {
+                if (params[i]) {
+                    onlyOptions = false;
+                    break;
+                }
+            }
+            if (onlyOptions) {
+                var hasName = params.hasName;
+                params = params[0].subparams;
+                params.hasName = hasName;
+            }
+        }
+
 	    params.forEach(function(param) {
 	        if (!param) { return; }
 	?>
 
         <tr class="<?js= (param.stability && param.stability !== 'stable') ? 'unstable' : '' ?>">
             <?js if (params.hasName) {?>
-                <td class="name"><code><?js= param.name.replace(/^opt_/, "") ?></code></td>
+                <td class="name"><code><?js= param.name ?></code></td>
             <?js } ?>
 
             <?js if (!param.subparams) {?>
             <td class="type">
             <?js if (param.type && param.type.names) {?>
-                <?js= self.partial('type.tmpl', param.type.names) + (param.optional && typeof param.defaultvalue === 'undefined' && param.type.names.indexOf('undefined') === -1 ? ' | undefined' : '') ?>
+                <?js= self.partial('type.tmpl', param.type.names) + (param.optional && typeof param.defaultvalue === 'undefined' && !param.type.names.includes('undefined') ? ' | undefined' : '') ?>
                 <?js if (typeof param.defaultvalue !== 'undefined') { ?>
                     (defaults to <?js= self.htmlsafe(param.defaultvalue) ?>)
                 <?js } ?>

config/jsdoc/api/template/tmpl/properties.tmpl

@@ -5,7 +5,7 @@
     var parentProp = null;
     props.forEach(function(prop, i) {
         if (!prop) { return; }
-        if ( parentProp && prop.name && prop.name.indexOf(parentProp.name + '.') === 0 ) {
+        if (parentProp && prop.name && prop.name.startsWith(parentProp.name + '.')) {
             prop.name = prop.name.substr(parentProp.name.length+1);
             parentProp.subprops = parentProp.subprops || [];
             parentProp.subprops.push(prop);

config/jsdoc/api/template/tmpl/returns.tmpl

@@ -10,7 +10,7 @@ returns.forEach(function (ret, i) {
         var name = ret.name || ret.description;
         var startSpacePos = name.indexOf(" ");
 
-        if (parentReturn !== null && name.indexOf(parentReturn.name + '.') === 0) {
+        if (parentReturn !== null && name.startsWith(parentReturn.name + '.')) {
             ret.name = isNamed ? name.substr(parentReturn.name.length + 1) : name.substr(parentReturn.name.length + 1, startSpacePos - (parentReturn.name.length + 1));
 
             parentReturn.subReturns = parentReturn.subReturns || [];
@@ -52,7 +52,7 @@ if (returns.length > 1) {
             <?js
                 if (ret.type && ret.type.names) {
                     ret.type.names.forEach(function(name, i) { ?>
-                        <?js= self.linkto(name, self.htmlsafe(name)) ?>
+                        <?js= self.linkto(name) ?>
                         <?js if (i < ret.type.names.length-1) { ?> | <?js } ?>
                     <?js });
                 }

config/jsdoc/api/template/tmpl/type.tmpl

@@ -2,6 +2,6 @@
 	var data = obj;
     var self = this;
     data.forEach(function(name, i) { ?>
-<span class="param-type"><?js= self.linkto(name, self.htmlsafe(name)) ?></span>
+<span class="param-type"><?js= self.linkto(name) ?></span>
 <?js if (i < data.length-1) { ?>|<?js } ?>
 <?js }); ?>

config/jsdoc/info/publish.js

@@ -14,11 +14,7 @@ const path = require('path');
  */
 exports.publish = function (data, opts) {
   function getTypes(data) {
-    const types = [];
-    data.forEach(function (name) {
-      types.push(name.replace(/^function$/, 'Function'));
-    });
-    return types;
+    return data.map((name) => name.replace(/^function$/, 'Function'));
   }
 
   // get all doclets that have exports
@@ -34,7 +30,7 @@ exports.publish = function (data, opts) {
         return (
           this.meta &&
           this.meta.path &&
-          this.longname.indexOf('<anonymous>') !== 0 &&
+          !this.longname.startsWith('<anonymous>') &&
           this.longname !== 'module:ol'
         );
       },
@@ -59,7 +55,7 @@ exports.publish = function (data, opts) {
       if (
         constructor &&
         constructor.substr(-1) === '_' &&
-        constructor.indexOf('module:') === -1
+        !constructor.includes('module:')
       ) {
         assert.strictEqual(
           doc.inherited,

config/jsdoc/plugins/api.cjs

@@ -37,7 +37,7 @@ function includeAugments(doclet) {
   if (doclet.fires && cls.fires) {
     for (let i = 0, ii = cls.fires.length; i < ii; ++i) {
       const fires = cls.fires[i];
-      if (doclet.fires.indexOf(fires) == -1) {
+      if (!doclet.fires.includes(fires)) {
         doclet.fires.push(fires);
       }
     }
@@ -58,7 +58,7 @@ function includeAugments(doclet) {
             doclet.fires = [];
           }
           cls.fires.forEach(function (f) {
-            if (doclet.fires.indexOf(f) == -1) {
+            if (!doclet.fires.includes(f)) {
               doclet.fires.push(f);
             }
           });
@@ -68,7 +68,7 @@ function includeAugments(doclet) {
             doclet.observables = [];
           }
           cls.observables.forEach(function (f) {
-            if (doclet.observables.indexOf(f) == -1) {
+            if (!doclet.observables.includes(f)) {
               doclet.observables.push(f);
             }
           });
@@ -81,10 +81,10 @@ function includeAugments(doclet) {
 
 function extractTypes(item) {
   item.type.names.forEach(function (type) {
-    const match = type.match(/^(.*<)?([^>]*)>?$/);
+    const match = type.match(/^(?:.*<)?([^>]*)>?$/);
     if (match) {
-      modules[match[2]] = true;
-      types[match[2]] = true;
+      modules[match[1]] = true;
+      types[match[1]] = true;
     }
   });
 }

config/jsdoc/plugins/markdown.cjs

@@ -9,7 +9,7 @@
  * works around an issue with `~` characters in module paths by escaping them.
  */
 
-const marked = require('marked');
+const {marked} = require('marked');
 const format = require('util').format;
 
 const tags = [
@@ -76,7 +76,7 @@ function shouldProcessString(tagName, text) {
   let shouldProcess = true;
 
   // we only want to process `@author` and `@see` tags that contain Markdown links
-  if ((tagName === 'author' || tagName === 'see') && text.indexOf('[') === -1) {
+  if ((tagName === 'author' || tagName === 'see') && !text.includes('[')) {
     shouldProcess = false;
   }
 

config/jsdoc/plugins/observable.cjs

@@ -29,10 +29,10 @@ exports.handlers = {
         observable.name = name;
         observable.readonly =
           typeof observable.readonly == 'boolean' ? observable.readonly : true;
-        if (doclet.name.indexOf('get') === 0) {
+        if (doclet.name.startsWith('get')) {
           observable.type = doclet.returns[0].type;
           observable.description = doclet.returns[0].description;
-        } else if (doclet.name.indexOf('set') === 0) {
+        } else if (doclet.name.startsWith('set')) {
           observable.readonly = false;
         }
         if (doclet.stability) {
@@ -42,14 +42,14 @@ exports.handlers = {
           cls.observables = [];
         }
         observable = observables[doclet.observable];
-        if (observable.type && cls.observables.indexOf(observable) == -1) {
+        if (observable.type && !cls.observables.includes(observable)) {
           cls.observables.push(observable);
         }
         if (!cls.fires) {
           cls.fires = [];
         }
         event = 'module:ol/Object.ObjectEvent#event:change:' + name;
-        if (cls.fires.indexOf(event) == -1) {
+        if (!cls.fires.includes(event)) {
           cls.fires.push(event);
         }
       }

config/rollup-full-build.js

@@ -0,0 +1,24 @@
+import commonjs from '@rollup/plugin-commonjs';
+import externalGlobals from 'rollup-plugin-external-globals';
+import resolve from '@rollup/plugin-node-resolve';
+import {terser} from 'rollup-plugin-terser';
+
+export default {
+  input: 'build/index.js',
+  output: {
+    name: 'ol',
+    format: 'iife',
+    exports: 'default',
+    file: 'build/full/ol.js',
+    sourcemap: true,
+  },
+  plugins: [
+    resolve({moduleDirectories: ['build', 'node_modules']}),
+    commonjs(),
+    externalGlobals({
+      geotiff: 'GeoTIFF',
+      'ol-mapbox-style': 'olms',
+    }),
+    terser(),
+  ],
+};

config/tsconfig-build.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
     /* Basic Options */
-    "target": "ES5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
-    "module": "es2015",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
+    "target": "es2017",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */
+    "module": "es2020",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
     // "lib": [],                             /* Specify library files to be included in the compilation. */
     "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
@@ -51,14 +51,14 @@
     // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
     // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
     // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
-    "inlineSources": false                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
-
+    "inlineSources": false,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
+    "skipLibCheck": true
     /* Experimental Options */
     // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
     // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
   },
   "include": [
-    "../build/ol/src/**/*.js"
+    "../build/ol/**/*.js"
   ],
   "exclude": []
 }

config/webpack-config-legacy-build.mjs

@@ -1,56 +0,0 @@
-import TerserPlugin from 'terser-webpack-plugin';
-import path from 'path';
-
-export default {
-  entry: ['regenerator-runtime/runtime', './build/index.js'],
-  devtool: 'source-map',
-  mode: 'production',
-  target: ['web', 'es5'],
-  module: {
-    rules: [
-      {
-        test: /\.m?js$/,
-        use: {
-          loader: 'babel-loader',
-          options: {
-            presets: [
-              [
-                '@babel/preset-env',
-                {
-                  targets: 'last 2 versions, not dead',
-                },
-              ],
-            ],
-          },
-        },
-      },
-    ],
-  },
-  resolve: {
-    fallback: {
-      fs: false,
-      http: false,
-      https: false,
-    },
-    alias: {
-      ol: path.resolve('./build/ol'),
-    },
-  },
-  optimization: {
-    minimizer: [
-      new TerserPlugin({
-        terserOptions: {
-          // Mangle private members convention with underscore suffix
-          mangle: {properties: {regex: /_$/}},
-        },
-      }),
-    ],
-  },
-  output: {
-    path: path.resolve('./build/legacy'),
-    filename: 'ol.js',
-    library: 'ol',
-    libraryTarget: 'umd',
-    libraryExport: 'default',
-  },
-};

doc/quickstart.hbs

@@ -1,145 +0,0 @@
----
-title: Quick Start
-layout: doc.hbs
----
-
-# Quick Start
-
-This primer shows you how to put a simple map on a web page.
-
-**For production, we strongly recommend bundling the application together with its dependencies, as explained in the [Building an OpenLayers Application](./tutorials/bundle.html) tutorial.**
-
-
-## Put a map on a page
-
-Below you'll find a complete working example.  Create a new file, copy in the contents below, and open in a browser:
-
-```xml
-<!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 {
-        height: 400px;
-        width: 100%;
-      }
-    </style>
-    <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/{{ latest }}/build/ol.js"></script>
-    <title>OpenLayers example</title>
-  </head>
-  <body>
-    <h2>My Map</h2>
-    <div id="map" class="map"></div>
-    <script type="text/javascript">
-      var map = new ol.Map({
-        target: 'map',
-        layers: [
-          new ol.layer.Tile({
-            source: new ol.source.OSM()
-          })
-        ],
-        view: new ol.View({
-          center: ol.proj.fromLonLat([37.41, 8.82]),
-          zoom: 4
-        })
-      });
-    </script>
-  </body>
-</html>
-```
-
-## Understanding what is going on
-
-To include a map a web page you will need 3 things:
-
- 1. Include OpenLayers
- 2. `<div>` map container
- 3. JavaScript to create a simple map
-
-### Include OpenLayers
-
-```xml
-  <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/{{ latest }}/build/ol.js"></script>
-```
-
-The first part is to include the JavaScript library. For the purpose of this tutorial, here we simply point to the openlayers.org website to get the whole library. In a production environment, we would build a custom version of the library including only the module needed for our application.
-
-**Optional:** If the application is intended to run on old platforms like Internet Explorer or Android 4.x, another script needs to be included before OpenLayers:
-
-```xml
-  <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList"></script>
-```
-
-
-### `<div>` to contain the map
-
-```xml
-  <div id="map" class="map"></div>
-```
-
-The map in the application is contained in a [`<div>` HTML element](https://en.wikipedia.org/wiki/Span_and_div). Through this `<div>` the map properties like width, height and border can be controlled through CSS. Here's the CSS element used to make the map 400 pixels high and as wide as the browser window.
-
-```xml
-  <style>
-    .map {
-      height: 400px;
-      width: 100%;
-    }
-  </style>
-```
-
-### JavaScript to create a simple map
-
-```js
-  var map = new ol.Map({
-    target: 'map',
-    layers: [
-      new ol.layer.Tile({
-        source: new ol.source.OSM()
-      })
-    ],
-    view: new ol.View({
-      center: ol.proj.fromLonLat([37.41, 8.82]),
-      zoom: 4
-    })
-  });
-```
-
-With this JavaScript code, a map object is created with an OSM layer zoomed on the African East coast. Let's break this down:
-
-The following line creates an OpenLayers `Map` object. Just by itself, this does nothing since there's no layers or interaction attached to it.
-
-```js
-  var map = new ol.Map({ ... });
-```
-
-To attach the map object to the `<div>`, the map object takes a `target` into arguments. The value is the `id` of the `<div>`:
-
-```js
-    target: 'map'
-```
-
-The `layers: [ ... ]` array is used to define the list of layers available in the map. The first and only layer right now is a tiled layer:
-
-```js
-    layers: [
-      new ol.layer.Tile({
-        source: new ol.source.OSM()
-      })
-    ]
-```
-
-Layers in OpenLayers are defined with a type (Image, Tile or Vector) which contains a source. The source is the protocol used to get the map tiles.
-
-The next part of the `Map` object is the `View`. The view allows to specify the center, resolution, and rotation of the map. The simplest way to define a view is to define a center point and a zoom level.  Note that zoom level 0 is zoomed out.
-
-```js
-    view: new ol.View({
-      center: ol.proj.fromLonLat([37.41, 8.82]),
-      zoom: 4
-    })
-```
-
-You will notice that the `center` specified is in lon/lat coordinates (EPSG:4326). Since the only layer we use is in Spherical Mercator projection (EPSG:3857), we can reproject them on the fly to be able to zoom the map on the right coordinates.

doc/tutorials/bundle.md

@@ -1,30 +0,0 @@
----
-title: Basic project setup using NPM and Parcel
-layout: doc.hbs
----
-
-# Introduction
-
-Modern JavaScript works best when using and authoring modules. The recommended way of using OpenLayers is installing the [`ol`](https://npmjs.com/package/ol) package. This tutorial walks you through setting up a simple dev environment, which requires [node](https://nodejs.org) for everything to work.
-
-In this tutorial, we will be using [Parcel](https://parceljs.org) to bundle our application. There are several other options, some of which are linked from the [README](https://npmjs.com/package/ol).
-
-## Application setup
-
-Create a new empty directory for your project and navigate to it by running `mkdir new-project && cd new-project`. Initialize your project with
-
-    npx create-ol-app
-
-This will install the `ol` package, set up a development environment with additional dependencies, and give you an `index.html` and `main.js` starting point for your application.  By default, [Parcel](https://parceljs.org) will be used as a module loader and bundler.  See the [`create-ol-app`](https://github.com/openlayers/create-ol-app) documentation for details on using another bundler.
-
-To start the development server
-
-    npm start
-
-You can now visit http://localhost:1234/ to view your application.  Begin making changes to the `index.html` and `main.js` files to add additional functionality.
-
-To create a production bundle of your application, simply type
-
-    npm run build
-
-and copy the `dist/` folder to your production server.

examples/.eslintrc

@@ -2,17 +2,20 @@
   "globals": {
     "$": false,
     "arc": false,
+    "bootstrap": false,
+    "chroma": false,
     "common": false,
     "createMapboxStreetsV6Style": false,
     "d3": false,
-    "html2canvas": false,
     "geojsonvt": false,
     "gifler": false,
     "GyroNorm": false,
+    "html2canvas": false,
     "jspdf": false,
     "jsts": false,
     "JSZip": false,
     "mapboxgl": false,
+    "monotoneChainConvexHull": false,
     "NumpyLoader": false,
     "saveAs": false,
     "toastr": false,

examples/bing-maps.html

@@ -6,7 +6,7 @@ docs: >
   <p>When the Bing Maps tile service doesn't have tiles for a given resolution and region it returns "placeholder" tiles indicating that. Zoom the map beyond level 19 to see the "placeholder" tiles. If you want OpenLayers to display stretched tiles in place of "placeholder" tiles beyond zoom level 19 then set <code>maxZoom</code> to <code>19</code> in the options passed to <code>ol/source/BingMaps</code>.</p>
 tags: "bing, bing-maps"
 cloak:
-  - key: ApTJzdkyN1DdFKkRAE6QIDtzihNaf6IWJsT-nQ_2eMoO4PN__0Tzhl2-WgJtXFSp
+  - key: AlEoTLTlzFB6Uf4Sy-ugXcRO21skQO7K8eObA5_L-8d20rjqZJLs2nkO1RMjGSPN
     value: Your Bing Maps Key from https://www.bingmapsportal.com/ here
 ---
  <div id="map" class="map"></div>

examples/bing-maps.js

@@ -18,7 +18,7 @@ for (i = 0, ii = styles.length; i < ii; ++i) {
       visible: false,
       preload: Infinity,
       source: new BingMaps({
-        key: 'ApTJzdkyN1DdFKkRAE6QIDtzihNaf6IWJsT-nQ_2eMoO4PN__0Tzhl2-WgJtXFSp',
+        key: 'AlEoTLTlzFB6Uf4Sy-ugXcRO21skQO7K8eObA5_L-8d20rjqZJLs2nkO1RMjGSPN',
         imagerySet: styles[i],
         // use maxZoom 19 to see stretched tiles instead of the BingMaps
         // "no photos at this zoom level" tiles

examples/box-selection.css

@@ -1,4 +0,0 @@
-.ol-dragbox {
-  background-color: rgba(255,255,255,0.4);
-  border-color: rgba(100,150,0,1);
-}

examples/box-selection.html

@@ -9,4 +9,4 @@ docs: >
 tags: "DragBox, feature, selection, box"
 ---
 <div id="map" class="map"></div>
-<div id="info">No countries selected</div>
+<div>Selected regions: <span id="info">None</span></div>

examples/box-selection.js

@@ -1,23 +1,33 @@
 import GeoJSON from '../src/ol/format/GeoJSON.js';
 import Map from '../src/ol/Map.js';
+import VectorLayer from '../src/ol/layer/Vector.js';
+import VectorSource from '../src/ol/source/Vector.js';
 import View from '../src/ol/View.js';
 import {DragBox, Select} from '../src/ol/interaction.js';
-import {OSM, Vector as VectorSource} from '../src/ol/source.js';
-import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import {Fill, Stroke, Style} from '../src/ol/style.js';
 import {platformModifierKeyOnly} from '../src/ol/events/condition.js';
 
 const vectorSource = new VectorSource({
-  url: 'data/geojson/countries.geojson',
+  url: 'https://openlayers.org/data/vector/ecoregions.json',
   format: new GeoJSON(),
 });
 
+const style = new Style({
+  fill: new Fill({
+    color: '#eeeeee',
+  }),
+});
+
 const map = new Map({
   layers: [
-    new TileLayer({
-      source: new OSM(),
-    }),
     new VectorLayer({
       source: vectorSource,
+      background: '#1a2b39',
+      style: function (feature) {
+        const color = feature.get('COLOR_BIO') || '#eeeeee';
+        style.getFill().setColor(color);
+        return style;
+      },
     }),
   ],
   target: 'map',
@@ -28,8 +38,24 @@ const map = new Map({
   }),
 });
 
+const selectedStyle = new Style({
+  fill: new Fill({
+    color: 'rgba(255, 255, 255, 0.6)',
+  }),
+  stroke: new Stroke({
+    color: 'rgba(255, 255, 255, 0.7)',
+    width: 2,
+  }),
+});
+
 // a normal select interaction to handle click
-const select = new Select();
+const select = new Select({
+  style: function (feature) {
+    const color = feature.get('COLOR_BIO') || '#eeeeee';
+    selectedStyle.getFill().setColor(color);
+    return selectedStyle;
+  },
+});
 map.addInteraction(select);
 
 const selectedFeatures = select.getFeatures();
@@ -42,6 +68,11 @@ const dragBox = new DragBox({
 map.addInteraction(dragBox);
 
 dragBox.on('boxend', function () {
+  const extent = dragBox.getGeometry().getExtent();
+  const boxFeatures = vectorSource
+    .getFeaturesInExtent(extent)
+    .filter((feature) => feature.getGeometry().intersectsExtent(extent));
+
   // features that intersect the box geometry are added to the
   // collection of selected features
 
@@ -50,11 +81,6 @@ dragBox.on('boxend', function () {
   // be added directly to the collection
   const rotation = map.getView().getRotation();
   const oblique = rotation % (Math.PI / 2) !== 0;
-  const candidateFeatures = oblique ? [] : selectedFeatures;
-  const extent = dragBox.getGeometry().getExtent();
-  vectorSource.forEachFeatureIntersectingExtent(extent, function (feature) {
-    candidateFeatures.push(feature);
-  });
 
   // when the view is obliquely rotated the box extent will
   // exceed its geometry so both the box and the candidate
@@ -66,13 +92,15 @@ dragBox.on('boxend', function () {
     const geometry = dragBox.getGeometry().clone();
     geometry.rotate(-rotation, anchor);
     const extent = geometry.getExtent();
-    candidateFeatures.forEach(function (feature) {
+    boxFeatures.forEach(function (feature) {
       const geometry = feature.getGeometry().clone();
       geometry.rotate(-rotation, anchor);
       if (geometry.intersectsExtent(extent)) {
         selectedFeatures.push(feature);
       }
     });
+  } else {
+    selectedFeatures.extend(boxFeatures);
   }
 });
 
@@ -85,11 +113,11 @@ const infoBox = document.getElementById('info');
 
 selectedFeatures.on(['add', 'remove'], function () {
   const names = selectedFeatures.getArray().map(function (feature) {
-    return feature.get('name');
+    return feature.get('ECO_NAME');
   });
   if (names.length > 0) {
     infoBox.innerHTML = names.join(', ');
   } else {
-    infoBox.innerHTML = 'No countries selected';
+    infoBox.innerHTML = 'None';
   }
 });

examples/button-title.css

@@ -1,3 +0,0 @@
-.tooltip-inner {
-  white-space: nowrap;
-}

examples/button-title.html

@@ -3,12 +3,11 @@ layout: example.html
 title: Custom Tooltips
 shortdesc: This example shows how to customize the buttons tooltips with Bootstrap.
 docs: >
-  This example shows how to customize the buttons tooltips with <a href="https://getbootstrap.com/docs/4.5/components/tooltips/">Bootstrap</a>.
+  This example shows how to customize the buttons tooltips with <a href="https://getbootstrap.com/docs/5.2/components/tooltips/">Bootstrap</a>.
   For the tooltips to work in fullscreen mode, set the container property to a selector that matches the map target.
 tags: "custom, tooltip"
 resources:
-  - https://code.jquery.com/jquery-3.5.1.min.js
-  - https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css
-  - https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.bundle.min.js
+  - https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css
+  - https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js
 ---
 <div id="map" class="map"></div>

examples/button-title.js

@@ -17,11 +17,10 @@ const map = new Map({
   }),
 });
 
-$('.ol-zoom-in, .ol-zoom-out').tooltip({
-  placement: 'right',
-  container: '#map',
-});
-$('.ol-rotate-reset, .ol-attribution button[title]').tooltip({
-  placement: 'left',
-  container: '#map',
-});
+document
+  .querySelectorAll('.ol-zoom-in, .ol-zoom-out, .ol-rotate-reset')
+  .forEach(function (el) {
+    new bootstrap.Tooltip(el, {
+      container: '#map',
+    });
+  });

examples/canvas-gradient-pattern.html

@@ -1,13 +1,11 @@
 ---
 layout: example.html
 title: Styling feature with CanvasGradient or CanvasPattern
-shortdesc: Example showing the countries vector layer styled with patterns and gradients.
+shortdesc: Example showing a vector layer styled with a gradient.
 docs: >
-  This example creates a [`CanvasPattern`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern)
-  and a [`CanvasGradient`](https://developer.mozilla.org/en/docs/Web/API/CanvasGradient). The countries are loaded from
-  a GeoJSON file. A style function determines for each country whether to use a fill with the
-  CanvasGradient (rainbow colors) or a CanvasPattern (repeating stacked circles). **Note**: For seamless repeat patterns,
-  image width and height of the pattern image must be a factor of two (2, 4, 8, ..., 512).
+  This example creates a [`CanvasGradient`](https://developer.mozilla.org/en/docs/Web/API/CanvasGradient).
+  The vector data is loaded from a file and features are filled with the gradient.
+  The same technique can be used with a [`CanvasPattern`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasPattern).
 tags: "canvas, gradient, pattern, style"
 ---
 <div id="map" class="map"></div>

examples/canvas-gradient-pattern.js

@@ -1,90 +1,45 @@
-import GeoJSON from '../src/ol/format/GeoJSON.js';
+import KML from '../src/ol/format/KML.js';
 import Map from '../src/ol/Map.js';
 import VectorLayer from '../src/ol/layer/Vector.js';
 import VectorSource from '../src/ol/source/Vector.js';
 import View from '../src/ol/View.js';
 import {DEVICE_PIXEL_RATIO} from '../src/ol/has.js';
-import {Fill, Stroke, Style} from '../src/ol/style.js';
 import {fromLonLat} from '../src/ol/proj.js';
 
-const canvas = document.createElement('canvas');
-const context = canvas.getContext('2d');
-
 // Gradient and pattern are in canvas pixel space, so we adjust for the
 // renderer's pixel ratio
 const pixelRatio = DEVICE_PIXEL_RATIO;
 
 // Generate a rainbow gradient
-const gradient = (function () {
-  const grad = context.createLinearGradient(0, 0, 512 * pixelRatio, 0);
-  grad.addColorStop(0, 'red');
-  grad.addColorStop(1 / 6, 'orange');
-  grad.addColorStop(2 / 6, 'yellow');
-  grad.addColorStop(3 / 6, 'green');
-  grad.addColorStop(4 / 6, 'aqua');
-  grad.addColorStop(5 / 6, 'blue');
-  grad.addColorStop(1, 'purple');
-  return grad;
-})();
+const canvas = document.createElement('canvas');
+const context = canvas.getContext('2d');
+const gradient = context.createLinearGradient(0, 0, 1024 * pixelRatio, 0);
+gradient.addColorStop(0, 'red');
+gradient.addColorStop(1 / 6, 'orange');
+gradient.addColorStop(2 / 6, 'yellow');
+gradient.addColorStop(3 / 6, 'green');
+gradient.addColorStop(4 / 6, 'aqua');
+gradient.addColorStop(5 / 6, 'blue');
+gradient.addColorStop(1, 'purple');
 
-// Generate a canvasPattern with two circles on white background
-const pattern = (function () {
-  canvas.width = 8 * pixelRatio;
-  canvas.height = 8 * pixelRatio;
-  // white background
-  context.fillStyle = 'white';
-  context.fillRect(0, 0, canvas.width, canvas.height);
-  // outer circle
-  context.fillStyle = 'rgba(102, 0, 102, 0.5)';
-  context.beginPath();
-  context.arc(4 * pixelRatio, 4 * pixelRatio, 3 * pixelRatio, 0, 2 * Math.PI);
-  context.fill();
-  // inner circle
-  context.fillStyle = 'rgb(55, 0, 170)';
-  context.beginPath();
-  context.arc(4 * pixelRatio, 4 * pixelRatio, 1.5 * pixelRatio, 0, 2 * Math.PI);
-  context.fill();
-  return context.createPattern(canvas, 'repeat');
-})();
-
-// Generate style for gradient or pattern fill
-const fill = new Fill();
-const style = new Style({
-  fill: fill,
-  stroke: new Stroke({
-    color: '#333',
-    width: 2,
-  }),
-});
-
-/**
- * The styling function for the vector layer, will return an array of styles
- * which either contains the aboove gradient or pattern.
- *
- * @param {import("../src/ol/Feature.js").default} feature The feature to style.
- * @return {Style} The style to use for the feature.
- */
-const getStackedStyle = function (feature) {
-  const id = feature.getId();
-  fill.setColor(id > 'J' ? gradient : pattern);
-  return style;
-};
-
-// Create a vector layer that makes use of the style function above…
 const vectorLayer = new VectorLayer({
+  background: 'white',
   source: new VectorSource({
-    url: 'data/geojson/countries.geojson',
-    format: new GeoJSON(),
+    url: 'data/kml/states.kml',
+    format: new KML({extractStyles: false}),
   }),
-  style: getStackedStyle,
+  style: {
+    'fill-color': gradient,
+    'stroke-width': 1,
+    'stroke-color': '#333',
+  },
 });
 
-// … finally create a map with that layer.
 const map = new Map({
   layers: [vectorLayer],
   target: 'map',
   view: new View({
-    center: fromLonLat([16, 48]),
-    zoom: 3,
+    center: fromLonLat([-100, 38.5]),
+    zoom: 4,
   }),
 });

examples/cartodb.html

@@ -5,22 +5,21 @@ shortdesc: Example of a cartodb map.
 docs: >
   A simple example with an anonymous cartodb map
 tags: "simple, openstreetmap, attribution"
+resources:
+  - https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css
 ---
-<div class="row-fluid">
-  <div class="span12">
-    <div id="map" class="map"></div>
-    <div>
-    <form class="form-horizontal">
-      <label>
-        Show countries larger than
-        <select id="country-area" class="form-control">
-          <option value="0" default>0 ㎢</option>
-          <option value="5000">5000 ㎢</option>
-          <option value="10000">10000 ㎢</option>
-          <option value="50000">50000 ㎢</option>
-          <option value="100000">100000 ㎢</option>
-        </select>
-      </label>
-    </form>
+<div id="map" class="map"></div>
+<form class="row">
+  <div class="col-auto">
+    <div class="input-group">
+      <label for="country-area" class="input-group-text">Show european countries larger than</label>
+      <select id="country-area" class="form-select">
+        <option value="0" default>0 ㎢</option>
+        <option value="5000">5000 ㎢</option>
+        <option value="10000">10000 ㎢</option>
+        <option value="50000">50000 ㎢</option>
+        <option value="100000">100000 ㎢</option>
+      </select>
+    </div>
   </div>
-</div>
+</form>

examples/cartodb.js

@@ -10,17 +10,28 @@ const mapConfig = {
       'options': {
         'cartocss_version': '2.1.1',
         'cartocss': '#layer { polygon-fill: #F00; }',
-        'sql': 'select * from european_countries_e where area > 0',
       },
     },
   ],
 };
 
+function setArea(n) {
+  mapConfig.layers[0].options.sql =
+    'select * from european_countries_e where area > ' + n;
+}
+const areaSelect = document.getElementById('country-area');
+setArea(areaSelect.value);
+
 const cartoDBSource = new CartoDB({
   account: 'documentation',
   config: mapConfig,
 });
 
+areaSelect.addEventListener('change', function () {
+  setArea(this.value);
+  cartoDBSource.setConfig(mapConfig);
+});
+
 const map = new Map({
   layers: [
     new TileLayer({
@@ -32,17 +43,7 @@ const map = new Map({
   ],
   target: 'map',
   view: new View({
-    center: [0, 0],
+    center: [8500000, 8500000],
     zoom: 2,
   }),
 });
-
-function setArea(n) {
-  mapConfig.layers[0].options.sql =
-    'select * from european_countries_e where area > ' + n;
-  cartoDBSource.setConfig(mapConfig);
-}
-
-document.getElementById('country-area').addEventListener('change', function () {
-  setArea(this.value);
-});

examples/center.js

@@ -1,38 +1,27 @@
 import GeoJSON from '../src/ol/format/GeoJSON.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {Circle as CircleStyle, Fill, Stroke, Style} from '../src/ol/style.js';
 import {OSM, Vector as VectorSource} from '../src/ol/source.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
 
-/** @type {VectorSource<import("../src/ol/geom/SimpleGeometry.js").default>} */
 const source = new VectorSource({
   url: 'data/geojson/switzerland.geojson',
   format: new GeoJSON(),
 });
-const style = new Style({
-  fill: new Fill({
-    color: 'rgba(255, 255, 255, 0.6)',
-  }),
-  stroke: new Stroke({
-    color: '#319FD3',
-    width: 1,
-  }),
-  image: new CircleStyle({
-    radius: 5,
-    fill: new Fill({
-      color: 'rgba(255, 255, 255, 0.6)',
-    }),
-    stroke: new Stroke({
-      color: '#319FD3',
-      width: 1,
-    }),
-  }),
-});
+
 const vectorLayer = new VectorLayer({
   source: source,
-  style: style,
+  style: {
+    'fill-color': 'rgba(255, 255, 255, 0.6)',
+    'stroke-width': 1,
+    'stroke-color': '#319FD3',
+    'circle-radius': 5,
+    'circle-fill-color': 'rgba(255, 255, 255, 0.6)',
+    'circle-stroke-width': 1,
+    'circle-stroke-color': '#319FD3',
+  },
 });
+
 const view = new View({
   center: [0, 0],
   zoom: 1,

examples/chaikin.html

@@ -12,7 +12,7 @@ docs: >
 tags: "smooth, smoothing, chaikin"
 ---
 <div id="map" class="map"></div>
-<form class="form-inline">
+<form>
   <label for="shall-smoothen">Smooth drawn geometry?</label>
   <input id="shall-smoothen" type="checkbox" checked><br>
   <label for="iterations">Number of smoothings</label>

examples/cluster.html

@@ -5,19 +5,21 @@ shortdesc: Example of using ol/source/Cluster.
 docs: >
   This example shows how to do clustering on point features.
 tags: "cluster, vector"
+resources:
+  - https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css
 ---
 <div id="map" class="map"></div>
 <form>
   <div class="form-group">
-    <label for="distance" class="col-form-label">Cluster distance</label>
-    <input id="distance" class="form-control-range" type="range" min="0" max="200" step="1" value="40"/>
+    <label for="distance" class="col-form-label pb-0">Cluster distance</label>
+    <input id="distance" class="form-range" type="range" min="0" max="200" step="1" value="40"/>
     <small class="form-text text-muted">
       The distance within which features will be clustered together.
     </small>
   </div>
   <div class="form-group">
-    <label for="min-distance" class="col-form-label">Minimum distance</label>
-    <input id="min-distance" class="form-control-range" type="range" min="0" max="200" step="1" value="20"/>
+    <label for="min-distance" class="col-form-label pb-0">Minimum distance</label>
+    <input id="min-distance" class="form-range" type="range" min="0" max="200" step="1" value="20"/>
     <small class="form-text text-muted">
       The minimum distance between clusters. Can't be larger than the configured distance.
     </small>

examples/cluster.js

@@ -77,17 +77,13 @@ const map = new Map({
   }),
 });
 
-const distanceHandler = function () {
+distanceInput.addEventListener('input', function () {
   clusterSource.setDistance(parseInt(distanceInput.value, 10));
-};
-distanceInput.addEventListener('input', distanceHandler);
-distanceInput.addEventListener('change', distanceHandler);
+});
 
-const minDistanceHandler = function () {
+minDistanceInput.addEventListener('input', 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) => {

examples/clusters-dynamic.html

@@ -0,0 +1,16 @@
+---
+layout: example.html
+title: Dynamic clusters
+shortdesc: Clusters with zoom-to-cluster, hull view, and uncluttering of overlapping features.
+docs: >
+  <p>This example shows open data of subsidized photovoltaic installations in Vienna. Different style functions
+    are used for cluster display, single feature display, convex hull of a cluster, and an expanded view of
+    overlapping features. Hovering over a cluster shows its convex hull. Clicking on a cluster zooms to the
+    extent of the contained features. Clicking on a cluster consisting of features that are very close to each other reveals an expanded view
+    of the features, along a circle around the cluster.</p>
+  <p>Features are styled differently depending on the power of the photovoltaic installation.</p>
+tags: "marker, cluster, vector, style, convex hull"
+resources:
+  - https://unpkg.com/monotone-chain-convex-hull@1.0.0/lib/index.js
+---
+<div id="map" class="map"></div>

examples/clusters-dynamic.js

@@ -0,0 +1,278 @@
+import Feature from '../src/ol/Feature.js';
+import GeoJSON from '../src/ol/format/GeoJSON.js';
+import Map from '../src/ol/Map.js';
+import View from '../src/ol/View.js';
+import {
+  Circle as CircleStyle,
+  Fill,
+  Icon,
+  Stroke,
+  Style,
+  Text,
+} from '../src/ol/style.js';
+import {Cluster, Vector as VectorSource, XYZ} from '../src/ol/source.js';
+import {LineString, Point, Polygon} from '../src/ol/geom.js';
+import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import {createEmpty, extend, getWidth} from '../src/ol/extent.js';
+import {fromLonLat} from '../src/ol/proj.js';
+
+const circleDistanceMultiplier = 1;
+const circleFootSeparation = 28;
+const circleStartAngle = Math.PI / 2;
+
+const convexHullFill = new Fill({
+  color: 'rgba(255, 153, 0, 0.4)',
+});
+const convexHullStroke = new Stroke({
+  color: 'rgba(204, 85, 0, 1)',
+  width: 1.5,
+});
+const outerCircleFill = new Fill({
+  color: 'rgba(255, 153, 102, 0.3)',
+});
+const innerCircleFill = new Fill({
+  color: 'rgba(255, 165, 0, 0.7)',
+});
+const textFill = new Fill({
+  color: '#fff',
+});
+const textStroke = new Stroke({
+  color: 'rgba(0, 0, 0, 0.6)',
+  width: 3,
+});
+const innerCircle = new CircleStyle({
+  radius: 14,
+  fill: innerCircleFill,
+});
+const outerCircle = new CircleStyle({
+  radius: 20,
+  fill: outerCircleFill,
+});
+const darkIcon = new Icon({
+  src: 'data/icons/emoticon-cool.svg',
+});
+const lightIcon = new Icon({
+  src: 'data/icons/emoticon-cool-outline.svg',
+});
+
+/**
+ * Single feature style, users for clusters with 1 feature and cluster circles.
+ * @param {Feature} clusterMember A feature from a cluster.
+ * @return {Style} An icon style for the cluster member's location.
+ */
+function clusterMemberStyle(clusterMember) {
+  return new Style({
+    geometry: clusterMember.getGeometry(),
+    image: clusterMember.get('LEISTUNG') > 5 ? darkIcon : lightIcon,
+  });
+}
+
+let clickFeature, clickResolution;
+/**
+ * Style for clusters with features that are too close to each other, activated on click.
+ * @param {Feature} cluster A cluster with overlapping members.
+ * @param {number} resolution The current view resolution.
+ * @return {Style} A style to render an expanded view of the cluster members.
+ */
+function clusterCircleStyle(cluster, resolution) {
+  if (cluster !== clickFeature || resolution !== clickResolution) {
+    return;
+  }
+  const clusterMembers = cluster.get('features');
+  const centerCoordinates = cluster.getGeometry().getCoordinates();
+  return generatePointsCircle(
+    clusterMembers.length,
+    cluster.getGeometry().getCoordinates(),
+    resolution
+  ).reduce((styles, coordinates, i) => {
+    const point = new Point(coordinates);
+    const line = new LineString([centerCoordinates, coordinates]);
+    styles.unshift(
+      new Style({
+        geometry: line,
+        stroke: convexHullStroke,
+      })
+    );
+    styles.push(
+      clusterMemberStyle(
+        new Feature({
+          ...clusterMembers[i].getProperties(),
+          geometry: point,
+        })
+      )
+    );
+    return styles;
+  }, []);
+}
+
+/**
+ * From
+ * https://github.com/Leaflet/Leaflet.markercluster/blob/31360f2/src/MarkerCluster.Spiderfier.js#L55-L72
+ * Arranges points in a circle around the cluster center, with a line pointing from the center to
+ * each point.
+ * @param {number} count Number of cluster members.
+ * @param {Array<number>} clusterCenter Center coordinate of the cluster.
+ * @param {number} resolution Current view resolution.
+ * @return {Array<Array<number>>} An array of coordinates representing the cluster members.
+ */
+function generatePointsCircle(count, clusterCenter, resolution) {
+  const circumference =
+    circleDistanceMultiplier * circleFootSeparation * (2 + count);
+  let legLength = circumference / (Math.PI * 2); //radius from circumference
+  const angleStep = (Math.PI * 2) / count;
+  const res = [];
+  let angle;
+
+  legLength = Math.max(legLength, 35) * resolution; // Minimum distance to get outside the cluster icon.
+
+  for (let i = 0; i < count; ++i) {
+    // Clockwise, like spiral.
+    angle = circleStartAngle + i * angleStep;
+    res.push([
+      clusterCenter[0] + legLength * Math.cos(angle),
+      clusterCenter[1] + legLength * Math.sin(angle),
+    ]);
+  }
+
+  return res;
+}
+
+let hoverFeature;
+/**
+ * Style for convex hulls of clusters, activated on hover.
+ * @param {Feature} cluster The cluster feature.
+ * @return {Style} Polygon style for the convex hull of the cluster.
+ */
+function clusterHullStyle(cluster) {
+  if (cluster !== hoverFeature) {
+    return;
+  }
+  const originalFeatures = cluster.get('features');
+  const points = originalFeatures.map((feature) =>
+    feature.getGeometry().getCoordinates()
+  );
+  return new Style({
+    geometry: new Polygon([monotoneChainConvexHull(points)]),
+    fill: convexHullFill,
+    stroke: convexHullStroke,
+  });
+}
+
+function clusterStyle(feature) {
+  const size = feature.get('features').length;
+  if (size > 1) {
+    return [
+      new Style({
+        image: outerCircle,
+      }),
+      new Style({
+        image: innerCircle,
+        text: new Text({
+          text: size.toString(),
+          fill: textFill,
+          stroke: textStroke,
+        }),
+      }),
+    ];
+  } else {
+    const originalFeature = feature.get('features')[0];
+    return clusterMemberStyle(originalFeature);
+  }
+}
+
+const vectorSource = new VectorSource({
+  format: new GeoJSON(),
+  url: 'data/geojson/photovoltaic.json',
+});
+
+const clusterSource = new Cluster({
+  attributions:
+    'Data: <a href="https://www.data.gv.at/auftritte/?organisation=stadt-wien">Stadt Wien</a>',
+  distance: 35,
+  source: vectorSource,
+});
+
+// Layer displaying the convex hull of the hovered cluster.
+const clusterHulls = new VectorLayer({
+  source: clusterSource,
+  style: clusterHullStyle,
+});
+
+// Layer displaying the clusters and individual features.
+const clusters = new VectorLayer({
+  source: clusterSource,
+  style: clusterStyle,
+});
+
+// Layer displaying the expanded view of overlapping cluster members.
+const clusterCircles = new VectorLayer({
+  source: clusterSource,
+  style: clusterCircleStyle,
+});
+
+const raster = new TileLayer({
+  source: new XYZ({
+    attributions:
+      'Base map: <a target="_blank" href="https://basemap.at/">basemap.at</a>',
+    url: 'https://maps{1-4}.wien.gv.at/basemap/bmapgrau/normal/google3857/{z}/{y}/{x}.png',
+  }),
+});
+
+const map = new Map({
+  layers: [raster, clusterHulls, clusters, clusterCircles],
+  target: 'map',
+  view: new View({
+    center: [0, 0],
+    zoom: 2,
+    maxZoom: 19,
+    extent: [
+      ...fromLonLat([16.1793, 48.1124]),
+      ...fromLonLat([16.5559, 48.313]),
+    ],
+    showFullExtent: true,
+  }),
+});
+
+map.on('pointermove', (event) => {
+  clusters.getFeatures(event.pixel).then((features) => {
+    if (features[0] !== hoverFeature) {
+      // Display the convex hull on hover.
+      hoverFeature = features[0];
+      clusterHulls.setStyle(clusterHullStyle);
+      // Change the cursor style to indicate that the cluster is clickable.
+      map.getTargetElement().style.cursor =
+        hoverFeature && hoverFeature.get('features').length > 1
+          ? 'pointer'
+          : '';
+    }
+  });
+});
+
+map.on('click', (event) => {
+  clusters.getFeatures(event.pixel).then((features) => {
+    if (features.length > 0) {
+      const clusterMembers = features[0].get('features');
+      if (clusterMembers.length > 1) {
+        // Calculate the extent of the cluster members.
+        const extent = createEmpty();
+        clusterMembers.forEach((feature) =>
+          extend(extent, feature.getGeometry().getExtent())
+        );
+        const view = map.getView();
+        const resolution = map.getView().getResolution();
+        if (
+          view.getZoom() === view.getMaxZoom() ||
+          (getWidth(extent) < resolution && getWidth(extent) < resolution)
+        ) {
+          // Show an expanded view of the cluster members.
+          clickFeature = features[0];
+          clickResolution = resolution;
+          clusterCircles.setStyle(clusterCircleStyle);
+        } else {
+          // Zoom to the extent of the cluster members.
+          view.fit(extent, {duration: 500, padding: [50, 50, 50, 50]});
+        }
+      }
+    }
+  });
+});

examples/cog-blob.html

@@ -0,0 +1,10 @@
+---
+layout: example.html
+title: Cloud Optimized GeoTIFF (COG) from a Blob
+shortdesc: Rendering a COG as a tiled layer from a Blob.
+docs: >
+  Tiled data from a Cloud Optimized GeoTIFF (COG) can be rendered as a layer.  In this
+  example, a single 3-band GeoTIFF is used to render RGB data from a Blob.
+tags: "cog"
+---
+<div id="map" class="map"></div>

examples/cog-blob.js

@@ -0,0 +1,28 @@
+import GeoTIFF from '../src/ol/source/GeoTIFF.js';
+import Map from '../src/ol/Map.js';
+import TileLayer from '../src/ol/layer/WebGLTile.js';
+
+fetch('data/example.tif')
+  .then((response) => response.blob())
+  .then((blob) => {
+    const source = new GeoTIFF({
+      sources: [
+        {
+          blob: blob,
+        },
+      ],
+    });
+
+    const map = new Map({
+      target: 'map',
+      layers: [
+        new TileLayer({
+          source: source,
+        }),
+      ],
+      view: source.getView().then((viewConfig) => {
+        viewConfig.showFullExtent = true;
+        return viewConfig;
+      }),
+    });
+  });

examples/cog-colors.css

@@ -0,0 +1,10 @@
+.data {
+  text-align: right;
+  font-family: monospace;
+}
+td {
+  padding-right: 10px;
+}
+input[type="range"] {
+  vertical-align: text-bottom;
+}

examples/cog-colors.html

@@ -0,0 +1,32 @@
+---
+layout: example.html
+title: NDVI with a Dynamic Color Ramp
+shortdesc: NDVI from a COG with a dynamic color ramp
+docs: >
+  The GeoTIFF layer in this example draws from two Sentinel 2 sources: a red band and a near infrared band.
+  The layer style includes a `color` expression that calculates the Normalized Difference Vegetation Index (NDVI)
+  from values in the two bands.  The `interpolate` expression is used to map NDVI values to colors.  The "stop" values
+  for the color ramp are derived from application provided style variables.  Using the inputs above, the min and max
+  colors and values can be adjusted.  The `layer.updateStyleVariables()` method is called to update the
+  variables used in the interpolated color expression.
+tags: "cog, ndvi"
+resources:
+  - https://cdnjs.cloudflare.com/ajax/libs/chroma-js/2.1.2/chroma.min.js
+---
+<div id="map" class="map"></div>
+<table>
+  <tbody>
+    <tr>
+      <td>Min NDVI</td>
+      <td><input type="range" id="min-value-input" min="-1.0" max="-0.1" step="0.01"></td>
+      <td class="data" id="min-value-output"></td>
+      <td><input type="color" id="min-color"></td>
+    </tr>
+    <tr>
+      <td>Max NDVI</td>
+      <td><input type="range" id="max-value-input" min="0.1" max="1.0" step="0.01"></td>
+      <td class="data" id="max-value-output"></td>
+      <td><input type="color" id="max-color"></td>
+    </tr>
+  </tbody>
+</table>

examples/cog-colors.js

@@ -0,0 +1,106 @@
+import GeoTIFF from '../src/ol/source/GeoTIFF.js';
+import Map from '../src/ol/Map.js';
+import TileLayer from '../src/ol/layer/WebGLTile.js';
+
+const segments = 10;
+
+const defaultMinColor = '#0300AD';
+const defaultMaxColor = '#00ff00';
+
+const defaultMinValue = -0.5;
+const defaultMaxValue = 0.7;
+
+const minColorInput = document.getElementById('min-color');
+minColorInput.value = defaultMinColor;
+
+const maxColorInput = document.getElementById('max-color');
+maxColorInput.value = defaultMaxColor;
+
+const minValueOutput = document.getElementById('min-value-output');
+const minValueInput = document.getElementById('min-value-input');
+minValueInput.value = defaultMinValue.toString();
+
+const maxValueOutput = document.getElementById('max-value-output');
+const maxValueInput = document.getElementById('max-value-input');
+maxValueInput.value = defaultMaxValue.toString();
+
+function getVariables() {
+  const variables = {};
+
+  const minColor = minColorInput.value;
+  const maxColor = maxColorInput.value;
+  const scale = chroma.scale([minColor, maxColor]).mode('lab');
+
+  const minValue = parseFloat(minValueInput.value);
+  const maxValue = parseFloat(maxValueInput.value);
+  const delta = (maxValue - minValue) / segments;
+
+  for (let i = 0; i <= segments; ++i) {
+    const color = scale(i / segments).rgb();
+    const value = minValue + i * delta;
+    variables[`value${i}`] = value;
+    variables[`red${i}`] = color[0];
+    variables[`green${i}`] = color[1];
+    variables[`blue${i}`] = color[2];
+  }
+  return variables;
+}
+
+function colors() {
+  const stops = [];
+  for (let i = 0; i <= segments; ++i) {
+    stops[i * 2] = ['var', `value${i}`];
+    const red = ['var', `red${i}`];
+    const green = ['var', `green${i}`];
+    const blue = ['var', `blue${i}`];
+    stops[i * 2 + 1] = ['color', red, green, blue];
+  }
+  return stops;
+}
+
+const ndvi = [
+  '/',
+  ['-', ['band', 2], ['band', 1]],
+  ['+', ['band', 2], ['band', 1]],
+];
+
+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 layer = new TileLayer({
+  style: {
+    variables: getVariables(),
+    color: ['interpolate', ['linear'], ndvi, ...colors()],
+  },
+  source: source,
+});
+
+function update() {
+  layer.updateStyleVariables(getVariables());
+  minValueOutput.innerText = parseFloat(minValueInput.value).toFixed(1);
+  maxValueOutput.innerText = parseFloat(maxValueInput.value).toFixed(1);
+}
+
+minColorInput.addEventListener('input', update);
+maxColorInput.addEventListener('input', update);
+minValueInput.addEventListener('input', update);
+maxValueInput.addEventListener('input', update);
+update();
+
+const map = new Map({
+  target: 'map',
+  layers: [layer],
+  view: source.getView(),
+});

examples/cog-math.html

@@ -3,9 +3,12 @@ layout: example.html
 title: NDVI from a Sentinel 2 COG
 shortdesc: Calculating NDVI and applying a custom color map.
 docs: >
-  The GeoTIFF layer in this example draws from two Sentinel 2 sources: a red band and a near infrared band.
+  The GeoTIFF layer in this example draws from two Sentinel 2 sources: a red band and a near-infrared band.
   The layer style includes a `color` expression that calculates the Normalized Difference Vegetation Index (NDVI)
   from values in the two bands.  The `interpolate` expression is used to map NDVI values to colors.
+  The `layer.getData()` method can be used to retrieve pixel values from the GeoTIFF.  Move your mouse
+  or tap on the map to see calculated NDVI values based on the red and near-infrared pixel values.
 tags: "cog, ndvi"
 ---
 <div id="map" class="map"></div>
+<div>NDVI: <span id="output"></span></div>

examples/cog-math.js

@@ -17,65 +17,74 @@ const source = new GeoTIFF({
   ],
 });
 
+const layer = new TileLayer({
+  style: {
+    color: [
+      'interpolate',
+      ['linear'],
+      // calculate NDVI, bands come from the sources below
+      ['/', ['-', ['band', 2], ['band', 1]], ['+', ['band', 2], ['band', 1]]],
+      // color ramp for NDVI values, ranging from -1 to 1
+      -0.2,
+      [191, 191, 191],
+      -0.1,
+      [219, 219, 219],
+      0,
+      [255, 255, 224],
+      0.025,
+      [255, 250, 204],
+      0.05,
+      [237, 232, 181],
+      0.075,
+      [222, 217, 156],
+      0.1,
+      [204, 199, 130],
+      0.125,
+      [189, 184, 107],
+      0.15,
+      [176, 194, 97],
+      0.175,
+      [163, 204, 89],
+      0.2,
+      [145, 191, 82],
+      0.25,
+      [128, 179, 71],
+      0.3,
+      [112, 163, 64],
+      0.35,
+      [97, 150, 54],
+      0.4,
+      [79, 138, 46],
+      0.45,
+      [64, 125, 36],
+      0.5,
+      [48, 110, 28],
+      0.55,
+      [33, 97, 18],
+      0.6,
+      [15, 84, 10],
+      0.65,
+      [0, 69, 0],
+    ],
+  },
+  source: source,
+});
+
 const map = new Map({
   target: 'map',
-  layers: [
-    new TileLayer({
-      style: {
-        color: [
-          'interpolate',
-          ['linear'],
-          // calculate NDVI, bands come from the sources below
-          [
-            '/',
-            ['-', ['band', 2], ['band', 1]],
-            ['+', ['band', 2], ['band', 1]],
-          ],
-          // color ramp for NDVI values, ranging from -1 to 1
-          -0.2,
-          [191, 191, 191],
-          -0.1,
-          [219, 219, 219],
-          0,
-          [255, 255, 224],
-          0.025,
-          [255, 250, 204],
-          0.05,
-          [237, 232, 181],
-          0.075,
-          [222, 217, 156],
-          0.1,
-          [204, 199, 130],
-          0.125,
-          [189, 184, 107],
-          0.15,
-          [176, 194, 97],
-          0.175,
-          [163, 204, 89],
-          0.2,
-          [145, 191, 82],
-          0.25,
-          [128, 179, 71],
-          0.3,
-          [112, 163, 64],
-          0.35,
-          [97, 150, 54],
-          0.4,
-          [79, 138, 46],
-          0.45,
-          [64, 125, 36],
-          0.5,
-          [48, 110, 28],
-          0.55,
-          [33, 97, 18],
-          0.6,
-          [15, 84, 10],
-          0.65,
-          [0, 69, 0],
-        ],
-      },
-      source: source,
-    }),
-  ],
+  layers: [layer],
   view: source.getView(),
 });
+
+const output = document.getElementById('output');
+function displayPixelValue(event) {
+  const data = layer.getData(event.pixel);
+  if (!data) {
+    return;
+  }
+  const red = data[0];
+  const nir = data[1];
+  const ndvi = (nir - red) / (nir + red);
+  output.textContent = ndvi.toFixed(2);
+}
+map.on(['pointermove', 'click'], displayPixelValue);

examples/cog-pyramid.html

@@ -4,9 +4,9 @@ title: GeoTIFF tile pyramid
 shortdesc: Rendering a COG tile pyramid as layer group.
 docs: >
   Data from a Cloud Optimized GeoTIFF (COG) tile pyramid can be rendered as a set of layers.  In this
-  example, a pyramid of 3-band GeoTIFFs is used to render RGB data. For each tile of the pyramid, a
-  separate layer is created on demand. The lowest resolution layer serves as preview while higher resolutions are
-  loading.
+  example, a pyramid of 3-band GeoTIFFs is used to render RGB data. The `ol/source.sourcesFromTileGrid`
+  helper function creates sources from this pyramid on demand. The GeoTIFFs used by those sources have
+  a resolution range that matches the range of a single z of the pyramid tile grid.
 tags: "cog, tilepyramid, stac"
 ---
 <div id="map" class="map"></div>

examples/cog-pyramid.js

@@ -1,16 +1,15 @@
 import GeoTIFF from '../src/ol/source/GeoTIFF.js';
-import LayerGroup from '../src/ol/layer/Group.js';
 import Map from '../src/ol/Map.js';
 import TileGrid from '../src/ol/tilegrid/TileGrid.js';
 import View from '../src/ol/View.js';
 import WebGLTileLayer from '../src/ol/layer/WebGLTile.js';
-import {getIntersection} from '../src/ol/extent.js';
+import {sourcesFromTileGrid} from '../src/ol/source.js';
 
 // Metadata from https://s2downloads.eox.at/demo/EOxCloudless/2019/rgb/2019_EOxCloudless_rgb.json
 
 // Tile grid of the GeoTIFF pyramid layout
 const tileGrid = new TileGrid({
-  origin: [-180, 90],
+  extent: [-180, -90, 180, 90],
   resolutions: [0.703125, 0.3515625, 0.17578125, 8.7890625e-2, 4.39453125e-2],
   tileSizes: [
     [512, 256],
@@ -21,30 +20,19 @@ const tileGrid = new TileGrid({
   ],
 });
 
-const pyramid = new LayerGroup();
-const layerForUrl = {};
-const zs = tileGrid.getResolutions().length;
-
-function useLayer(z, x, y) {
-  const url = `https://s2downloads.eox.at/demo/EOxCloudless/2019/rgb/${z}/${y}/${x}.tif`;
-  if (!(url in layerForUrl)) {
-    pyramid.getLayers().push(
-      new WebGLTileLayer({
-        minZoom: z,
-        maxZoom: z === 0 || z === zs - 1 ? undefined : z + 1,
-        extent: tileGrid.getTileCoordExtent([z, x, y]),
-        source: new GeoTIFF({
-          sources: [
-            {
-              url: url,
-            },
-          ],
-        }),
+const pyramid = new WebGLTileLayer({
+  sources: sourcesFromTileGrid(
+    tileGrid,
+    ([z, x, y]) =>
+      new GeoTIFF({
+        sources: [
+          {
+            url: `https://s2downloads.eox.at/demo/EOxCloudless/2019/rgb/${z}/${y}/${x}.tif`,
+          },
+        ],
       })
-    );
-    layerForUrl[url] = true;
-  }
-}
+  ),
+});
 
 const map = new Map({
   target: 'map',
@@ -56,16 +44,3 @@ const map = new Map({
     showFullExtent: true,
   }),
 });
-
-// Add overview layer
-useLayer(0, 0, 0);
-
-// Add layer for specific extent on demand
-map.on('moveend', () => {
-  const view = map.getView();
-  tileGrid.forEachTileCoord(
-    getIntersection([-180, -90, 180, 90], view.calculateExtent()),
-    tileGrid.getZForResolution(view.getResolution()),
-    ([z, x, y]) => useLayer(z, x, y)
-  );
-});

examples/cog-stretch.css

@@ -0,0 +1,6 @@
+.controls {
+  display: grid;
+  grid-template-columns: auto auto 1fr;
+  align-items: baseline;
+  gap: 0 1em;
+}

examples/cog-stretch.html

@@ -0,0 +1,44 @@
+---
+layout: example.html
+title: Band Contrast Stretch
+shortdesc: Choosing bands and applying contrast stretch
+docs: >
+  This example uses the `layer.updateStyleVariables()` method to update the rendering
+  of a GeoTIFF based on user selected bands and contrast stretch parameters.
+tags: "cog, webgl, style"
+---
+<div id="map" class="map"></div>
+<div class="controls">
+  <label for="red">Red channel</label>
+  <select id="red">
+    <option value="1" selected>visible red</option>
+    <option value="2">visible green</option>
+    <option value="3">visible blue</option>
+    <option value="4">near infrared</option>
+  </select>
+  <label>max
+    <input type="range" id="redMax" value="3000" min="2000" max="5000">
+  </label>
+
+  <label for="green">Green channel</label>
+  <select id="green">
+    <option value="1">visible red</option>
+    <option value="2" selected>visible green</option>
+    <option value="3">visible blue</option>
+    <option value="4">near infrared</option>
+  </select>
+  <label>max
+    <input type="range" id="greenMax" value="3000" min="2000" max="5000">
+  </label>
+
+  <label for="blue">Blue channel</label>
+  <select id="blue">
+    <option value="1">visible red</option>
+    <option value="2">visible green</option>
+    <option value="3" selected>visible blue</option>
+    <option value="4">near infrared</option>
+  </select>
+  <label>max
+    <input type="range" id="blueMax" value="3000" min="2000" max="5000">
+  </label>
+</div>

examples/cog-stretch.js

@@ -0,0 +1,62 @@
+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 channels = ['red', 'green', 'blue'];
+for (const channel of channels) {
+  const selector = document.getElementById(channel);
+  selector.addEventListener('change', update);
+
+  const input = document.getElementById(`${channel}Max`);
+  input.addEventListener('input', update);
+}
+
+function getVariables() {
+  const variables = {};
+  for (const channel of channels) {
+    const selector = document.getElementById(channel);
+    variables[channel] = parseInt(selector.value, 10);
+
+    const inputId = `${channel}Max`;
+    const input = document.getElementById(inputId);
+    variables[inputId] = parseInt(input.value, 10);
+  }
+  return variables;
+}
+
+const layer = new TileLayer({
+  style: {
+    variables: getVariables(),
+    color: [
+      'array',
+      ['/', ['band', ['var', 'red']], ['var', 'redMax']],
+      ['/', ['band', ['var', 'green']], ['var', 'greenMax']],
+      ['/', ['band', ['var', 'blue']], ['var', 'blueMax']],
+      1,
+    ],
+  },
+  source: new GeoTIFF({
+    normalize: false,
+    sources: [
+      {
+        url: 'https://s2downloads.eox.at/demo/EOxCloudless/2020/rgbnir/s2cloudless2020-16bits_sinlge-file_z0-4.tif',
+      },
+    ],
+  }),
+});
+
+function update() {
+  layer.updateStyleVariables(getVariables());
+}
+
+const map = new Map({
+  target: 'map',
+  layers: [layer],
+  view: new View({
+    projection: 'EPSG:4326',
+    center: [0, 0],
+    zoom: 2,
+    maxZoom: 6,
+  }),
+});

examples/cog-style.html

@@ -0,0 +1,20 @@
+---
+layout: example.html
+title: Change Tile Layer Style
+shortdesc: Updating the style of a WebGL tile layer
+docs: >
+  When you want to change the style of a WebGL tile layer based on some change in your
+  application state, you should use the `layer.updateStyleVariables()` method.  A layer can
+  be efficiently rendered even if style variables are changed on every render frame.
+  In cases where you need to completely replace the style of a layer, you can call the
+  `layer.setStyle()` method.  This method should not be called in response to frequent
+  user events (e.g. mouse movement, dragging a slider, etc.).
+tags: "cog, webgl, style"
+---
+<div id="map" class="map"></div>
+Set the layer style
+<select id="style">
+  <option value="trueColor">True Color</option>
+  <option value="falseColor">False Color</option>
+  <option value="ndvi">NDVI</option>
+</select>

examples/cog-style.js

@@ -0,0 +1,105 @@
+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 max = 3000;
+function normalize(value) {
+  return ['/', value, max];
+}
+
+const red = normalize(['band', 1]);
+const green = normalize(['band', 2]);
+const blue = normalize(['band', 3]);
+const nir = normalize(['band', 4]);
+
+const trueColor = {
+  color: ['array', red, green, blue, 1],
+  gamma: 1.1,
+};
+
+const falseColor = {
+  color: ['array', nir, red, green, 1],
+  gamma: 1.1,
+};
+
+const ndvi = {
+  color: [
+    'interpolate',
+    ['linear'],
+    ['/', ['-', nir, red], ['+', nir, red]],
+    // color ramp for NDVI values, ranging from -1 to 1
+    -0.2,
+    [191, 191, 191],
+    -0.1,
+    [219, 219, 219],
+    0,
+    [255, 255, 224],
+    0.025,
+    [255, 250, 204],
+    0.05,
+    [237, 232, 181],
+    0.075,
+    [222, 217, 156],
+    0.1,
+    [204, 199, 130],
+    0.125,
+    [189, 184, 107],
+    0.15,
+    [176, 194, 97],
+    0.175,
+    [163, 204, 89],
+    0.2,
+    [145, 191, 82],
+    0.25,
+    [128, 179, 71],
+    0.3,
+    [112, 163, 64],
+    0.35,
+    [97, 150, 54],
+    0.4,
+    [79, 138, 46],
+    0.45,
+    [64, 125, 36],
+    0.5,
+    [48, 110, 28],
+    0.55,
+    [33, 97, 18],
+    0.6,
+    [15, 84, 10],
+    0.65,
+    [0, 69, 0],
+  ],
+};
+
+const layer = new TileLayer({
+  style: trueColor,
+  source: new GeoTIFF({
+    normalize: false,
+    sources: [
+      {
+        url: 'https://s2downloads.eox.at/demo/EOxCloudless/2020/rgbnir/s2cloudless2020-16bits_sinlge-file_z0-4.tif',
+      },
+    ],
+  }),
+});
+
+const map = new Map({
+  target: 'map',
+  layers: [layer],
+  view: new View({
+    projection: 'EPSG:4326',
+    center: [0, 0],
+    zoom: 2,
+    maxZoom: 6,
+  }),
+});
+
+const styles = {trueColor, falseColor, ndvi};
+const styleSelector = document.getElementById('style');
+
+function update() {
+  const style = styles[styleSelector.value];
+  layer.setStyle(style);
+}
+styleSelector.addEventListener('change', update);

examples/color-manipulation.js

@@ -166,12 +166,10 @@ const controlIds = ['hue', 'chroma', 'lightness'];
 controlIds.forEach(function (id) {
   const control = document.getElementById(id);
   const output = document.getElementById(id + 'Out');
-  const listener = function () {
+  control.addEventListener('input', function () {
     output.innerText = control.value;
     raster.changed();
-  };
-  control.addEventListener('input', listener);
-  control.addEventListener('change', listener);
+  });
   output.innerText = control.value;
   controls[id] = control;
 });

examples/custom-hit-detection-renderer.html

@@ -0,0 +1,12 @@
+---
+layout: example.html
+title: Custom Hit Detection Render
+shortdesc: Example of a custom hit detection renderer.
+docs: >
+  This example demonstrates the use of 'ol/style/Style' hitDetectionRender option function in 
+  detecting if pointer is over a particular feature. 
+  Move pointer over the label for Columbus Circle feature and see that only label is used in
+  hit detection.
+tags: "circle, feature, vector, render, custom, hitDetectionRenderer"
+---
+<div id="map" class="map"></div>

examples/custom-hit-detection-renderer.js

@@ -0,0 +1,103 @@
+import Feature from '../src/ol/Feature.js';
+import Map from '../src/ol/Map.js';
+import View from '../src/ol/View.js';
+import {Circle} from '../src/ol/geom.js';
+import {OSM, Vector as VectorSource} from '../src/ol/source.js';
+import {Style} from '../src/ol/style.js';
+import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import {fromLonLat} from '../src/ol/proj.js';
+
+const columbusCircleCoords = fromLonLat([-73.98189, 40.76805]);
+const labelTextStroke = 'rgba(120, 120, 120, 1)';
+const labelText = 'Columbus Circle';
+
+let pointerOverFeature = null;
+
+const renderLabelText = (ctx, x, y, stroke) => {
+  ctx.fillStyle = 'rgba(255,0,0,1)';
+  ctx.strokeStyle = stroke;
+  ctx.lineWidth = 1;
+  ctx.textAlign = 'center';
+  ctx.textBaseline = 'middle';
+  ctx.font = `bold 30px verdana`;
+  ctx.filter = 'drop-shadow(7px 7px 2px #e81)';
+  ctx.fillText(labelText, x, y);
+  ctx.strokeText(labelText, x, y);
+};
+
+const circleFeature = new Feature({
+  geometry: new Circle(columbusCircleCoords, 50),
+});
+
+circleFeature.set('label-color', labelTextStroke);
+
+circleFeature.setStyle(
+  new Style({
+    renderer(coordinates, state) {
+      const [[x, y], [x1, y1]] = coordinates;
+      const ctx = state.context;
+      const dx = x1 - x;
+      const dy = y1 - y;
+      const radius = Math.sqrt(dx * dx + dy * dy);
+
+      const innerRadius = 0;
+      const outerRadius = radius * 1.4;
+
+      const gradient = ctx.createRadialGradient(
+        x,
+        y,
+        innerRadius,
+        x,
+        y,
+        outerRadius
+      );
+      gradient.addColorStop(0, 'rgba(255,0,0,0)');
+      gradient.addColorStop(0.6, 'rgba(255,0,0,0.2)');
+      gradient.addColorStop(1, 'rgba(255,0,0,0.8)');
+      ctx.beginPath();
+      ctx.arc(x, y, radius, 0, 2 * Math.PI, true);
+      ctx.fillStyle = gradient;
+      ctx.fill();
+      ctx.strokeStyle = 'rgba(255,0,0,1)';
+      ctx.stroke();
+
+      renderLabelText(ctx, x, y, circleFeature.get('label-color'));
+    },
+    hitDetectionRenderer(coordinates, state) {
+      const [x, y] = coordinates[0];
+      const ctx = state.context;
+      renderLabelText(ctx, x, y, circleFeature.get('label-color'));
+    },
+  })
+);
+
+const map = new Map({
+  layers: [
+    new TileLayer({
+      source: new OSM(),
+      visible: true,
+    }),
+    new VectorLayer({
+      source: new VectorSource({
+        features: [circleFeature],
+      }),
+    }),
+  ],
+  target: 'map',
+  view: new View({
+    center: columbusCircleCoords,
+    zoom: 19,
+  }),
+});
+
+map.on('pointermove', (evt) => {
+  const featureOver = map.forEachFeatureAtPixel(evt.pixel, (feature) => {
+    feature.set('label-color', 'rgba(255,255,255,1)');
+    return feature;
+  });
+
+  if (pointerOverFeature && pointerOverFeature != featureOver) {
+    pointerOverFeature.set('label-color', labelTextStroke);
+  }
+  pointerOverFeature = featureOver;
+});

examples/custom-interactions.js

@@ -1,7 +1,6 @@
 import Feature from '../src/ol/Feature.js';
 import Map from '../src/ol/Map.js';
 import View from '../src/ol/View.js';
-import {Fill, Icon, Stroke, Style} from '../src/ol/style.js';
 import {LineString, Point, Polygon} from '../src/ol/geom.js';
 import {
   Pointer as PointerInteraction,
@@ -147,22 +146,16 @@ const map = new Map({
       source: new VectorSource({
         features: [pointFeature, lineFeature, polygonFeature],
       }),
-      style: new Style({
-        image: new Icon({
-          anchor: [0.5, 46],
-          anchorXUnits: 'fraction',
-          anchorYUnits: 'pixels',
-          opacity: 0.95,
-          src: 'data/icon.png',
-        }),
-        stroke: new Stroke({
-          width: 3,
-          color: [255, 0, 0, 1],
-        }),
-        fill: new Fill({
-          color: [0, 0, 255, 0.6],
-        }),
-      }),
+      style: {
+        'icon-src': 'data/icon.png',
+        'icon-opacity': 0.95,
+        'icon-anchor': [0.5, 46],
+        'icon-anchor-x-units': 'fraction',
+        'icon-anchor-y-units': 'pixels',
+        'stroke-width': 3,
+        'stroke-color': [255, 0, 0, 1],
+        'fill-color': [0, 0, 255, 0.6],
+      },
     }),
   ],
   target: 'map',

examples/d3.html

@@ -6,7 +6,7 @@ docs: >
   The example loads TopoJSON geometries and uses d3 (<code>d3.geo.path</code>) to render these geometries to a SVG element.
 tags: "d3"
 resources:
-  - https://unpkg.com/d3@6.7.0/dist/d3.min.js
+  - https://unpkg.com/d3@7.4.4/dist/d3.min.js
   - https://unpkg.com/topojson@3.0.2/dist/topojson.js
 ---
 <div id="map" class="map"></div>

examples/d3.js

@@ -1,5 +1,4 @@
 import Map from '../src/ol/Map.js';
-import SourceState from '../src/ol/source/State.js';
 import Stamen from '../src/ol/source/Stamen.js';
 import View from '../src/ol/View.js';
 import {Layer, Tile as TileLayer} from '../src/ol/layer.js';
@@ -21,7 +20,7 @@ class CanvasLayer extends Layer {
   }
 
   getSourceState() {
-    return SourceState.READY;
+    return 'ready';
   }
 
   render(frameState) {

examples/data-tiles.js

@@ -32,7 +32,7 @@ const map = new Map({
           context.strokeRect(0, 0, size, size);
           const data = context.getImageData(0, 0, size, size).data;
           // converting to Uint8Array for increased browser compatibility
-          return Promise.resolve(new Uint8Array(data.buffer));
+          return new Uint8Array(data.buffer);
         },
         // disable opacity transition to avoid overlapping labels during tile loading
         transition: 0,