Kinetic Dragging Example

Demonstrates Kinetic Dragging. Based on - http://openlayers.org/dev/examples/kinetic.html

by Mike Gifford

HTML

<script src="http://openconcept.ca/sites/openconcept.ca/files/OpenLayers.js"></script>
<link rel="stylesheet" href="http://openconcept.ca/sites/openconcept.ca/files/OpenLayers.css">
<script src="http://openlayers.org/dev/examples/kinetic.js"></script>
<div id="map-div"></div>

CSS

html, body, #map-div {
    height: 100%;
    width: 100%;
}

JavaScript

(function($) {

    map = new OpenLayers.Map({
        div: 'map-div',
        controls: [
            new OpenLayers.Control.Navigation({
            dragPanOptions: {
                enableKinetic: true
            }
        })
            ],
        projection: new OpenLayers.Projection('EPSG:900913'),
        'displayProjection': new OpenLayers.Projection('EPSG:4326')
    });

    var osm = new OpenLayers.Layer.OSM();
    map.addLayer(osm);

    var longitude = -97.0928440;
    var latitude = 32.7478770;
    var centerlonlat = new OpenLayers.LonLat(longitude, latitude);

    centerlonlat = centerlonlat.transform(map.displayProjection, map.projection);
    var zoom = 15;
    map.setCenter(centerlonlat, zoom);

})(jQuery);