---
metadata:
  - name: generator
    content: Diplodoc Platform v5.39.1
alternate:
  - https://yandex.com/dev/jsapi-v2-1/doc/en/v2-1/examples/cases/find_closest_object.md
  - https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/examples/cases/find_closest_object.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/dev/jsapi-v2-1/doc/en/llms.txt

# Searching for the nearest object.

<iframe id="LIVE-EXAMPLE" style="width:100%;height: 400px;border-radius: 8px;border: 1px solid rgba(92, 94, 102, 0.14);" frameBorder="0" src="https://yastatic.net/s3/front-maps-static/maps-front-jsapi-v2-1/examples/2/out/s3-cases/en/find_closest_object/index.html" allow="fullscreen"></iframe>

<a target="_blank" rel="noopener noreferrer" style="display: inline-block;margin-top: 10px;cursor: pointer;border-radius: 4px;padding: 9px 12px;background: #151515;color: white;text-decoration: none;font-weight: 500" href="https://codesandbox.io/p/sandbox/2ynq6l?file=index.html">Open in CodeSandbox</a>

<div id="references">
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ready">ready</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/Map">Map</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/Placemark">Placemark</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/geocode">geocode</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/geoQuery">geoQuery</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/GeoQueryResult">GeoQueryResult</a>
</div>
<p>
    Use the <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/GeoQueryResult">GeoQueryResult</a> object to create objects on the map from their JSON descriptions.
</p>
<p>
    This example explains how to find objects in the selection that are nearest to an arbitrary object on the map (such as the metro).
    It also shows how to find the objects that are closest to the click.
</p>

{% list tabs %}

-   index.html

    ```html
    <!DOCTYPE html>

    <html>
        <head>
            <title>Examples. Searching for the nearest object.</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/
        -->
            
            
            
        </head>
        <body>
            <p>
                When the map is clicked, the balloon opens for the placemark
                nearest to the click
            </p>
            <div id="map"></div>
        </body>
    </html>
    ```

-   find_closest_object.js

    ```js
    ymaps.ready(init);

    function init() {
        var myMap = new ymaps.Map(
                "map",
                {
                    center: [55.73, 37.75],
                    zoom: 12,
                },
                {
                    searchControlProvider: "yandex#search",
                }
            ),
            cafe,
            metro;

        function findClosestObjects() {
            /**
             * Searching the selection for the cafe nearest to the found metro station, and opening its balloon.
             *
             */
            cafe.getClosestTo(metro.get(0)).balloon.open();

            // Opening the balloon of the cafe that is closest to the click.
            myMap.events.add("click", function (event) {
                cafe.getClosestTo(event.get("coords")).balloon.open();
            });
        }

        /**
         * Cafe descriptions can be stored in JSON format, in order to then generate
         * geo objects from the descriptions using ymaps.geoQuery.
         */
        cafe = ymaps
            .geoQuery({
                type: "FeatureCollection",
                features: [
                    {
                        type: "Feature",
                        properties: {
                            balloonContent:
                                "Darth Vader coffee shop - we have cookies!",
                        },
                        geometry: {
                            type: "Point",
                            coordinates: [55.724166, 37.545849],
                        },
                    },
                    {
                        type: "Feature",
                        properties: {
                            balloonContent: "Gollum cafe - lovely cakes.",
                        },
                        geometry: {
                            type: "Point",
                            coordinates: [55.717495, 37.567886],
                        },
                    },
                    {
                        type: "Feature",
                        properties: {
                            balloonContent:
                                "Brick cafe: strong coffee for strong guys.",
                        },
                        geometry: {
                            type: "Point",
                            coordinates: [55.721018, 37.631057],
                        },
                    },
                ],
                // Adding points to the map immediately.
            })
            .addToMap(myMap);

        // Using reverse geocoding to find the metro station "Kropotkinskaya".
        metro = ymaps
            .geoQuery(ymaps.geocode([55.744828, 37.603423], { kind: "metro" }))
            // Waiting for the response from the server and then processing the received results.
            .then(findClosestObjects);
    }
    ```

{% endlist %}
