Adding individual controls

Open in CodeSandbox

In the API 2.1, controls are added to the map automatically when it is created. By default, the 'mediumMapDefaultSet' standard set of controls is added to the map (see the example).

To add the desired controls to the map, a list of corresponding keys can be specified in the controls parameter when it is created. The controls can also be added through the Map.controls map field, using the "add" method.

You can specify individual controls, or a set of them. If you want to display the map without controls, pass an empty array [] in the "controls" field.

A list of the available controls can be found here. 

<!DOCTYPE html>
<html>
    <head>
        <title>Examples. Adding individual controls</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="customSet_controls.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(function () {
    var myMap = new ymaps.Map(
        "map",
        {
            center: [55.751574, 37.573856],
            zoom: 9,
            controls: [
                "zoomControl",
                "searchControl",
                "typeSelector",
                "fullscreenControl",
            ],
        },
        {
            searchControlProvider: "yandex#search",
        }
    );
});