From d12fd7c04c27fc6b86d7cd330026a36d5eba07ae Mon Sep 17 00:00:00 2001 From: Tim Schaub Date: Tue, 11 Mar 2008 18:32:17 +0000 Subject: [PATCH] Smooth GDragging at last. Thanks to overstdr for digging up the getDragObject method. With v2.93 and later we no longer get flickers on panning. Non-API smooth dragging is no longer supported. r=crschmidt,me (closes #1402) git-svn-id: http://svn.openlayers.org/trunk/openlayers@6492 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf --- examples/google.html | 7 ++++++- examples/spherical-mercator.html | 2 +- lib/OpenLayers/Control/DragPan.js | 12 +++++------- lib/OpenLayers/Layer/EventPane.js | 19 +++---------------- lib/OpenLayers/Layer/Google.js | 30 ++++++++++++++++++------------ lib/OpenLayers/Map.js | 22 ++++++++++++++-------- 6 files changed, 47 insertions(+), 45 deletions(-) diff --git a/examples/google.html b/examples/google.html index 6c694ab409..68e3a54202 100644 --- a/examples/google.html +++ b/examples/google.html @@ -57,6 +57,11 @@
-
+
+ For best performance, you must be using a version of the Google Maps + API which is v2.93 or higher. In order to use this version of the API, + it is best to simply set your application to use the string "v=2" in + the request, rather than tying your application to an explicit version. +
diff --git a/examples/spherical-mercator.html b/examples/spherical-mercator.html index 09ea90442e..504bdd8e0d 100644 --- a/examples/spherical-mercator.html +++ b/examples/spherical-mercator.html @@ -11,7 +11,7 @@ - + diff --git a/lib/OpenLayers/Control/DragPan.js b/lib/OpenLayers/Control/DragPan.js index 6af4ea0528..5eb3edf39f 100644 --- a/lib/OpenLayers/Control/DragPan.js +++ b/lib/OpenLayers/Control/DragPan.js @@ -46,13 +46,11 @@ OpenLayers.Control.DragPan = OpenLayers.Class(OpenLayers.Control, { */ panMap: function(xy) { this.panned = true; - var deltaX = this.handler.last.x - xy.x; - var deltaY = this.handler.last.y - xy.y; - var size = this.map.getSize(); - var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX, - size.h / 2 + deltaY); - var newCenter = this.map.getLonLatFromViewPortPx( newXY ); - this.map.setCenter(newCenter, null, this.handler.dragging); + this.map.pan( + this.handler.last.x - xy.x, + this.handler.last.y - xy.y, + {dragging: this.handler.dragging, animate: false} + ); }, /** diff --git a/lib/OpenLayers/Layer/EventPane.js b/lib/OpenLayers/Layer/EventPane.js index 382c4f06f9..5a73fce703 100644 --- a/lib/OpenLayers/Layer/EventPane.js +++ b/lib/OpenLayers/Layer/EventPane.js @@ -241,10 +241,9 @@ OpenLayers.Layer.EventPane = OpenLayers.Class(OpenLayers.Layer, { if (dragging && this.dragPanMapObject && this.smoothDragPan) { - var resolution = this.map.getResolution(); - var dX = (newCenter.lon - oldCenter.lon) / resolution; - var dY = (newCenter.lat - oldCenter.lat) / resolution; - this.dragPanMapObject(dX, dY); + var oldPx = this.map.getViewPortPxFromLonLat(oldCenter); + var newPx = this.map.getViewPortPxFromLonLat(newCenter); + this.dragPanMapObject(newPx.x-oldPx.x, oldPx.y-newPx.y); } else { var center = this.getMapObjectLonLatFromOLLonLat(newCenter); var zoom = this.getMapObjectZoomFromOLZoom(newZoom); @@ -281,18 +280,6 @@ OpenLayers.Layer.EventPane = OpenLayers.Class(OpenLayers.Layer, { var moPixel = this.getMapObjectPixelFromOLPixel(viewPortPx); var moLonLat = this.getMapObjectLonLatFromMapObjectPixel(moPixel); lonlat = this.getOLLonLatFromMapObjectLonLat(moLonLat); - var xrem = this.map.size.w % 2; - var yrem = this.map.size.h % 2; - if(xrem != 0 || yrem != 0) { - // odd sized viewport - var olPx = viewPortPx.add(xrem, yrem); - var moPx = this.getMapObjectPixelFromOLPixel(olPx); - var moLoc = this.getMapObjectLonLatFromMapObjectPixel(moPx); - var olLoc = this.getOLLonLatFromMapObjectLonLat(moLoc); - // adjust by half a pixel in odd dimension(s) - lonlat.lon += (olLoc.lon - lonlat.lon) / 2; - lonlat.lat += (olLoc.lat - lonlat.lat) / 2; - } } return lonlat; }, diff --git a/lib/OpenLayers/Layer/Google.js b/lib/OpenLayers/Layer/Google.js index 3360c40119..9cbfde938e 100644 --- a/lib/OpenLayers/Layer/Google.js +++ b/lib/OpenLayers/Layer/Google.js @@ -75,6 +75,13 @@ OpenLayers.Layer.Google = OpenLayers.Class( * other maps, etc. */ sphericalMercator: false, + + /** + * Property: dragObject + * {GDraggableObject} Since 2.93, Google has exposed the ability to get + * the maps GDraggableObject. We can now use this for smooth panning + */ + dragObject: null, /** * Constructor: OpenLayers.Layer.Google @@ -106,6 +113,14 @@ OpenLayers.Layer.Google = OpenLayers.Class( try { // create GMap, hide nav controls this.mapObject = new GMap2( this.div ); + + //since v 2.93 getDragObject is now available. + if(typeof this.mapObject.getDragObject == "function") { + this.dragObject = this.mapObject.getDragObject(); + } else { + this.dragPanMapObject = null; + } + // move the ToS and branding stuff up to the pane // thanks a *mil* Erik for thinking of this @@ -123,15 +138,8 @@ OpenLayers.Layer.Google = OpenLayers.Class( termsOfUse.style.right = ""; termsOfUse.style.bottom = ""; - //can we do smooth panning? (some versions don't) - if ( !this.mapObject.G || !this.mapObject.G.qb || - (typeof this.mapObject.G.qb != "function") ) { - - this.dragPanMapObject = null; - } - } catch (e) { - // do not crash + OpenLayers.Console.error(e); } }, @@ -343,11 +351,9 @@ OpenLayers.Layer.Google = OpenLayers.Class( * dY - {Integer} */ dragPanMapObject: function(dX, dY) { - var newX = this.mapObject.G.left - dX; - var newY = this.mapObject.G.top + dY; - this.mapObject.G.qb(newX, newY); + this.dragObject.moveBy(new GSize(-dX, dY)); }, - + /** * APIMethod: getMapObjectCenter * diff --git a/lib/OpenLayers/Map.js b/lib/OpenLayers/Map.js index fd84026c9e..6111fab61b 100644 --- a/lib/OpenLayers/Map.js +++ b/lib/OpenLayers/Map.js @@ -1317,27 +1317,33 @@ OpenLayers.Map = OpenLayers.Class({ * Parameters: * dx - {Integer} * dy - {Integer} - * options - {Object} Only one at this time: "animate", which uses - * panTo instead of setCenter. Default is true. + * options - {Object} Options to configure panning: + * - *animate* {Boolean} Use panTo instead of setCenter. Default is true. + * - *dragging* {Boolean} Call setCenter with dragging true. Default is + * false. */ pan: function(dx, dy, options) { - + // this should be pushed to applyDefaults and extend if (!options) { - options = {animate: true} - } + options = {}; + } + OpenLayers.Util.applyDefaults(options, { + animate: true, + dragging: false + }); // getCenter var centerPx = this.getViewPortPxFromLonLat(this.getCenter()); // adjust var newCenterPx = centerPx.add(dx, dy); - // only call setCenter if there has been a change - if (!newCenterPx.equals(centerPx)) { + // only call setCenter if not dragging or there has been a change + if (!options.dragging || !newCenterPx.equals(centerPx)) { var newCenterLonLat = this.getLonLatFromViewPortPx(newCenterPx); if (options.animate) { this.panTo(newCenterLonLat); } else { - this.setCenter(newCenterLonLat); + this.setCenter(newCenterLonLat, null, options.dragging); } }