OpenLayers OpenLayers

Ticket #110: patch-110-r5796-B0.diff

File patch-110-r5796-B0.diff, 9.4 kB (added by pgiraud, 1 year ago)

  • lib/OpenLayers/Map.js

    old new  
    12121212        } 
    12131213 
    12141214   }, 
     1215    
     1216   /**  
     1217     * APIMethod: panTo 
     1218     * Allows user to pan to a new lonlat 
     1219     * If the new lonlat is in the current extent the map will slide smoothly 
     1220     *  
     1221     * Parameters: 
     1222     * lonlat - {<OpenLayers.Lonlat>} 
     1223     */ 
     1224    panTo: function(lonlat) { 
     1225        if (this.getExtent().containsLonLat(lonlat)) { 
     1226            if (!this.panTween) { 
     1227                this.panTween = new OpenLayers.Tween(OpenLayers.Easing.Expo.easeOut); 
     1228            } 
     1229            var center = this.getCenter(); 
     1230            var from = { 
     1231                lon: center.lon, 
     1232                lat: center.lat 
     1233            }; 
     1234            var to = { 
     1235                lon: lonlat.lon, 
     1236                lat: lonlat.lat 
     1237            }; 
     1238            this.panTween.start(from, to, 50, { 
     1239                callbacks: { 
     1240                    start: OpenLayers.Function.bind(function(lonlat) { 
     1241                        this.events.triggerEvent("movestart"); 
     1242                    }, this), 
     1243                    eachStep: OpenLayers.Function.bind(function(lonlat) { 
     1244                        var lonlat = new OpenLayers.LonLat(lonlat.lon, lonlat.lat); 
     1245                        this.setCenter(lonlat, this.zoom, true); 
     1246                    }, this), 
     1247                    done: OpenLayers.Function.bind(function(lonlat) { 
     1248                        this.events.triggerEvent("moveend"); 
     1249                    }, this) 
     1250                } 
     1251            }); 
     1252        } else { 
     1253            this.setCenter(lonlat); 
     1254        } 
     1255    }, 
    12151256 
    12161257    /** 
    12171258     * APIMethod: setCenter 

  • lib/OpenLayers/Control/OverviewMap.js

    old new  
    508508     */ 
    509509    updateMapToRect: function() { 
    510510        var lonLatBounds = this.getMapBoundsFromRectBounds(this.rectPxBounds); 
    511         this.map.setCenter(lonLatBounds.getCenterLonLat(), this.map.zoom); 
     511        this.map.panTo(lonLatBounds.getCenterLonLat()); 
    512512    }, 
    513513 
    514514    /** 

  • lib/OpenLayers/Tween.js

    old new  
     1/* Copyright (c) 2006-2007 MetaCarta, Inc., published under the Clear BSD 
     2 * license.  See http://svn.openlayers.org/trunk/openlayers/license.txt for the 
     3 * full text of the license. */ 
     4 
     5/** 
     6 * Namespace: OpenLayers.Tween 
     7 */ 
     8OpenLayers.Tween = OpenLayers.Class({ 
     9     
     10    /** 
     11     * Constant: INTERVAL 
     12     * Interval in milliseconds between 2 steps 
     13     */ 
     14    INTERVAL: 10, 
     15     
     16    /** 
     17     *  
     18     * Params: 
     19     * easing - {<OpenLayers.Easing>(Function)} easing function method to use 
     20     */  
     21    initialize: function(easing) { 
     22        this.easing = easing; 
     23    }, 
     24     
     25    /** 
     26     * APIMethod: start 
     27     * Plays the Tween, and calls the callback method on each step 
     28     *  
     29     * begin - {int} begin value  
     30     * finish - {int} finish value 
     31     * duration - {int} duration of the tween (number of steps) 
     32     * callback - {Function} callback called on each step 
     33     */ 
     34    start: function(begin, finish, duration, callback) { 
     35        this.begin = begin; 
     36        this.finish = finish; 
     37        this.duration = duration; 
     38        this.time = 0; 
     39        if (this.interval) { 
     40            window.clearInterval(this.interval); 
     41            this.interval = null; 
     42        } 
     43        this.interval = window.setInterval( 
     44            OpenLayers.Function.bind(this.ease, this, callback), this.INTERVAL); 
     45    }, 
     46     
     47    /** 
     48     * Method: ease 
     49     * Calls the appropriate easing method 
     50     *  
     51     * callback - {Function} callback 
     52     */ 
     53    ease: function(callback) { 
     54        if (this.time >= this.duration) { 
     55            window.clearInterval(this.interval); 
     56            this.interval = null; 
     57        } 
     58         
     59        var value = {}; 
     60         
     61        if (typeof this.begin != 'object') { 
     62            this.begin = [this.begin]; 
     63            this.finish = [this.finish]; 
     64        } 
     65        for (var i in this.begin) { 
     66            var b = this.begin[i]; 
     67            var f = this.finish[i]; 
     68            if (b == null || f == null || isNaN(b) || isNaN(f)) { 
     69                OpenLayers.Console.error('invalid value for Tween'); 
     70            } 
     71             
     72            var c = f - b; 
     73            value[i] = this.easing.apply(this, [this.time, b, c, this.duration]); 
     74        } 
     75        this.time++; 
     76        callback.call(this, value); 
     77    }, 
     78     
     79    /** 
     80     * Create empty functions for all easing methods. 
     81     */ 
     82    CLASS_NAME: "OpenLayers.Tween" 
     83}); 
     84 
     85/** 
     86 * Namespace: OpenLayers.Easing 
     87 *  
     88 * Credits: 
     89 *      Easing Equations by Robert Penner, <http://www.robertpenner.com/easing/> 
     90 */ 
     91OpenLayers.Easing = { 
     92    /** 
     93     * Create empty functions for all easing methods. 
     94     */ 
     95    CLASS_NAME: "OpenLayers.Easing" 
     96} 
     97 
     98/** 
     99 * Namespace: OpenLayers.Easing.Linear 
     100 */ 
     101OpenLayers.Easing.Linear = { 
     102     
     103    /** 
     104     * APIFunction: easeIn 
     105     *  
     106     * Parameters: 
     107     * t - {Float} time 
     108     * b - {Float} beginning position 
     109     * c - {Float} total change 
     110     * d - {Float} duration of the transition 
     111     */ 
     112    easeIn: function(t, b, c, d) { 
     113        return c*t/d + b; 
     114    }, 
     115     
     116    /** 
     117     * APIFunction: easeOut 
     118     *  
     119     * Parameters: 
     120     * t - {Float} time 
     121     * b - {Float} beginning position 
     122     * c - {Float} total change 
     123     * d - {Float} duration of the transition 
     124     */ 
     125    easeOut: function(t, b, c, d) { 
     126        return c*t/d + b; 
     127    }, 
     128     
     129    /** 
     130     * APIFunction: easeInOut 
     131     *  
     132     * Parameters: 
     133     * t - {Float} time 
     134     * b - {Float} beginning position 
     135     * c - {Float} total change 
     136     * d - {Float} duration of the transition 
     137     */ 
     138    easeInOut: function(t, b, c, d) { 
     139        return c*t/d + b; 
     140    }, 
     141 
     142    CLASS_NAME: "OpenLayers.Easing.Linear" 
     143}; 
     144 
     145/** 
     146 * Namespace: OpenLayers.Easing.Expo 
     147 */ 
     148OpenLayers.Easing.Expo = { 
     149     
     150    /** 
     151     * APIFunction: easeIn 
     152     *  
     153     * Parameters: 
     154     * t - {Float} time 
     155     * b - {Float} beginning position 
     156     * c - {Float} total change 
     157     * d - {Float} duration of the transition 
     158     */ 
     159    easeIn: function(t, b, c, d) { 
     160        return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b; 
     161    }, 
     162     
     163    /** 
     164     * APIFunction: easeOut 
     165     *  
     166     * Parameters: 
     167     * t - {Float} time 
     168     * b - {Float} beginning position 
     169     * c - {Float} total change 
     170     * d - {Float} duration of the transition 
     171     */ 
     172    easeOut: function(t, b, c, d) { 
     173        return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b; 
     174    }, 
     175     
     176    /** 
     177     * APIFunction: easeInOut 
     178     *  
     179     * Parameters: 
     180     * t - {Float} time 
     181     * b - {Float} beginning position 
     182     * c - {Float} total change 
     183     * d - {Float} duration of the transition 
     184     */ 
     185    easeInOut: function(t, b, c, d) { 
     186        if (t==0) return b; 
     187        if (t==d) return b+c; 
     188        if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b; 
     189        return c/2 * (-Math.pow(2, -10 * --t) + 2) + b; 
     190    }, 
     191 
     192    CLASS_NAME: "OpenLayers.Easing.Expo" 
     193}; 

  • lib/OpenLayers.js

    old new  
    7474            "OpenLayers/BaseTypes/Pixel.js", 
    7575            "OpenLayers/BaseTypes/Size.js", 
    7676            "OpenLayers/Console.js", 
     77            "OpenLayers/Tween.js", 
    7778            "Rico/Corner.js", 
    7879            "Rico/Color.js", 
    7980            "OpenLayers/Ajax.js", 

  • examples/tween.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; 
     14 
     15        function init(){ 
     16            OpenLayers.ProxyHost="/proxy/?url="; 
     17            map = new OpenLayers.Map('map'); 
     18            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",  
     19                "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} ); 
     20                 
     21            map.addLayer(layer); 
     22            map.setCenter(new OpenLayers.LonLat(0, 0), 0); 
     23 
     24            map.zoomToMaxExtent(); 
     25             
     26            // TODO: add a control for dbl click 
     27        } 
     28         
     29        function setCenter() { 
     30            var lon = Math.random() * 360 - 180; 
     31            var lat = Math.random() * 180 - 90; 
     32            var lonlat = new OpenLayers.LonLat(lon, lat); 
     33            map.panTo(lonlat); 
     34        } 
     35    </script> 
     36  </head> 
     37  <body onload="init()"> 
     38    <div id="title">Tween Example</div> 
     39    <div id="tags"></div> 
     40    <div id="shortdesc">Show transition effects</div> 
     41    <div id="map"></div> 
     42    <div id="docs"> 
     43        This is an example of transition effects. If the new random center is in the current extent, the map will pan smoothly. 
     44    </div> 
     45    <button onclick="setCenter()">recenter to random lonlat</button> 
     46  </body> 
     47</html>