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

Implement Drag-to-Zoom for ticket #30.

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@216 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
crschmidt
2006-05-20 22:18:44 +00:00
parent e7c6d4df19
commit 24eb8fe144
2 changed files with 52 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
lib/OpenLayers/Control/MouseDefaults.js
View File

@@ -11,7 +11,7 @@ OpenLayers.Control.MouseDefaults.prototype =
this.map.events.register( "mousedown", this.map, this.defaultMouseDown ); this.map.events.register( "mousedown", this.map, this.defaultMouseDown );
this.map.events.register( "mouseup", this.map, this.defaultMouseUp ); this.map.events.register( "mouseup", this.map, this.defaultMouseUp );
this.map.events.register( "mousemove", this.map, this.defaultMouseMove ); this.map.events.register( "mousemove", this.map, this.defaultMouseMove );
this.map.events.register( "mouseout", this.map, this.defaultMouseUp ); //this.map.events.register( "mouseout", this.map, this.defaultMouseUp );
}, },
/** /**
@@ -27,7 +27,18 @@ OpenLayers.Control.MouseDefaults.prototype =
*/ */
defaultMouseDown: function (evt) { defaultMouseDown: function (evt) {
this.mouseDragStart = evt.xy.copyOf(); this.mouseDragStart = evt.xy.copyOf();
if (evt.shiftKey) {
this.div.style.cursor = "crosshair";
this.zoomBox = OpenLayers.Util.createDiv('zoomBox');
this.zoomBox.style.border = '1px solid red';
this.zoomBox.style.position="absolute";
this.zoomBox.style.zIndex=1000;
this.zoomBox.style.top=this.mouseDragStart.y;
this.zoomBox.style.left=this.mouseDragStart.x;
this.viewPortDiv.appendChild(this.zoomBox);
} else {
this.div.style.cursor = "move"; this.div.style.cursor = "move";
}
Event.stop(evt); Event.stop(evt);
}, },
@@ -36,8 +47,20 @@ OpenLayers.Control.MouseDefaults.prototype =
*/ */
defaultMouseMove: function (evt) { defaultMouseMove: function (evt) {
if (this.mouseDragStart != null) { if (this.mouseDragStart != null) {
if (this.zoomBox) {
var deltaX = Math.abs(this.mouseDragStart.x - evt.xy.x);
var deltaY = Math.abs(this.mouseDragStart.y - evt.xy.y);
this.zoomBox.style.width = deltaX+"px";
this.zoomBox.style.height = deltaY+"px";
if (evt.xy.x < this.mouseDragStart.x) {
this.zoomBox.style.left = evt.xy.x+"px";
}
if (evt.xy.y < this.mouseDragStart.y) {
this.zoomBox.style.top = evt.xy.y+"px";
}
} else {
var deltaX = this.mouseDragStart.x - evt.xy.x; var deltaX = this.mouseDragStart.x - evt.xy.x;
var deltaY = this.mouseDragStart.y - evt.xy.y var deltaY = this.mouseDragStart.y - evt.xy.y;
var size = this.getSize(); var size = this.getSize();
var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX, var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX,
size.h / 2 + deltaY); size.h / 2 + deltaY);
@@ -45,12 +68,29 @@ OpenLayers.Control.MouseDefaults.prototype =
this.setCenter(newCenter); this.setCenter(newCenter);
this.mouseDragStart = evt.xy.copyOf(); this.mouseDragStart = evt.xy.copyOf();
} }
}
}, },
/** /**
* @param {Event} evt * @param {Event} evt
*/ */
defaultMouseUp: function (evt) { defaultMouseUp: function (evt) {
if (this.zoomBox) {
var start = this.getLonLatFromPixel( this.mouseDragStart );
var end = this.getLonLatFromPixel( evt.xy );
var top = (start.lat > end.lat ? start.lat : end.lat);
var bottom = (start.lat < end.lat ? start.lat : end.lat);
var left = (start.lon < end.lon ? start.lon : end.lon);
var right = (start.lon > end.lon ? start.lon : end.lon);
var bounds = new OpenLayers.Bounds(left, bottom, right, top);
var zoom = this.getZoomForExtent(bounds);
this.setCenter(new OpenLayers.LonLat(
(start.lon + end.lon) / 2,
(start.lat + end.lat) / 2
), zoom);
this.viewPortDiv.removeChild(document.getElementById("zoomBox"));
this.zoomBox = null;
}
this.mouseDragStart = null; this.mouseDragStart = null;
this.div.style.cursor = "default"; this.div.style.cursor = "default";
} }

4
lib/OpenLayers/Map.js
View File

@@ -220,8 +220,8 @@ OpenLayers.Map.prototype = {
*/ */
getZoomForExtent: function (bounds) { getZoomForExtent: function (bounds) {
var size = this.getSize(); var size = this.getSize();
var deg_per_pixel = bounds.getWidth() / size.w; var deg_per_pixel = (bounds.getWidth() > bounds.getHeight() ? bounds.getWidth() / size.w : bounds.getHeight() / size.h);
var zoom = Math.log(deg_per_pixel / this.maxResolution) / Math.log(2); var zoom = -( Math.log(deg_per_pixel / this.maxResolution) / Math.log(2) );
return Math.floor(Math.max(zoom, 0)); return Math.floor(Math.max(zoom, 0));
}, },