OpenLayers OpenLayers

Ticket #110: 110-r5796-C0.diff

File 110-r5796-C0.diff, 6.0 kB (added by crschmidt, 1 year ago)

  • lib/OpenLayers/Map.js

    old new  
    12411241        // only call setCenter if there has been a change 
    12421242        if (!newCenterPx.equals(centerPx)) { 
    12431243            var newCenterLonLat = this.getLonLatFromViewPortPx(newCenterPx); 
    1244             this.setCenter(newCenterLonLat); 
     1244            this.panTo(newCenterLonLat); 
    12451245        } 
    12461246 
    12471247   }, 
     1248    
     1249   /**  
     1250     * APIMethod: panTo 
     1251     * Allows user to pan to a new lonlat 
     1252     * If the new lonlat is in the current extent the map will slide smoothly 
     1253     *  
     1254     * Parameters: 
     1255     * lonlat - {<OpenLayers.Lonlat>} 
     1256     */ 
     1257    panTo: function(lonlat) { 
     1258        if (this.getExtent().containsLonLat(lonlat)) { 
     1259            if (!this.panTween) { 
     1260                this.panTween = new OpenLayers.Tween(OpenLayers.Easing.Expo.easeOut); 
     1261            } 
     1262            var center = this.getCenter(); 
     1263            var from = { 
     1264                lon: center.lon, 
     1265                lat: center.lat 
     1266            }; 
     1267            var to = { 
     1268                lon: lonlat.lon, 
     1269                lat: lonlat.lat 
     1270            }; 
     1271            this.panTween.start(from, to, 50, { 
     1272                callbacks: { 
     1273                    start: OpenLayers.Function.bind(function(lonlat) { 
     1274                        this.events.triggerEvent("movestart"); 
     1275                    }, this), 
     1276                    eachStep: OpenLayers.Function.bind(function(lonlat) { 
     1277                        var lonlat = new OpenLayers.LonLat(lonlat.lon, lonlat.lat); 
     1278                        this.moveTo(lonlat, this.zoom, true); 
     1279                    }, this), 
     1280                    done: OpenLayers.Function.bind(function(lonlat) { 
     1281                        this.events.triggerEvent("moveend"); 
     1282                    }, this) 
     1283                } 
     1284            }); 
     1285        } else { 
     1286            this.setCenter(lonlat); 
     1287        } 
     1288    }, 
    12481289 
    12491290    /** 
    12501291     * APIMethod: setCenter 
    …… 
    12851326        var forceZoomChange = options.forceZoomChange; 
    12861327        // noEvent is false by default 
    12871328        var noEvent = options.noEvent; 
     1329 
     1330        if (this.panTween && options.source == "setCenter") { 
     1331            this.panTween.stop(); 
     1332        }     
    12881333              
    12891334        if (!this.center && !this.isValidLonLat(lonlat)) { 
    12901335            lonlat = this.maxExtent.getCenterLonLat(); 

  • lib/OpenLayers/Control/OverviewMap.js

    old new  
    510510     */ 
    511511    updateMapToRect: function() { 
    512512        var lonLatBounds = this.getMapBoundsFromRectBounds(this.rectPxBounds); 
    513         this.map.setCenter(lonLatBounds.getCenterLonLat(), this.map.zoom); 
     513        this.map.panTo(lonLatBounds.getCenterLonLat()); 
    514514    }, 
    515515 
    516516    /** 

  • examples/animated_panning.html

    old new  
     1<html xmlns="http://www.w3.org/1999/xhtml"> 
     2  <head> 
     3    <title>Tween Example</title> 
     4    <style type="text/css"> 
     5        #map { 
     6            width: 512px; 
     7            height: 256px; 
     8            border: 1px solid black; 
     9        } 
     10    </style> 
     11    <script src="../lib/OpenLayers.js"></script> 
     12    <script type="text/javascript"> 
     13        var map, layer, running = false; 
     14 
     15        OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                 
     16            defaultHandlerOptions: { 
     17                'single': true, 
     18                'delay': 200 
     19            }, 
     20 
     21            initialize: function(options) { 
     22                this.handlerOptions = OpenLayers.Util.extend( 
     23                    {}, this.defaultHandlerOptions 
     24                ); 
     25                OpenLayers.Control.prototype.initialize.apply( 
     26                    this, arguments 
     27                );  
     28                this.handler = new OpenLayers.Handler.Click( 
     29                    this, { 
     30                        'click': this.onClick  
     31                    }, this.handlerOptions 
     32                ); 
     33            },  
     34 
     35            onClick: function(evt) {   
     36                map.panTo(map.getLonLatFromPixel(evt.xy)); 
     37            }    
     38 
     39        }); 
     40 
     41        function init(){ 
     42            map = new OpenLayers.Map('map'); 
     43            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",  
     44                "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} ); 
     45                 
     46            map.addLayer(layer); 
     47            map.zoomToMaxExtent(); 
     48            var click = new OpenLayers.Control.Click(); 
     49            map.addControl(click); 
     50            click.activate(); 
     51            map.addControl(new OpenLayers.Control.OverviewMap()); 
     52        } 
     53 
     54        function setCenterInterval() { 
     55            if (!running) { 
     56                setCenter(); 
     57                running = setInterval('setCenter()', 500); 
     58            } else { 
     59                clearInterval(running); 
     60                running = false; 
     61            }     
     62        } 
     63         
     64        function setCenter() { 
     65            var lon = Math.random() * 360 - 180; 
     66            var lat = Math.random() * 180 - 90; 
     67            var lonlat = new OpenLayers.LonLat(lon, lat); 
     68            map.panTo(lonlat); 
     69        } 
     70    </script> 
     71  </head> 
     72  <body onload="init()"> 
     73    <h1 id="title">map.panTo Example</h1> 
     74    <div id="tags">map.panTo</div> 
     75    <div id="shortdesc">Show animated panning effects in the map</div> 
     76    <div id="map"></div> 
     77    <div id="docs"> 
     78        This is an example of transition effects. If the new random center is in the current extent, the map will pan smoothly. <br /> 
     79        The random selection will continue until you press it again. Additionally, you can single click in the map to pan smoothly 
     80        to that area, or use the pan control to pan smoothly. 
     81 
     82    </div> 
     83    <button onclick="setCenterInterval()">Start/stop random recenter</button> 
     84  </body> 
     85</html>