[OpenLayers-Commits] r11412 - in sandbox/ahocevar/layercontainer: lib/OpenLayers tests

commits-20090109 at openlayers.org commits-20090109 at openlayers.org
Thu Feb 24 08:37:35 EST 2011


Author: ahocevar
Date: 2011-02-24 05:37:34 -0800 (Thu, 24 Feb 2011)
New Revision: 11412

Modified:
   sandbox/ahocevar/layercontainer/lib/OpenLayers/Layer.js
   sandbox/ahocevar/layercontainer/lib/OpenLayers/Map.js
   sandbox/ahocevar/layercontainer/tests/Map.html
Log:
reverted all code that gives the layerContainerDiv a position and dimension, and all extent and center caching code

Modified: sandbox/ahocevar/layercontainer/lib/OpenLayers/Layer.js
===================================================================
--- sandbox/ahocevar/layercontainer/lib/OpenLayers/Layer.js	2011-02-24 13:36:41 UTC (rev 11411)
+++ sandbox/ahocevar/layercontainer/lib/OpenLayers/Layer.js	2011-02-24 13:37:34 UTC (rev 11412)
@@ -1212,12 +1212,21 @@
     getLonLatFromViewPortPx: function (viewPortPx) {
         var lonlat = null;
         if (viewPortPx != null) {
-            var map = this.map;
-            var res = map.getResolution();
-            var maxExtent = map.getMaxExtent();
-            var lon = (viewPortPx.x - map.minPx.x) * res + maxExtent.left;
-            var lat = (map.minPx.y - viewPortPx.y) * res + maxExtent.top;
-            lonlat = new OpenLayers.LonLat(lon, lat);
+            var size = this.map.getSize();
+            var center = this.map.getCenter();
+            if (center) {
+                var res  = this.map.getResolution();
+        
+                var delta_x = viewPortPx.x - (size.w / 2);
+                var delta_y = viewPortPx.y - (size.h / 2);
+            
+                lonlat = new OpenLayers.LonLat(center.lon + delta_x * res ,
+                                             center.lat - delta_y * res); 
+
+                if (this.wrapDateLine) {
+                    lonlat = lonlat.wrapDateLine(this.maxExtent);
+                }
+            } // else { DEBUG STATEMENT }
         }
         return lonlat;
     },
@@ -1237,12 +1246,12 @@
     getViewPortPxFromLonLat: function (lonlat) {
         var px = null; 
         if (lonlat != null) {
-            var map = this.map;
-            var res = map.getResolution();
-            var maxExtent = map.getMaxExtent();
-            var x = map.minPx.x + (lonlat.lon - maxExtent.left) / res;
-            var y = map.minPx.y + (maxExtent.top - lonlat.lat) / res;
-            px = new OpenLayers.Pixel(x, y);
+            var resolution = this.map.getResolution();
+            var extent = this.map.getExtent();
+            px = new OpenLayers.Pixel(
+                (1/resolution * (lonlat.lon - extent.left)),
+                (1/resolution * (extent.top - lonlat.lat))
+            );    
         }
         return px;
     },

Modified: sandbox/ahocevar/layercontainer/lib/OpenLayers/Map.js
===================================================================
--- sandbox/ahocevar/layercontainer/lib/OpenLayers/Map.js	2011-02-24 13:36:41 UTC (rev 11411)
+++ sandbox/ahocevar/layercontainer/lib/OpenLayers/Map.js	2011-02-24 13:37:34 UTC (rev 11412)
@@ -178,6 +178,13 @@
     viewPortDiv: null,
 
     /**
+     * Property: layerContainerOrigin
+     * {<OpenLayers.LonLat>} The lonlat at which the later container was
+     *                       re-initialized (on-zoom)
+     */
+    layerContainerOrigin: null,
+
+    /**
      * Property: layerContainerDiv
      * {HTMLDivElement} The element that contains the layers.
      */
@@ -1141,7 +1148,7 @@
             if (OpenLayers.Util.indexOf(this.layers, newBaseLayer) != -1) {
 
                 // preserve center and scale when changing base layers
-                var center = this.getCachedCenter();
+                var center = this.getCenter();
                 var newResolution = OpenLayers.Util.getResolutionFromScale(
                     this.getScale(), newBaseLayer.units
                 );
@@ -1403,7 +1410,7 @@
                     this.layers[i].onMapResize();                
                 }
     
