Changeset 2203

Timestamp:

02/05/07 11:01:55 (2 years ago)

Author:

emanuel

Message:

version 1.1

Files:

• sandbox/emanuel/animatedZooming (copied) (copied from trunk/openlayers)
• sandbox/emanuel/animatedZooming/demo.html (added)
• sandbox/emanuel/animatedZooming/demo_frida.html (added)
• sandbox/emanuel/animatedZooming/lib/OpenLayers/Control/OverviewMap.js (modified) (4 diffs)
• sandbox/emanuel/animatedZooming/lib/OpenLayers/Control/PanZoomBar.js (modified) (3 diffs)
• sandbox/emanuel/animatedZooming/lib/OpenLayers/Layer/Grid.js (modified) (2 diffs)
• sandbox/emanuel/animatedZooming/lib/OpenLayers/Map.js (modified) (2 diffs)

sandbox/emanuel/animatedZooming/lib/OpenLayers/Control/OverviewMap.js

@@ -384 +384 @@
-                (this.ovmap.getExtent().containsBounds(testExtent)));
-    },
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-        var targetRes = this.ovmap.getResolution();
-        var resRatio = targetRes / mapRes;
@@ -398 +409 @@
-        this.ovmap.setCenter(this.map.center,
-                            this.ovmap.getZoomForResolution(targetRes));
-
+bounds
-    },
-    
@@ -422 +433 @@
-        
-    /**
-
-
-
+
+
+
+
+
+
+
-        // The base layer for overview map needs to be in the same projection
-        // as the base layer for the main map.  This should be made more robust.
@@ -432 +447 @@
-            }
-        }
-
+
+
+
+
-        this.setRectPxBounds(pxBounds);
-    },

sandbox/emanuel/animatedZooming/lib/OpenLayers/Control/PanZoomBar.js

@@ -24 +24 @@
-    zoomStopHeight: 11,
-
+    /** @type int */
+    zoomlevel_startScale: null,  
+    
+    /** @type int */
+    zoomlevel_scale: null,   
+     
+    /** @type OpenLayers.Size */
+    tileSize_startScale: null, 
+    
+    /** @type OpenLayers.Size */
+    tileSize_scale: null,
+ 
+    /** @type float */
+    resolution_scale: null,
+
-    initialize: function() {
-        OpenLayers.Control.PanZoom.prototype.initialize.apply(this, arguments);
-        this.position = new OpenLayers.Pixel(OpenLayers.Control.PanZoomBar.X,
-                                             OpenLayers.Control.PanZoomBar.Y);
+        this.tileSize_scale = new OpenLayers.Size();
-    },
-
@@ -169 +185 @@
-        this.div.style.cursor = "move";
-        OpenLayers.Event.stop(evt);
+
+
+        //get current zoomlevel
+        this.zoomlevel_startScale = this.map.zoom;
+
+        //get original tile size
+        this.tileSize_startScale = this.map.getTileSize();
+
+        //find tile, which contains the center of the viewport
+        this.map.findCenterTile();
+
+        /*   
+        //set all active overlays temporarily invisible
+        for (var i = 0; i < this.map.layers.length; i++) {
+            var layer = this.map.layers[i];
+            if (!layer.isBaseLayer) {
+                this.map.layers[i].div.style.display = "none";
+            }
+        }
+        */
+
-    },
-    
@@ -188 +225 @@
-            this.mouseDragStart = evt.xy.clone();
-            OpenLayers.Event.stop(evt);
+
+
+
+            //convert current sliderposition to new zoomlevel
+            var deltaY_zoomlevel = this.zoomStart.y - evt.xy.y
+            this.zoomlevel_scale=this.zoomlevel_startScale + 
+              deltaY_zoomlevel/this.zoomStopHeight;
+           
+            //check the zoomlevel validity  
+            if (this.zoomlevel_scale < 0){
+                this.zoomlevel_scale = 0; 
+            } 
+            if (this.zoomlevel_scale >= this.map.getNumZoomLevels()){ 
+                this.zoomlevel_scale = this.map.getNumZoomLevels() - 1; 
+            }
+            
+            //calculate the new tile size for the scale...
+            //...zoomIn
+            if (this.zoomlevel_startScale < this.zoomlevel_scale) {
+                this.tileSize_scale.w = 
+                  Math.pow(2,(this.zoomlevel_scale -
+                  this.zoomlevel_startScale)) * this.tileSize_startScale.w;
+                this.tileSize_scale.h = 
+                  Math.pow(2,(this.zoomlevel_scale -
+                  this.zoomlevel_startScale)) * this.tileSize_startScale.h;
+
+                // set new map resolution
+                this.resolution_scale = 
+                  1/(Math.pow(2,(this.zoomlevel_scale - 
+                  this.zoomlevel_startScale))) *  this.map.getResolution();    
+              
+            }
+            //...zoomOut / no zoomchanges
+            if (this.zoomlevel_startScale >= this.zoomlevel_scale) {             
+                this.tileSize_scale.w =
+                  1/(Math.pow(2,(this.zoomlevel_startScale -
+                  this.zoomlevel_scale))) * this.tileSize_startScale.w;
+                this.tileSize_scale.h =
+                  1/(Math.pow(2,(this.zoomlevel_startScale - 
+                  this.zoomlevel_scale))) * this.tileSize_startScale.h;
+
+                // set new map resolution
+                this.resolution_scale = 
+                  Math.pow(2,(this.zoomlevel_startScale - 
+                  this.zoomlevel_scale)) * this.map.getResolution(); 
+
+            }
+
+            // set new scaled tile size 
+            this.map.scaleTileTo(this.tileSize_scale);
+            
+            // set new scaled map resolution
+            this.map.setScaleResolution(this.resolution_scale);
+
-        }
-    },

