Back to all docs
API Reference / dataviz / ui / Map / panEnd
New to Kendo UI for jQuery? Start a free 30-day trial

PanEnd

events

Fires after the map viewport has been moved.

panEnd

Event Data

e.origin kendo.dataviz.map.Location

The map origin (top left or NW corner).

e.center kendo.dataviz.map.Location

The map center.

e.sender kendo.dataviz.ui.Map

The source widget instance.

e.originalEvent Object

The source jQuery event instance

<div id="map"></div>
<script>
    $("#map").kendoMap({
        zoom: 3,
        center: [0, 0],
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }],
        panEnd: function(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
            console.log("pan ended at " + e.center.toString());
        }
    });
</script>
<div id="map"></div>
<script>
    $("#map").kendoMap({
        zoom: 3,
        center: [0, 0],
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }]
    });

    var map = $("#map").data("kendoMap");
    map.bind("panEnd", function(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
        console.log("pan ended at " + e.center.toString());
    });
</script>
Not finding the help you need?
Contact Support