---
metadata:
  - name: generator
    content: Diplodoc Platform v5.39.1
alternate:
  - https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/llms.txt

# control.SmallZoomControl

Расширяет [IControl](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md), [ICustomizable](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/ICustomizable.md).

Класс для создания элемента управления "Простой элемент управления масштабом карты". Позволяет уменьшать или увеличивать коэффициент масштабирования карты на 1.

## Конструктор {#constructor}

```javascript
control.SmallZoomControl([options])
```

**Параметры:**

#|
|| **Параметр** | **Значение по умолчанию** | **Описание** ||
|| `options` | — | Тип: Object

Опции элемента управления. ||
|| `options.duration` | 200 | Тип: Number

Время анимации маштабирования карты, мс. ||
|| `options.layout` | — | Тип: Function\|String

Макет элемента управления. В конструктор макета передается объект, содержащий поля:

- control - ссылка на элемент управления;

- options - менеджер опций элемента управления control.SmallZoomControl.options;
 
- data - менеджер данных элемента управления [control.SmallZoomControl.data](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#data);
 
- state - менеджер состояния элемента управления [control.SmallZoomControl.state](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#state).

Макет меняет свой внешний вид на основе данных, состояния и опций элемента управления. Элемент управления, в свою очередь, реагирует на интерфейсные события макета и меняет значения полей [control.SmallZoomControl.state](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#state) в зависимости от полученных команд. (Тип: конструктор объекта с интерфейсом [IZoomControlLayout](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IZoomControlLayout.md) или ключ макета). ||
|| `options.position` | \{ top: 75, left: 5 \} | Тип: Object

Положение элемента управления над картой. Задается в виде объекта со следующими полями:

- top - отступ от верхнего края контейнера карты в пикселах;
 
- right - отступ от правого края контейнера карты в пикселах;

- bottom - отступ от нижнего края контейнера карты в пикселах;
 
- left - отступ от левого края контейнера карты в пикселах.
 
Если при этом заданы одновременно и top, и bottom, то значение bottom игнорируется. Аналогично, если заданы одновременно и left, и right, то значение right игнорируется. Если элемент управления добавляется в группу элементов (например, в тулбар или раскрывающийся список), то значение position не применяется. ||
|| `options.visible` | true | Тип: Boolean

Признак того, что элемент управления отображается. ||
|#

**Примеры:**

**1.**

```javascript
// Пример 1.
// Добавление стандартного элемента управления масштабом.
map.controls.add('smallZoomControl', { top: 70, right: 5 });
```

**2.**

```javascript
// Пример 2.
// Создание пользовательского элемента управления масштабом.
// В примере используется jQuery, загруженный с http://yandex.st/jquery/1.6.4/jquery.min.js
var MyZoomLayout = ymaps.templateLayoutFactory.createClass("<div>" +
        "<div id='zoom-in'>+</div>" +
        "<div id='zoom-out'>-</div>" +
    "</div>", {
    
    build: function () {
        // Сначала вызываем родительский метод.
        MyZoomLayout.superclass.build.call(this);
        // Запомним функции-обработчики, за которым закреплен контекст,
        // чтобы впоследствии от них отписаться.
        this.zoomInCallback = ymaps.util.bind(this.zoomIn, this);
        this.zoomOutCallback = ymaps.util.bind(this.zoomOut, this);
        $('#zoom-in').bind('click', this.zoomInCallback);
        $('#zoom-out').bind('click', this.zoomOutCallback);
    },
                  
   clear: function () {
       // Снимаем слушателей.
       $('#zoom-in').unbind('click', this.zoomInCallback);
       $('#zoom-out').unbind('click', this.zoomOutCallback);
       // А затем вызываем родительский метод.
       MyZoomLayout.superclass.clear.call(this);
   },
                  
   zoomIn: function () {
       var map = this.getData().control.getMap();
       // Посылаем событие, которое описано в интерфейсе IZoomControlLayout.
       this.events.fire('zoomchange', {
           oldZoom: map.getZoom(),
           // При клике на '+' будет послана команда увеличить
           // текущий коэффициент масштабирования на 1
           newZoom: map.getZoom() + 1
       });
   },
                  
   zoomOut: function () {
       var map = this.getData().control.getMap();
       this.events.fire('zoomchange', {
           oldZoom: map.getZoom(),
           // При клике на '-' будет послана команда уменьшить
           // текущий коэффициент масштабирования на 1
           newZoom: map.getZoom() - 1
       });
   }
});
var customZoom = new ymaps.control.SmallZoomControl({layout: MyZoomLayout});
```
## Поля {#fields}

#|
|| **Имя** | **Тип** | **Описание** ||
|| [data](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#data) | [data.Manager](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/data.Manager.md) | Данные элемента управления. ||
|| [events](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IEventEmitter.md#events) | [IEventManager](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IEventManager.md) | Менеджер событий.

Унаследовано от [IEventEmitter](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IEventEmitter.md#events). ||
|| [options](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/ICustomizable.md#options) | [IOptionManager](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IOptionManager.md) | Менеджер опций.

Унаследовано от [ICustomizable](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/ICustomizable.md#options). ||
|| [state](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#state) | [data.Manager](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/data.Manager.md) | Состояние элемента управления. Имена полей, доступных через метод data.Manager.get:
• zoom - текущий коэффициент масштабирования;

• zoomRange - текущий диапазон коэффициентов масштабирования. ||
|#

## События {#events}

#|
|| **Имя** | **Описание** ||
|| [mapchange](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IChildOnMap.md#mapchange) | Сменилась карта. Поля данных: 
• oldMap - старая карта;

• newMap - новая карта.

Унаследовано от [IChildOnMap](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IChildOnMap.md#mapchange). ||
|| [optionschange](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/ICustomizable.md#optionschange) | Изменение в опциях объекта.

Унаследовано от [ICustomizable](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/ICustomizable.md#optionschange). ||
|| [parentchange](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IChild.md#parentchange) | Сменился родительский объект.

Поля данных:

• oldParent - старый родитель;

• newParent - новый родитель.

Унаследовано от [IChild](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IChild.md#parentchange). ||
|| [zoomchange](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/control.SmallZoomControl.md#zoomchange) | Коэффициент масштабирования карты изменен. Экземпляр класса [Event](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/Event.md).

• newZoom - новый коэффициент масштабирования карты;

• oldZoom - старый коэффициент масштабирования карты. ||
|#

## Методы {#method}

#|
|| **Имя** | **Возвращает** | **Описание** ||
|| [getParent](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md#getParent)() | [IControlParent](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControlParent.md) | Returns ссылку на родительский объект.

Унаследован от [IControl](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md#getParent). ||
|| [setParent](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md#setParent)([parent](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md#setParent-param-parent)) | [IChildOnMap](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IChildOnMap.md) | Устанавливает родительский объект.

Унаследован от [IControl](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/IControl.md#setParent). ||
|#

## Описание полей {#description-fields}

### data

```javascript
{data.Manager} data
```

Данные элемента управления.

### state

```javascript
{data.Manager} state
```

Состояние элемента управления. Имена полей, доступных через метод data.Manager.get:

• zoom - текущий коэффициент масштабирования;

• zoomRange - текущий диапазон коэффициентов масштабирования.

## Описание событий {#description-events}

### zoomchange

Коэффициент масштабирования карты изменен. Экземпляр класса [Event](https://yandex.ru/dev/maps/archive/doc/jsapi/2-0/ru/ref/reference/Event.md).

• newZoom - новый коэффициент масштабирования карты;

• oldZoom - старый коэффициент масштабирования карты.