New to Kendo UI for jQuery? Start a free 30-day trial

EventOffset

methods

Returns the event coordinates relative to the map element. Offset coordinates are not synchronized to a particular location on the map.

eventOffset

Parameters:eObject|jQuery.Event

The DOM or jQuery mouse event.

Returns:kendo.geometry.Point

The event coordinates relative to the map element.

<style>
    .box {
        position: absolute;
        display: block;
        width: 10px;
        height: 10px;
        margin: -5px 0 0 -5px;
        background: red;
    }
</style>
<div id="map"></div>
<script>
    $("#map").kendoMap({
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }]
    });

    var map = $("#map").data("kendoMap");
    $("#map").click(function(e) {
        var offset = map.eventOffset(e);
        $("<span class='box'></span>")
        .css({ top: offset.y, left: offset.x })
        .appendTo(map.element);
    });
</script>