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

# overlay.html.Balloon

Extends [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md).

HTML overlay for the balloon. By default, the overlays have not been added to package.full (the standard set of modules). To create your own overlay instance, use [overlay.storage](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.storage.md).

[Constructor](#constructor-summary) | [Fields](#properties-summary) | [Events](#events-summary) | [Methods](#methods-summary)

## Constructor {#constructor-summary}

```javascript
overlay.html.Balloon(geometry[, data[, options]])
```

**Parameters:**

#|
|| **Parameter** | **Default value** | **Description**  ||
|| [`geometry`](#param-geometry)[*](*star) | — | Type: [IPixelPointGeometry](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IPixelPointGeometry.md)

Pixel geometry of a shape. ||
|| [`data`](#param-data) | — | Type: Object

Data. ||
|| [`options`](#param-options) | — | Type: Object

Options. ||
|| [`options.cursor`](#param-options.cursor) | — | Type: String

Cursor when the mouse is hovering. ||
|| [`options.interactivityModel`](#param-options.interactivityModel) | "default#opaque" | Type: String

Interactivity model. Available keys and their values are listed in the description of [interactivityModel.storage](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/interactivityModel.storage.md). ||
|| [`options.layout`](#param-options.layout) | — | Type: Function\|String

Layout. (Type: constructor for an object with the ILayout interface). ||
|| [`options.offset`](#param-options.offset) | [0,0] | Type: Array

Offset in pixels. ||
|| [`options.pane`](#param-options.pane) | "balloon" | Type: String

Container where the balloon layout will be placed. ||
|| [`options.shadow`](#param-options.shadow) | true | Type: Boolean

Flag for whether there is a shadow. ||
|| [`options.shadowLayout`](#param-options.shadowLayout) | — | Type: Function\|String

Shadow layout (type: constructor for an object with the ILayout interface). ||
|| [`options.shadowOffset`](#param-options.shadowOffset) | [0,0] | Type: Array

Shadow offset in pixels. ||
|| [`options.shadowsPane`](#param-options.shadowsPane) | "shadows" | Type: Array

Container where the balloon shadow layout will be placed. ||
|| [`options.zIndex`](#param-options.zIndex) | — | Type: Number

The z-index of the element. ||
|#

\* Mandatory parameter/option.

## Fields {#properties-summary}

#|
|| **Name** | **Type** | **Description** ||
|| [events](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#events) | [IEventManager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IEventManager.md) | Event manager.

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#events). ||
|| [options](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ICustomizable.md#options) | [IOptionManager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOptionManager.md) | Options manager.

Inherited from [ICustomizable](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ICustomizable.md#options). ||
|#

## Events {#events-summary}

#|
|| **Name** | **Description** ||
|| [click](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-click) | Single left-click on the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-click). ||
|| [contextmenu](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-contextmenu) | Calls the element's context menu. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-contextmenu). ||
|| [datachange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-datachange) | Data change. Data fields: 
- oldData - Old data.
- newData - New data.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-datachange). ||
|| [dblclick](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-dblclick) | Double left-click on the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-dblclick). ||
|| [emptinesschange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-emptinesschange) | Change to the empty overlay flag. Instance of the [Event](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/Event.md) class.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-emptinesschange). ||
|| [geometrychange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-geometrychange) | Changed geometry. Data fields: 
- oldGeometry - Old pixel geometry.
- newGeometry - New pixel geometry.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-geometrychange). ||
|| [mapchange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-mapchange) | Map reference changed. Data fields: 
- oldMap - Old map.
- newMap - New map.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-mapchange). ||
|| [mousedown](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mousedown) | Pressing the mouse button over the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mousedown). ||
|| [mouseenter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseenter) | Pointing the cursor at the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseenter). ||
|| [mouseleave](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseleave) | Moving the cursor off of the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseleave). ||
|| [mousemove](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mousemove) | Moving the cursor over the object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mousemove). ||
|| [mouseup](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseup) | Letting go of the mouse button over an object. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-mouseup). ||
|| [multitouchend](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchend) | End of multitouch. This event is only available on devices that support multitouch. Returns an implementation of the IMultiTouchEvent interface.

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchend). ||
|| [multitouchmove](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchmove) | Repeating event during multitouch. This event is only available on devices that support multitouch. Returns an implementation of the IMultiTouchEvent interface with information about touches. Defines the touches property, which contains a list of touches. Every touch is described by an object that contains the following fields: 
- clientX - X coordinate of the touch relative to the viewable area of the browser.
- clientY - Y coordinate of the touch relative to the viewable area of the browser.
- pageX - X coordinate of the touch relative to the beginning of the document.
- pageY - Y coordinate of the touch relative to the beginning of the document.

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchmove). ||
|| [multitouchstart](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchstart) | Start of multitouch. This event is only available on devices that support multitouch. Returns an implementation of the IMultiTouchEvent interface with information about touches. Defines the touches property, which contains a list of touches. Every touch is described by an object that contains the following fields: 
- clientX - X coordinate of the touch relative to the viewable area of the browser.
- clientY - Y coordinate of the touch relative to the viewable area of the browser.
- pageX - X coordinate of the touch relative to the beginning of the document.
- pageY - Y coordinate of the touch relative to the beginning of the document.

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchstart). ||
|| [optionschange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ICustomizable.md#event-optionschange) | Change to the object options.

Inherited from [ICustomizable](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ICustomizable.md#event-optionschange). ||
|| [shapechange](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-shapechange) | Change to the shape of the area spanning the overlay. Instance of the [Event](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/Event.md) class.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#event-shapechange). ||
|| [wheel](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-wheel) | Mouse wheel scrolling. When using, keep in mind that mouse events are emulated when a touch screen is used. Instance of the [MapEvent](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/MapEvent.md) class. More information is available in [domEvent.manager](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/domEvent.manager.md).

Inherited from [IDomEventEmitter](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IDomEventEmitter.md#event-wheel). ||
|#

## Methods {#methods-summary}

#|
|| **Name** | **Returns** | **Description** ||
|| [getBalloonElement](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getBalloonElement)() | HTMLElement | Returns parent element of the balloon layout. ||
|| [getBalloonLayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getBalloonLayout)() | [vow.Promise](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/vow.Promise.md) | Returns Promise object to return the balloon layout. ||
|| [getBalloonLayoutSync](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getBalloonLayoutSync)() | [ILayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ILayout.md) | Returns balloon layout. ||
|| [getData](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getData)() | Object | Returns the overlay data object.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getData). ||
|| [getElement](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getElement)() | HTMLElement | Returns parent element of the balloon layout. ||
|| [getGeometry](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getGeometry)() | [IPixelGeometry](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IPixelGeometry.md) | Returns the current pixel geometry.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getGeometry). ||
|| [getLayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getLayout)() | [vow.Promise](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/vow.Promise.md) | Returns Promise object to return the balloon layout. ||
|| [getLayoutSync](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getLayoutSync)() | [ILayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ILayout.md)\|null | Returns balloon layout. ||
|| [getMap](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getMap)() | [Map](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/Map.md)\|null | Returns reference to the current map.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getMap). ||
|| [getMode](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getMode)() | String | Returns the current mode of the balloon: "panel" — panel mode, "standard" — standard display. ||
|| [getShadowElement](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getShadowElement)() | HTMLElement | Returns parent element of the balloon shadow layout. ||
|| [getShadowLayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getShadowLayout)() | [vow.Promise](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/vow.Promise.md) | Returns Promise object to return the balloon shadow layout. ||
|| [getShadowLayoutSync](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#getShadowLayoutSync)() | [ILayout](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/ILayout.md)\|null | Returns balloon shadow layout. ||
|| [getShape](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getShape)() | [IShape](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IShape.md)\|null | Returns a shape that defines the area spanning the overlay in global pixel coordinates, or null if it is not possible to plot the shape.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#getShape). ||
|| [isEmpty](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/overlay.html.Balloon.md#isEmpty)() | Boolean | Returns true if the layout is empty or if the layout has not yet been loaded, i.e. it has no content. ||
|| [setData](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setData)([data](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setData-param-data)) | | Sets the overlay data.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setData). ||
|| [setGeometry](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setGeometry)([geometry](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setGeometry-param-geometry)) | | Sets the overlay pixel geometry.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setGeometry). ||
|| [setMap](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setMap)([map](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setMap-param-map)) | | Sets the map on which to display the overlay.

Inherited from [IOverlay](https://yandex.com.tr/dev/jsapi-v2-1/doc/en/v2-1/ref/reference/IOverlay.md#setMap).||
|#

## Methods details {#method_detail}

### getBalloonElement {#getBalloonElement}

```javascript
{HTMLElement} getBalloonElement()
```

**Returns** parent element of the balloon layout.

### getBalloonLayout  {#getBalloonLayout}

```javascript
{vow.Promise} getBalloonLayout()
```

**Returns** Promise object to return the balloon layout.

### getBalloonLayoutSync {#getBalloonLayoutSync}

```javascript
{ILayout} getBalloonLayoutSync()
```

**Returns** balloon layout.

### getElement {#getElement}

```javascript
{HTMLElement} getElement()
```

**Returns** parent element of the balloon layout.

### getLayout {#getLayout}

```javascript
{vow.Promise} getLayout()
```

**Returns** Promise object to return the balloon layout.

### getLayoutSync  {#getLayoutSync}

```javascript
{ILayout|null} getLayoutSync()
```

**Returns** balloon layout.

### getMode {#getMode}

```javascript
{String} getMode()
```

**Returns** the current mode of the balloon: "panel" — panel mode, "standard" — standard display.

### getShadowElement {#getShadowElement}

```javascript
{HTMLElement} getShadowElement()
```

**Returns** parent element of the balloon shadow layout.

### getShadowLayout {#getShadowLayout}

```javascript
{vow.Promise} getShadowLayout()
```

**Returns** Promise object to return the balloon shadow layout.

### getShadowLayoutSync {#getShadowLayoutSync}

```javascript
{ILayout|null} getShadowLayoutSync()
```

**Returns** balloon shadow layout.

### isEmpty {#isEmpty}

```javascript
{Boolean} isEmpty()
```

**Returns** true if the layout is empty or if the layout has not yet been loaded, i.e. it has no content.

[*star]: Mandatory parameter/option.