ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Made OvervieMap interactive option default behavior

Browse Source
This commit is contained in:
Félix VEYSSEYRE
2017-03-20 17:15:47 +01:00
parent 328862172d
commit 6202c1736f
4 changed files with 26 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
css/ol.css
View File

@@ -240,6 +240,6 @@
border: 2px dotted rgba(0,60,136,0.7);
}
.ol-overviewmap-interactive .ol-overviewmap-box:hover {
.ol-overviewmap .ol-overviewmap-box:hover {
cursor: move;
}

3
examples/overviewmap-custom.js
View File

@@ -20,8 +20,7 @@ var overviewMapControl = new ol.control.OverviewMap({
],
collapseLabel: '\u00BB',
label: '\u00AB',
collapsed: false,
interactive: true
collapsed: false
});
var map = new ol.Map({

7
externs/olx.js
View File

@@ -1201,13 +1201,6 @@ olx.control.OverviewMapOptions.prototype.collapseLabel;
*/
olx.control.OverviewMapOptions.prototype.collapsible;
/**
* Whether the control is interactive or not. Default to `false`.
* @type {boolean|undefined}
* @api
*/
olx.control.OverviewMapOptions.prototype.interactive;
/**
* Text label to use for the collapsed overviewmap button. Default is `»`.

58
src/ol/control/overviewmap.js
View File

@@ -42,20 +42,12 @@ ol.control.OverviewMap = function(opt_options) {
this.collapsible_ = options.collapsible !== undefined ?
options.collapsible : true;
/**
* @type {boolean}
* @private
*/
this.interactive_ = options.interactive !== undefined ? options.interactive : false;
if (!this.collapsible_) {
this.collapsed_ = false;
}
var className = options.className !== undefined ? options.className : 'ol-overviewmap';
if (this.interactive_) className += ' ol-overviewmap-interactive';
var tipLabel = options.tipLabel !== undefined ? options.tipLabel : 'Overview map';
var collapseLabel = options.collapseLabel !== undefined ? options.collapseLabel : '\u00AB';
@@ -154,43 +146,41 @@ ol.control.OverviewMap = function(opt_options) {
/* Interactive map */
if (this.interactive_) {
var scope = this;
var scope = this;
var overlay = this.boxOverlay_;
var overlayBox = this.boxOverlay_.getElement();
var overlay = this.boxOverlay_;
var overlayBox = this.boxOverlay_.getElement();
/* Functions definition */
/* Functions definition */
var computeDesiredMousePosition = function(mousePosition) {
return {
clientX: mousePosition.clientX - (overlayBox.offsetWidth / 2),
clientY: mousePosition.clientY + (overlayBox.offsetHeight / 2)
};
var computeDesiredMousePosition = function(mousePosition) {
return {
clientX: mousePosition.clientX - (overlayBox.offsetWidth / 2),
clientY: mousePosition.clientY + (overlayBox.offsetHeight / 2)
};
};
var move = function(event) {
var coordinates = ovmap.getEventCoordinate(computeDesiredMousePosition(event));
var move = function(event) {
var coordinates = ovmap.getEventCoordinate(computeDesiredMousePosition(event));
overlay.setPosition(coordinates);
};
overlay.setPosition(coordinates);
};
var endMoving = function(event) {
var coordinates = ovmap.getEventCoordinate(event);
var endMoving = function(event) {
var coordinates = ovmap.getEventCoordinate(event);
scope.getMap().getView().setCenter(coordinates);
scope.getMap().getView().setCenter(coordinates);
window.removeEventListener('mousemove', move);
window.removeEventListener('mouseup', endMoving);
};
window.removeEventListener('mousemove', move);
window.removeEventListener('mouseup', endMoving);
};
/* Binding */
/* Binding */
overlayBox.addEventListener('mousedown', function() {
window.addEventListener('mousemove', move);
window.addEventListener('mouseup', endMoving);
});
}
overlayBox.addEventListener('mousedown', function() {
window.addEventListener('mousemove', move);
window.addEventListener('mouseup', endMoving);
});
};
ol.inherits(ol.control.OverviewMap, ol.control.Control);