Fix the OverviewMap control & example

Layers must now always be specified for the control.
Base example was amended to reflect that.

The breaking change was added in the update notes.

changelog/upgrade-notes.md

@@ -2,6 +2,8 @@
 
 ### Next version
 
+Breaking change: The `OverviewMap` control now cannot be instantiated without a list of layers. 
+
 ### v5.3.0
 
 #### The `getUid` function returns string

examples/overviewmap.html

@@ -3,7 +3,8 @@ layout: example.html
 title: Overview Map Control
 shortdesc: Example of OverviewMap control.
 docs: >
-  This example demonstrates the use of the OverviewMap control.
+  This example demonstrates the use of the OverviewMap control. Both the main map and the overview map are configured with layers using the same source.
+  Please note that explicitly configuring layers for the overview map is mandatory.
 tags: "overview, overviewmap"
 ---
 <div id="map" class="map"></div>

examples/overviewmap.js

@@ -4,13 +4,22 @@ import {defaults as defaultControls, OverviewMap} from '../src/ol/control.js';
 import TileLayer from '../src/ol/layer/Tile.js';
 import OSM from '../src/ol/source/OSM.js';
 
+const source = new OSM();
+const overviewMapControl = new OverviewMap({
+  layers: [
+    new TileLayer({
+      source: source
+    })
+  ]
+});
+
 const map = new Map({
   controls: defaultControls().extend([
-    new OverviewMap()
+    overviewMapControl
   ]),
   layers: [
     new TileLayer({
-      source: new OSM()
+      source: source
     })
   ],
   target: 'map',

src/ol/control/OverviewMap.js

@@ -44,9 +44,8 @@ const MIN_RATIO = 0.1;
  * @property {boolean} [collapsible=true] Whether the control can be collapsed or not.
  * @property {string|HTMLElement} [label='»'] Text label to use for the collapsed
  * overviewmap button. Instead of text, also an element (e.g. a `span` element) can be used.
- * @property {Array<import("../layer/Layer.js").default>|import("../Collection.js").default<import("../layer/Layer.js").default>} [layers]
- * Layers for the overview map. If not set, then all main map layers are used
- * instead.
+ * @property {Array<import("../layer/Layer.js").default>|import("../Collection.js").default<import("../layer/Layer.js").default>} layers
+ * Layers for the overview map (mandatory).
  * @property {function(import("../MapEvent.js").default)} [render] Function called when the control
  * should be re-rendered. This is called in a `requestAnimationFrame` callback.
  * @property {HTMLElement|string} [target] Specify a target if you want the control
@@ -251,11 +250,6 @@ class OverviewMap extends Control {
         map, ObjectEventType.PROPERTYCHANGE,
         this.handleMapPropertyChange_, this));
 
-      // TODO: to really support map switching, this would need to be reworked
-      if (this.ovmap_.getLayers().getLength() === 0) {
-        this.ovmap_.setLayerGroup(map.getLayerGroup());
-      }
-
       const view = map.getView();
       if (view) {
         this.bindView_(view);