Event properties. Click coordinates

Open in CodeSandbox

A map event is an object of the MapEvent class. Data is extracted from this object using the get method.

In this example, the coordinates of the point clicked with the left mouse button are extracted from the event object.

<!DOCTYPE html>
<html>
    <head>
        <title>Examples. Click coordinates</title>
        <meta
            http-equiv="Content-Type"
            content="text/html; charset=UTF-8"
        />
        <!--
        Set your own API-key. Testing key is not valid for other web-sites and services.
        Get your API-key on the Developer Dashboard: https://developer.tech.yandex.ru/keys/
    -->
        <script
            src="https://api-maps.yandex.ru/2.1/?lang=en_RU&amp;apikey=<your API-key>"
            type="text/javascript"
        ></script>
        <script src="event_properties.js" type="text/javascript"></script>
        <style>
            html,
            body,
            #map {
                width: 100%;
                height: 100%;
                padding: 0;
                margin: 0;
            }
        </style>
    </head>
    <body>
        <div id="map"></div>
    </body>
</html>
ymaps.ready(init);
var myMap;

function init() {
    myMap = new ymaps.Map(
        "map",
        {
            center: [57.5262, 38.3061], // Uglich
            zoom: 11,
        },
        {
            balloonMaxWidth: 200,
            searchControlProvider: "yandex#search",
        }
    );

    /**
     * Processing events that occur when the user
     * left-clicks anywhere on the map.
     * When such an event occurs, we open the balloon.
     */
    myMap.events.add("click", function (e) {
        if (!myMap.balloon.isOpen()) {
            var coords = e.get("coords");
            myMap.balloon.open(coords, {
                contentHeader: "Event!",
                contentBody:
                    "<p>Someone clicked on the map.</p>" +
                    "<p>Click coordinates: " +
                    [
                        coords[0].toPrecision(6),
                        coords[1].toPrecision(6),
                    ].join(", ") +
                    "</p>",
                contentFooter: "<sup>Click again</sup>",
            });
        } else {
            myMap.balloon.close();
        }
    });

    /**
     * Processing events that occur when the user
     * right-clicks anywhere on the map.
     * When such an event occurs, we display a popup hint
     * at the point of click.
     */
    myMap.events.add("contextmenu", function (e) {
        myMap.hint.open(e.get("coords"), "Someone right-clicked");
    });

    // Hiding the hint when opening the balloon.
    myMap.events.add("balloonopen", function (e) {
        myMap.hint.close();
    });
}