Reverse geocoding

Open in CodeSandbox

The API can determine the coordinates of an object by its name and the name of an object by its coordinates (forward and reverse geocoding).

Both types of geocoding are performed using the geocode function. The result returned by this function can be immediately placed on the map.

This example uses reverse geocoding, which uses the set coordinates to find the nearest metro station.

<!DOCTYPE html>
<html>
    <head>
        <title>Examples. Reverse geocoding</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="reverse_geocode.js" type="text/javascript"></script>
        <style type="text/css">
            html,
            body,
            #map {
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }
        </style>
    </head>
    <body>
        <div id="map" />
    </body>
</html>
ymaps.ready(init);

function init() {
    var myMap = new ymaps.Map(
        "map",
        {
            center: [55.753994, 37.622093],
            zoom: 9,
        },
        {
            searchControlProvider: "yandex#search",
        }
    );

    // Search metro stations.
    ymaps
        .geocode(myMap.getCenter(), {
            /**
             * Request options
             * @see https://api.yandex.com/maps/doc/jsapi/2.1/ref/reference/geocode.xml
             */
            // Only looking for a metro station.
            kind: "metro",
            // Requesting no more than 20 results.
            results: 20,
        })
        .then(function (res) {
            // Setting the image for placemark icons.
            res.geoObjects.options.set("preset", "islands#redCircleIcon");
            res.geoObjects.events
                // Displaying the hint with the name of the metro station when you hover over the placemark.
                .add("mouseenter", function (event) {
                    var geoObject = event.get("target");
                    myMap.hint.open(
                        geoObject.geometry.getCoordinates(),
                        geoObject.getPremise()
                    );
                })
                // Hiding the hint when the cursor goes off the placemark.
                .add("mouseleave", function (event) {
                    myMap.hint.close(true);
                });
            // Adding a collection of found geo objects to the map.
            myMap.geoObjects.add(res.geoObjects);
            // Zooming the map to the collection's viewport.
            myMap.setBounds(res.geoObjects.getBounds());
        });
}