diff --git a/src/ol/control/OverviewMap.js b/src/ol/control/OverviewMap.js index 4ee1242726..a77f8ae698 100644 --- a/src/ol/control/OverviewMap.js +++ b/src/ol/control/OverviewMap.js @@ -17,6 +17,7 @@ import {replaceNode} from '../dom.js'; import {listen, listenOnce} from '../events.js'; import EventType from '../events/EventType.js'; import {containsExtent, equals as equalsExtent, getBottomRight, getTopLeft, scaleFromCenter} from '../extent.js'; +import View from '../View.js'; /** @@ -59,9 +60,8 @@ class ControlledMap extends PluggableMap { * @property {HTMLElement|string} [target] Specify a target if you want the control * to be rendered outside of the map's viewport. * @property {string} [tipLabel='Overview map'] Text label to use for the button tip. - * @property {import("../View.js").default} [view] Custom view for the overview map. If not provided, - * a default view with an EPSG:3857 projection will be used. The main map and the overviewmap must use - * the same projection, so a view must be provided when the default projection is not used. + * @property {View} [view] Custom view for the overview map (should use same projection as main map). If not provided, + * a default view with the same projection as the main map will be used. */ @@ -168,6 +168,13 @@ class OverviewMap extends Control { this.ovmapDiv_ = document.createElement('div'); this.ovmapDiv_.className = 'ol-overviewmap-map'; + /** + * Explicitly given view to be used instead of a view derived from the main map. + * @type {View} + * @private + */ + this.view_ = options.view; + /** * @type {ControlledMap} * @private @@ -304,6 +311,14 @@ class OverviewMap extends Control { * @private */ bindView_(view) { + if (!this.view_) { + // Unless an explicit view definition was given, derive default from whatever main map uses. + const newView = new View({ + projection: view.getProjection() + }); + this.ovmap_.setView(newView); + } + view.addEventListener(getChangeEventType(ViewProperty.ROTATION), this.boundHandleRotationChanged_); // Sync once with the new view this.handleRotationChanged_(); diff --git a/test/spec/ol/control/overviewmap.test.js b/test/spec/ol/control/overviewmap.test.js index 64cf8c8e8d..2a01cd5739 100644 --- a/test/spec/ol/control/overviewmap.test.js +++ b/test/spec/ol/control/overviewmap.test.js @@ -55,8 +55,8 @@ describe('ol.control.OverviewMap', function() { rotateWithView: true }); map.addControl(control); - const ovView = control.ovmap_.getView(); - expect(ovView.getRotation()).to.be(0); + const ovInitialView = control.ovmap_.getView(); + expect(ovInitialView.getRotation()).to.be(0); const view = new View({ center: [0, 0], @@ -64,6 +64,7 @@ describe('ol.control.OverviewMap', function() { rotation: Math.PI / 2 }); map.setView(view); + const ovView = control.ovmap_.getView(); expect(ovView.getRotation()).to.be(Math.PI / 2); view.setRotation(Math.PI / 4); @@ -74,7 +75,6 @@ describe('ol.control.OverviewMap', function() { const control = new OverviewMap({ rotateWithView: true }); - const ovView = control.ovmap_.getView(); const view = new View({ center: [0, 0], @@ -83,6 +83,7 @@ describe('ol.control.OverviewMap', function() { }); map.setView(view); map.addControl(control); + const ovView = control.ovmap_.getView(); view.setRotation(Math.PI / 8); expect(ovView.getRotation()).to.be(Math.PI / 8); @@ -93,6 +94,38 @@ describe('ol.control.OverviewMap', function() { expect(ovView.getRotation()).to.be(Math.PI / 8); }); + it('reflects projection change of main map', function() { + const control = new OverviewMap({ + rotateWithView: true + }); + + map.addControl(control); + expect(control.ovmap_.getView().getProjection().getCode()).to.be('EPSG:3857'); + + map.setView(new View({ + projection: 'EPSG:4326' + })); + expect(control.ovmap_.getView().getProjection().getCode()).to.be('EPSG:4326'); + }); + + it('retains explicitly set view', function() { + const overviewMapView = new View(); + const control = new OverviewMap({ + rotateWithView: true, + view: overviewMapView + }); + + map.addControl(control); + expect(control.ovmap_.getView()).to.be(overviewMapView); + expect(control.ovmap_.getView().getProjection().getCode()).to.be('EPSG:3857'); + + map.setView(new View({ + projection: 'EPSG:4326' + })); + expect(control.ovmap_.getView()).to.be(overviewMapView); + expect(control.ovmap_.getView().getProjection().getCode()).to.be('EPSG:3857'); + }); + it('set target to null', function() { const control = new OverviewMap();