sandbox/emanuel/animatedZooming/lib/OpenLayers/Layer/Grid.js

@@ -23 +23 @@
-    /** @type Integer */
-    buffer: 2,
+
+    /** @type OpenLayers.Tile */
+    centerTile: null,
+
+    /** @type Integer */
+    centerRow: null,
+
+    /** @type Integer */
+    centerCol: null,
+
+    /** @type OpenLayers.Pixel */   
+    centerTileStartScalePos: null,
+
+
-
-    /**
@@ -140 +154 @@
-    },
-    
+
+    /** finds and sets the tile, which contains the center 
+     *  of the viewport
+     *
+     */
+    findCenterTile:function() {
+        
+        //get the center of the map (viewport)
+        var center = this.map.getCenter();
+
+        //find tile, which contains the center of the viewport
+        this.centerTile = null;
+        if (this.grid) {
+            for (var iRow=0; iRow < this.grid.length; iRow++) {
+                for (var iCol=0; iCol < this.grid[iRow].length; iCol++) {
+                    var tileBounds = this.grid[iRow][iCol].bounds;
+                    if (tileBounds.containsLonLat(center, true)) {
+                        this.centerTile = this.grid[iRow][iCol];
+                        this.centerRow = iRow;
+                        this.centerCol = iCol;
+                        break; 
+                    }
+                }
+                if (this.centerTile)
+                    break;
+            }
+        }
+        
+        //define real position of the center tile before scaling
+        //(It is tricky if you pan the map before scaling. Then the
+        //layerContainerDiv is only slided and you have to add this
+        //difference to the tile position)
+        var x = parseInt(this.centerTile.imgDiv.style.left) +
+          parseInt(this.map.layerContainerDiv.style.left);
+        var y = parseInt(this.centerTile.imgDiv.style.top) +
+          parseInt(this.map.layerContainerDiv.style.top);
+
+        this.centerTileStartScalePos = new OpenLayers.Pixel(x,y);
+    },
+
+
+    /** scales all tiles to the new size (changes size 
+     *  and position of every tile)
+     * 
+     * @param {OpenLayers.Size}
+     */
+    scaleTileTo:function(newTileSize) {
+        
+        //convert the current center of the map in pixel
+        var centerPx = this.map.getPixelFromLonLat(this.map.getCenter());
+
+        //reposition the center tile 
+        if (this.centerTile ) {
+            //set new left position
+            var leftOffset = newTileSize.w / this.centerTile.size.w *
+              (centerPx.x - this.centerTileStartScalePos.x);
+            leftOffset = Math.round(leftOffset);
+            var newLeftPos = centerPx.x - leftOffset
+              - parseInt(this.map.layerContainerDiv.style.left);
+            this.centerTile.imgDiv.style.left = newLeftPos + "px";
+
+            //set new top position
+            var topOffset = newTileSize.h / this.centerTile.size.h *
+              (centerPx.y - this.centerTileStartScalePos.y);
+            topOffset = Math.round(topOffset);
+            var newTopPos = centerPx.y - topOffset 
+              - parseInt(this.map.layerContainerDiv.style.top);
+            this.centerTile.imgDiv.style.top = newTopPos + "px";
+        }
+        
+        //reposition and resize all tiles of all active layers
+        var baseLayerGrid = this.grid;
+        for (var i = 0; i < this.map.layers.length; i++) {
+            var layerGrid = this.map.layers[i].grid;
+            //go through the whole grid of every layer
+            for (var iRow=0; iRow < layerGrid.length; iRow++) {
+                for (var iCol=0; iCol < layerGrid[iRow].length; iCol++) { 
+                    if (layerGrid[iRow][iCol].imgDiv) {
+                        //define the factors for rows and columns (relates to the center tile)
+                        var deltaRow = iRow - this.centerRow;
+                        var deltaCol = iCol - this.centerCol;
+                        
+                        //set new left position
+                        var newLeftPos = parseInt(this.centerTile.imgDiv.style.left)
+                          + deltaCol * newTileSize.w ;
+                        layerGrid[iRow][iCol].imgDiv.style.left = newLeftPos + "px";
+
+                        //set new top position
+                        var newTopPos = parseInt(this.centerTile.imgDiv.style.top)
+                          + deltaRow * newTileSize.h ;
+                        layerGrid[iRow][iCol].imgDiv.style.top = newTopPos + "px";
+
+                        //set new width and height
+                        layerGrid[iRow][iCol].imgDiv.style.width = newTileSize.w + "px";
+                        layerGrid[iRow][iCol].imgDiv.style.height = newTileSize.h + "px";
+                    }
+                }
+            }
+        }
+    },
+
+
+    
-    /**
-     * @private

sandbox/emanuel/animatedZooming/lib/OpenLayers/Map.js

@@ -709 +709 @@
-        }
-        
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-        var centerChanged = (this.isValidLonLat(lonlat)) && 
@@ -835 +854 @@
-    },
-
+
+
+    /** finds and sets the tile, which contains the center 
+     *  of the viewport
+     *
+     */
+    findCenterTile: function () {
+        this.baseLayer.findCenterTile();
+    },
+
+    /** scales all tiles to the new size (changes size 
+     *  and position of every tile)
+     * 
+     * @param {OpenLayers.Size}
+     */   
+    scaleTileTo: function (newTileSize) {
+       this.baseLayer.scaleTileTo(newTileSize);
+    },
+
+    /** sets the map resolution during zooming/scaling
+     * 
+     * @param {float}
+     */ 
+    setScaleResolution: function (newResolution) {
+        //calculate the current bounds of the new viewport
+        var newScaleBounds = this.calculateBounds(this.getCenter(), newResolution);
+        
+        //update the overviewMap
+        for (i=0; i<this.controls.length; i++) {
+            if (this.controls[i].CLASS_NAME == "OpenLayers.Control.OverviewMap") 
+                this.controls[i].updateOverview(newResolution, newScaleBounds);
+        }          
+    },
+
+
+
-  /********************************************************/
-  /*                                                      */