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

# Searching across your own objects

<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/custom_search/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/j4yhgv?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/map.GeoObjects">map.GeoObjects</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/control.SearchControl">control.SearchControl</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/IGeocodeProvider">IGeocodeProvider</a>,
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/GeoObjectArray">GeoObjectArray</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/util.Promise">util.Promise</a>
</div>
<p>
    Searching for an object by name is implemented using the <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/geocode">geocode</a> function. However, this function
    searches among the objects on the regular or public map.
</p>
<p>
    But what if you need to set up a search across your own objects
    and integrate it with the Yandex.Maps API? Write your own search provider,
    which you can use in the <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/geocode">geocode</a> function and in the
    <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/control.SearchControl">Search on map</a> control.
</p>
<p>
    The search provider must implement the <a href="https://yandex.ru/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IGeocodeProvider">IGeocodeProvider</a> interface.
    This example shows how to create your own provider and connect it to the
    standard Search control on the map.
</p>
<p>
    The example is discussed in more detail in the <a href="https://yandex.ru/blog/ymapsapi/301">club</a>.
</p>

{% list tabs %}

-   index.html

    ```html
    <!DOCTYPE html>
    <html>
        <head>
            <title>Examples. Searching across your own objects</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>
            <div id="map"></div>
        </body>
    </html>
    ```

-   custom_search.js

    ```js
    function init() {
        var myMap = new ymaps.Map("map", {
                center: [55.7, 37.5],
                zoom: 9,
                controls: ["zoomControl"],
            }),
            // Creating a collection.
            myCollection = new ymaps.GeoObjectCollection(),
            // Creating an array with the data.
            myPoints = [
                { coords: [55.77, 37.46], text: "Tavern" },
                { coords: [55.66, 37.48], text: "Cafe" },
                { coords: [55.65, 37.42], text: "Restaurant" },
                { coords: [55.64, 37.54], text: "Museum" },
                { coords: [55.54, 37.52], text: "Library" },
                { coords: [55.53, 37.56], text: "School" },
                { coords: [55.61, 37.61], text: "Pharmacy" },
                { coords: [55.8, 37.58], text: "Bar" },
                { coords: [55.71, 37.35], text: "Institute" },
                { coords: [55.74, 37.57], text: "University" },
                { coords: [55.58, 37.69], text: "Hospital" },
                { coords: [55.57, 37.7], text: "Circus" },
                { coords: [55.55, 37.64], text: "Store" },
                { coords: [55.5, 37.75], text: "Bakery" },
                { coords: [55.81, 37.73], text: "Police" },
                { coords: [55.73, 37.68], text: "Beauty salon" },
                { coords: [55.86, 37.76], text: "Sauna" },
                { coords: [55.38, 37.69], text: "Parking garage" },
                { coords: [55.91, 37.5], text: "House" },
                { coords: [55.62, 37.32], text: "Laundry" },
                { coords: [55.85, 37.41], text: "Stadium" },
                { coords: [55.67, 37.24], text: "Train station" },
            ];

        // Populating the collection with data.
        for (var i = 0, l = myPoints.length; i < l; i++) {
            var point = myPoints[i];
            myCollection.add(
                new ymaps.Placemark(point.coords, {
                    balloonContentBody: point.text,
                })
            );
        }

        // Adding a collection of placemarks to the map.
        myMap.geoObjects.add(myCollection);

        // Creating an instance of the ymaps.control.SearchControl class.
        var mySearchControl = new ymaps.control.SearchControl({
            options: {
                // Replacing the standard data provider (geocoder) with our own.
                provider: new CustomSearchProvider(myPoints),
                /**
                 * We won't show another placemark when selecting a search result, because
                 * the placemarks in the myCollection collection have already been added to the map.
                 */
                noPlacemark: true,
                resultsPerPage: 5,
            },
        });

        // Adding the control in the upper right corner,
        myMap.controls.add(mySearchControl, { float: "right" });
    }

    /**
     * The data provider for ymaps.control.SearchControl control.
     * Searches geo objects in the "points" array.
     * Implements the IGeocodeProvider interface.
     */
    function CustomSearchProvider(points) {
        this.points = points;
    }

    // The provider searches the "text" field using the standard method String.ptototype.indexOf.
    CustomSearchProvider.prototype.geocode = function (request, options) {
        var deferred = new ymaps.vow.defer(),
            geoObjects = new ymaps.GeoObjectCollection(),
            // How many results to skip.
            offset = options.skip || 0,
            // The number of results to return.
            limit = options.results || 20;

        var points = [];
        // Searching in the "text" property of each item in the array.
        for (var i = 0, l = this.points.length; i < l; i++) {
            var point = this.points[i];
            if (point.text.toLowerCase().indexOf(request.toLowerCase()) != -1) {
                points.push(point);
            }
        }
        // When forming the response, "offset" and "limit" can be taken into account.
        points = points.splice(offset, limit);
        // Adding points to the resulting collection.
        for (var i = 0, l = points.length; i < l; i++) {
            var point = points[i],
                coords = point.coords,
                text = point.text;

            geoObjects.add(
                new ymaps.Placemark(coords, {
                    name: text + " name",
                    description: text + " description",
                    balloonContentBody: "<p>" + text + "</p>",
                    boundedBy: [coords, coords],
                })
            );
        }

        deferred.resolve({
            // Geo objects in search results.
            geoObjects: geoObjects,
            // Response metainformation.
            metaData: {
                geocoder: {
                    // String with the processed request.
                    request: request,
                    // The number of found results.
                    found: geoObjects.getLength(),
                    // The number of returned results.
                    results: limit,
                    // The number of skipped results.
                    skip: offset,
                },
            },
        });

        // Returning a promise object.
        return deferred.promise();
    };

    ymaps.ready(init);
    ```

{% endlist %}