-                var center = this.getCachedCenter();
+                var center = this.getCenter();
     
                 if (this.baseLayer != null && center != null) {
                     var zoom = this.zoom;
@@ -1454,7 +1461,7 @@
         var extent = null;
         
         if (center == null) {
-            center = this.getCachedCenter();
+            center = this.getCenter();
         }                
         if (resolution == null) {
             resolution = this.getResolution();
@@ -1494,27 +1501,13 @@
      */
     getCenter: function () {
         var center = null;
-        var cachedCenter = this.getCachedCenter();
-        if (cachedCenter) {
-            center = cachedCenter.clone();
+        if (this.center) {
+            center = this.center.clone();
         }
         return center;
     },
 
     /**
-     * Method: getCachedCenter
-     *
-     * Returns:
-     * {<OpenLayers.LonLat>}
-     */
-    getCachedCenter: function() {
-        if (!this.center) {
-            this.center = this.getLonLatFromViewPortPx(this.centerPx);
-        }
-        return this.center;
-    },
-    
-    /**
      * Method: getCachedCenterPx
      *
      * Returns:
@@ -1590,11 +1583,11 @@
      * lonlat - {<OpenLayers.Lonlat>}
      */
     panTo: function(lonlat) {
-        if (this.panMethod && this.getCachedExtent().scale(this.panRatio).containsLonLat(lonlat)) {
+        if (this.panMethod && this.getExtent().scale(this.panRatio).containsLonLat(lonlat)) {
             if (!this.panTween) {
                 this.panTween = new OpenLayers.Tween(this.panMethod);
             }
-            var center = this.getCachedCenter();
+            var center = this.getCenter();
 
             // center will not change, don't do nothing
             if (lonlat.lon == center.lon &&
@@ -1712,104 +1705,116 @@
         if (!options) { 
             options = {};
         }
+        if (zoom != null) {
+            zoom = parseFloat(zoom);
+            if (!this.fractionalZoom) {
+                zoom = Math.round(zoom);
+            }
+        }
         // dragging is false by default
         var dragging = options.dragging;
         // forceZoomChange is false by default
         var forceZoomChange = options.forceZoomChange;
         // noEvent is false by default
         var noEvent = options.noEvent;
-        
+
         if (this.panTween && options.caller == "setCenter") {
             this.panTween.stop();
         }    
+             
+        if (!this.center && !this.isValidLonLat(lonlat)) {
+            lonlat = this.maxExtent.getCenterLonLat();
+        }
 
-        var zoomChanged = forceZoomChange;
-        if (zoom != null) {
-            if (typeof zoom != "number") {
-                zoom = parseFloat(zoom);
+        if(this.restrictedExtent != null) {
+            // In 3.0, decide if we want to change interpretation of maxExtent.
+            if(lonlat == null) { 
+                lonlat = this.getCenter(); 
             }
-            if (!this.fractionalZoom) {
-                zoom = Math.round(zoom);
+            if(zoom == null) { 
+                zoom = this.getZoom(); 
             }
-        }
-        zoomChanged = zoomChanged ||
-            zoom != this.zoom && this.isValidZoomLevel(zoom);
-        var res;
-        if (zoomChanged) {
-            res = this.resolution = this.getResolutionForZoom(zoom);
-        } else {
-            res = this.resolution = this.getResolution();
-        }
-        
-        if (lonlat) {
-            if (this.restrictedExtent) {
-                var extent = this.calculateBounds(lonlat, res);
-                if (!this.restrictedExtent.containsBounds(extent)) {
-                    var maxCenter = this.restrictedExtent.getCenterLonLat(); 
-                    if (extent.getWidth() > this.restrictedExtent.getWidth()) { 
-                        lonlat = new OpenLayers.LonLat(maxCenter.lon, lonlat.lat); 
-                    } else if (extent.left < this.restrictedExtent.left) {
-                        lonlat = lonlat.add(this.restrictedExtent.left -
-                                            extent.left, 0); 
-                    } else if (extent.right > this.restrictedExtent.right) { 
-                        lonlat = lonlat.add(this.restrictedExtent.right -
-                                            extent.right, 0); 
-                    } 
-                    if (extent.getHeight() > this.restrictedExtent.getHeight()) { 
-                        lonlat = new OpenLayers.LonLat(lonlat.lon, maxCenter.lat); 
-                    } else if (extent.bottom < this.restrictedExtent.bottom) { 
-                        lonlat = lonlat.add(0, this.restrictedExtent.bottom -
-                                            extent.bottom); 
-                    } 
-                    else if (extent.top > this.restrictedExtent.top) { 
-                        lonlat = lonlat.add(0, this.restrictedExtent.top -
-                                            extent.top); 
-                    }
-                }
+            var resolution = this.getResolutionForZoom(zoom);
+            var extent = this.calculateBounds(lonlat, resolution); 
+            if(!this.restrictedExtent.containsBounds(extent)) {
+                var maxCenter = this.restrictedExtent.getCenterLonLat(); 
+                if(extent.getWidth() > this.restrictedExtent.getWidth()) { 
+                    lonlat = new OpenLayers.LonLat(maxCenter.lon, lonlat.lat); 
+                } else if(extent.left < this.restrictedExtent.left) {
+                    lonlat = lonlat.add(this.restrictedExtent.left -
+                                        extent.left, 0); 
+                } else if(extent.right > this.restrictedExtent.right) { 
+                    lonlat = lonlat.add(this.restrictedExtent.right -
+                                        extent.right, 0); 
+                } 
+                if(extent.getHeight() > this.restrictedExtent.getHeight()) { 
+                    lonlat = new OpenLayers.LonLat(lonlat.lon, maxCenter.lat); 
+                } else if(extent.bottom < this.restrictedExtent.bottom) { 
+                    lonlat = lonlat.add(0, this.restrictedExtent.bottom -
+                                        extent.bottom); 
+                } 
+                else if(extent.top > this.restrictedExtent.top) { 
+                    lonlat = lonlat.add(0, this.restrictedExtent.top -
+                                        extent.top); 
+                } 
             }
         }
+        
+        var zoomChanged = forceZoomChange || (
+                            (this.isValidZoomLevel(zoom)) && 
+                            (zoom != this.getZoom()) );
 
-        var oldCenter = this.getCachedCenter();
+        var centerChanged = (this.isValidLonLat(lonlat)) && 
+                            (!lonlat.equals(this.center));
 
-        if (zoomChanged) {
-            var maxExtent = this.getMaxExtent();
-            this.layerContainerDiv.style.width =
-                Math.round(maxExtent.getWidth() / res) + "px";
-            this.layerContainerDiv.style.height  =
-                Math.round(maxExtent.getHeight() / res) + "px";
-            this.zoom = zoom;
-            // zoom level has changed, increment viewRequestID.
-            this.viewRequestID++;
-        }
-        
-        var centerChanged =
-            this.isValidLonLat(lonlat) && !lonlat.equals(oldCenter);
-        if (centerChanged || !oldCenter) {
-            if (!oldCenter && !this.isValidLonLat(lonlat)) {
-                lonlat = this.maxExtent.getCenterLonLat();
-            }
-        }
-        
+
         // if neither center nor zoom will change, no need to do anything
         if (zoomChanged || centerChanged || !dragging) {
 
-            if (zoomChanged || centerChanged) {
-                if (!lonlat) {
-                    lonlat = oldCenter;
+            if (!this.dragging && !noEvent) {
+                this.events.triggerEvent("movestart");
+            }
+
+            if (centerChanged) {
+                if ((!zoomChanged) && (this.center)) { 
+                    // if zoom hasnt changed, just slide layerContainer
+                    //  (must be done before setting this.center to new value)
+                    this.centerLayerContainer(lonlat);
                 }
-                this.center = lonlat;
-                this.centerLayerContainer(lonlat);
+                this.center = lonlat.clone();
             }
 
-            if (!this.dragging && !noEvent) {
-                this.events.triggerEvent("movestart");
+            // (re)set the layerContainerDiv's location
+            if ((zoomChanged) || (this.layerContainerOrigin == null)) {
+                this.layerContainerOrigin = this.center.clone();
+                this.layerContainerDiv.style.left = "0px";
+                this.layerContainerDiv.style.top  = "0px";
+                var res = this.resolution || this.getResolutionForZoom(zoom);
+                var maxExtent = this.getMaxExtent();
+                var maxExtentCenter = maxExtent.getCenterLonLat();
+                var lonDelta = this.center.lon - maxExtentCenter.lon;
+                var latDelta = maxExtentCenter.lat - this.center.lat;
+                var extentWidth = Math.round(maxExtent.getWidth() / res);
+                var extentHeight = Math.round(maxExtent.getHeight() / res);
+                var left = (this.size.w - extentWidth) / 2 - lonDelta / res;
+                var top = (this.size.h - extentHeight) / 2 - latDelta / res;
+                this.minPx = new OpenLayers.Pixel(left, top);
+                this.maxPx = new OpenLayers.Pixel(left + extentWidth, top + extentHeight);
             }
+
+            if (zoomChanged) {
+                this.zoom = zoom;
+                this.resolution = this.getResolutionForZoom(zoom);
+                // zoom level has changed, increment viewRequestID.
+                this.viewRequestID++;
+            }    
             
-            this.extent = this.baseLayer.getExtent();
+            var bounds = this.getExtent();
             
             //send the move call to the baselayer and all the overlays    
+
             if(this.baseLayer.visibility) {
-                this.baseLayer.moveTo(this.extent, zoomChanged, dragging);
+                this.baseLayer.moveTo(bounds, zoomChanged, dragging);
                 if(dragging) {
                     this.baseLayer.events.triggerEvent("move");
                 } else {
@@ -1818,7 +1823,9 @@
                     );
                 }
             }
-                                    
+            
+            bounds = this.baseLayer.getExtent();
+            
             for (var i=0, len=this.layers.length; i<len; i++) {
                 var layer = this.layers[i];
                 if (layer !== this.baseLayer && !layer.isBaseLayer) {
@@ -1837,7 +1844,7 @@
                         });
                     }
                     if (inRange && layer.visibility) {
-                        layer.moveTo(this.extent, zoomChanged, dragging);
+                        layer.moveTo(bounds, zoomChanged, dragging);
                         if(dragging) {
                             layer.events.triggerEvent("move");
                         } else {
@@ -1865,12 +1872,13 @@
         if (!dragging && !noEvent) {
             this.events.triggerEvent("moveend");
         }
-        
+
         // Store the map dragging state for later use
         this.dragging = !!dragging; 
 
     },
 
+
     /** 
      * Method: centerLayerContainer
      * This function takes care to recenter the layerContainerDiv.
@@ -1879,20 +1887,24 @@
      * lonlat - {<OpenLayers.LonLat>}
      */
     centerLayerContainer: function (lonlat) {
-        var res = this.resolution;
-        var center = this.getMaxExtent().getCenterLonLat();
-        var lonDelta = lonlat.lon - center.lon;
-        var latDelta = center.lat - lonlat.lat;
-        var extentWidth = parseInt(this.layerContainerDiv.style.width);
-        var extentHeight = parseInt(this.layerContainerDiv.style.height);
-        var halfViewPortWidth = this.size.w / 2;
-        var halfViewPortHeight = this.size.h / 2;
-        var left = halfViewPortWidth - extentWidth / 2 - lonDelta / res;
-        var top = halfViewPortHeight - extentHeight / 2 - latDelta / res;
-        this.layerContainerDiv.style.left = Math.round(left) + "px";
-        this.layerContainerDiv.style.top  = Math.round(top) + "px";
-        this.minPx = new OpenLayers.Pixel(left, top);
-        this.maxPx = new OpenLayers.Pixel(left + extentWidth, top + extentHeight);
+        var originPx = this.getViewPortPxFromLonLat(this.layerContainerOrigin);
+        var newPx = this.getViewPortPxFromLonLat(lonlat);
+
+        if ((originPx != null) && (newPx != null)) {
+            var oldLeft = parseInt(this.layerContainerDiv.style.left);
+            var oldTop = parseInt(this.layerContainerDiv.style.top);
+            var newLeft = Math.round(originPx.x - newPx.x);
+            var newTop = Math.round(originPx.y - newPx.y);
+            this.layerContainerDiv.style.left = newLeft + "px";
+            this.layerContainerDiv.style.top  = newTop + "px";
+            var dx = oldLeft - newLeft;
+            var dy = oldTop - newTop;
+            this.minPx.x -= dx;
+            this.maxPx.x -= dx;
+            this.minPx.y -= dy;
+            this.maxPx.y -= dy;
+        }
+
     },
 
     /**
@@ -2061,27 +2073,13 @@
      */
     getExtent: function () {
         var extent = null;
-        var cachedExtent = this.getCachedExtent();
-        if (cachedExtent) {
-            extent = cachedExtent.clone();
+        if (this.baseLayer != null) {
+            extent = this.baseLayer.getExtent();
         }
         return extent;
     },
     
     /**
-     * Method: getCachedExtent
-     *
-     * Returns:
-     * {<OpenLayers.Bounds>}
-     */
-    getCachedExtent: function() {
-        if (!this.extent) {
-            this.extent = this.baseLayer.getExtent();
-        }
-        return this.extent;
-    },
-
-    /**
      * APIMethod: getResolution
      * 
      * Returns:
@@ -2320,7 +2318,7 @@
         var size = this.size;
         var w_deg = size.w * res;
         var h_deg = size.h * res;
-        var center = this.getCachedCenter();
+        var center = this.getCenter();
 
         var extent = new OpenLayers.Bounds(center.lon - w_deg / 2,
                                            center.lat - h_deg / 2,
@@ -2432,8 +2430,8 @@
      * {<OpenLayers.Size>} The geodesic size of the pixel in kilometers.
      */
     getGeodesicPixelSize: function(px) {
-        var lonlat = px ? this.getLonLatFromPixel(px) :
-            (this.getCachedCenter() || new OpenLayers.LonLat(0, 0));
+        var lonlat = px ? this.getLonLatFromPixel(px) : (this.getCenter() || 
+            new OpenLayers.LonLat(0, 0));
         var res = this.getResolution();
         var left = lonlat.add(-res / 2, 0);
         var right = lonlat.add(res / 2, 0);
@@ -2473,12 +2471,9 @@
     getViewPortPxFromLayerPx:function(layerPx) {
         var viewPortPx = null;
         if (layerPx != null) {
-            var res = this.resolution;
-            var center = this.getMaxExtent().getCenterLonLat();
-            var oldCenter = this.getCachedCenter();
-            var dx = Math.round(center.lon / res - oldCenter.lon / res);
-            var dy = Math.round(oldCenter.lat / res - center.lat / res);
-            viewPortPx = layerPx.add(dx, dy);
+            var dX = parseInt(this.layerContainerDiv.style.left);
+            var dY = parseInt(this.layerContainerDiv.style.top);
+            viewPortPx = layerPx.add(dX, dY);            
         }
         return viewPortPx;
     },
@@ -2496,12 +2491,12 @@
     getLayerPxFromViewPortPx:function(viewPortPx) {
         var layerPx = null;
         if (viewPortPx != null) {
-            var res = this.resolution;
-            var center = this.getMaxExtent().getCenterLonLat();
-            var oldCenter = this.getCachedCenter();
-            var dx = Math.round(oldCenter.lon / res - center.lon / res);
-            var dy = Math.round(center.lat / res - oldCenter.lat / res);
-            layerPx = viewPortPx.add(dx, dy);
+            var dX = -parseInt(this.layerContainerDiv.style.left);
+            var dY = -parseInt(this.layerContainerDiv.style.top);
+            layerPx = viewPortPx.add(dX, dY);
+            if (isNaN(layerPx.x) || isNaN(layerPx.y)) {
+                layerPx = null;
+            }
         }
         return layerPx;
     },

Modified: sandbox/ahocevar/layercontainer/tests/Map.html
===================================================================
--- sandbox/ahocevar/layercontainer/tests/Map.html	2011-02-24 13:36:41 UTC (rev 11411)
+++ sandbox/ahocevar/layercontainer/tests/Map.html	2011-02-24 13:37:34 UTC (rev 11412)
@@ -797,20 +797,23 @@
         map.destroy();
     }
 
-    function test_Map_setBaseLayer_containerdiv (t) {
-        t.plan(4);
+    function test_Map_setBaseLayer_after_pan (t) {
+        t.plan(1);
 
         map = new OpenLayers.Map('map');
-        map.addLayer(new OpenLayers.Layer(null, {isBaseLayer: true}));
+        var wmsLayer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+            "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+        var tmsLayer = new OpenLayers.Layer.TMS("TMS",
+                                    "http://labs.metacarta.com/wms-c/Basic.py/",
+                                    {'layername':'basic', 'type':'png'});
+        map.addLayers([wmsLayer,tmsLayer]);
+        map.setBaseLayer(wmsLayer);
         map.zoomToMaxExtent();
-        var res = map.getResolution();
-        t.eq(map.layerContainerDiv.style.top, (150-90/res)+"px", "layerContainer.style.top is correct");
-        t.eq(map.layerContainerDiv.style.left, (300-180/res)+"px", "layerContainer.style.left is correct");
+        map.setBaseLayer(tmsLayer);
         map.zoomIn();
-        map.pan(50, -200, {animate:false});
-        var res = map.getResolution();
-        t.eq(map.layerContainerDiv.style.top, (350-90/res)+"px", "layerContainer.style.top is correct");
-        t.eq(map.layerContainerDiv.style.left, (250-180/res)+"px", "layerContainer.style.left is correct");
+        map.pan(0, -200, {animate:false});
+        map.setBaseLayer(wmsLayer);
+        t.eq(map.layerContainerDiv.style.top, "0px", "layerContainer is recentered after setBaseLayer");
         
         map.destroy();
     }
@@ -1316,7 +1319,7 @@
         var m = {
             'baseLayer': { 'units': {} },
             'size': {'w': 10, 'h': 15},
-            'getCachedCenter': function() {return {'lon': -5, 'lat': -25};},
+            'getCenter': function() {return {'lon': -5, 'lat': -25};},
             'zoomToExtent': function(extent, closest) {
                 t.ok(extent.equals(g_ExpectedExtent), "extent correctly calculated for zoomToExtent()");
                 t.ok(closest == g_Closest, "closest correctly passed on to zoomToExtent()");



More information about the Commits mailing list