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

# layout.PieChart

Расширяет [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md).

Макет в виде круговой диаграммы. Доступен в хранилище макетов по ключу 'default#pieChart'. Макет может использоваться как инструмент визуализации произвольных данных, так и в связке с другими визуальными компонентами API, такими как метки, кластеризатор, менеджер объектов.

{% note info %}

Так как диаграммы рисуются с использованием технологии SVG, данный макет не будет работать в браузерах, не поддерживающих SVG, в частности, IE8.

{% endnote %}

**См.:** [Placemark](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/Placemark.md)[Clusterer](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/Clusterer.md)[ObjectManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ObjectManager.md)[RemoteObjectManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/RemoteObjectManager.md)[LoadingObjectManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/LoadingObjectManager.md)

[Конструктор](#constructor-summary) | [Поля ](#properties-summary) | [События ](#events-summary) | [Методы ](#methods-summary)

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

```javascript
layout.PieChart(data)
```

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

#|
|| **Параметр** | **Значение по умолчанию** | **Описание**  ||
|| [`data`](#param-data)[*](*star) | — | Тип: Object

Данные макета. ||
|| [`data.option.pieChartRadius`](#param-data.option.pieChartRadius) | 25 + 2 * Math.log(sum) | Тип: Number\|Function

Радиус диаграммы в пикселях. Может задаваться числом либо функцией, принимающей в качестве параметров properties и options макета и возвращающей радиус диаграммы в виде числа. По умолчанию радиус определяется как 25 + 2 * Math.log(sum) пикселей, где sum — сумма весов секторов; ||
|| [`data.options`](#param-data.options) | — | Тип: [IOptionManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IOptionManager.md)

Опции отрисовки макета. ||
|| [`data.options.pieChartCaptionMaxWidth`](#param-data.options.pieChartCaptionMaxWidth) | 200 | Тип: Number

Максимальный размер подписи (iconCaption), в пикселях. ||
|| [`data.options.pieChartCoreFillStyle`](#param-data.options.pieChartCoreFillStyle) | white | Тип: String

Стиль заливки центральной части. Задается строкой, кодирующей цвет заливки; ||
|| [`data.options.pieChartCoreRadius`](#param-data.options.pieChartCoreRadius) | pieChartRadius - 15 | Тип: Number\|Function

Радиус центральной части макета, в которой отображается контент. Задается аналогично pieChartRadius — числом или функцией. По умолчанию принимает значение на 15 пикселей меньше pieChartRadius; ||
|| [`data.options.pieChartStrokeStyle`](#param-data.options.pieChartStrokeStyle) | white | Тип: String

Стиль линий-разделителей секторов и внешней обводки диаграммы. Задается строкой, кодирующей цвет линии; ||
|| [`data.options.pieChartStrokeWidth`](#param-data.options.pieChartStrokeWidth) | 2 | Тип: Number

Ширина линий-разделителей секторов и внешней обводки диаграммы в пикселях. Задается целым числом. ||
|| [`data.properties`](#param-data.properties)[*](*star) | — | Тип: [IDataManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDataManager.md)\|Object

Свойства геообъекта, который визуализируется макетом. ||
|| [`data.properties.data`](#param-data.properties.data)[*](*star) | — | Тип: Object[]\|Function

Статистические данные, на основе которых строится макет. Должны представлять собой массив JSON-объектов с полями weight и color (вес и цвет сектора) либо функцию, возвращающую такой массив. ||
|| [`data.properties.geoObjects`](#param-data.properties.geoObjects) | — | Тип: [IGeoObject](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IGeoObject.md)[]

Массив геообъектов в составе кластера, который требуется визуализировать. Используется в случае отсутствия properties.data. В этом случае макет проходит по всем геообъектам, определяет значение опции iconColor каждого объекта и на основе этих данных строит диаграмму. ||
|| [`data.properties.iconCaption`](#param-data.properties.iconCaption) | "" | Тип: String

Подпись к диаграмме. ||
|| [`data.properties.iconContent`](#param-data.properties.iconContent) | The sum of all the sectors | Тип: String

Значение, которое пишется в центре диаграммы. Если не задано — выводится сумма весов секторов. ||
|#

\* Обязательный параметр/опция.

**Пример:**

```javascript
var geoObject = new ymaps.Placemark([55.25, 37.43], {
         // Данные, на основе которых будет формироваться диаграмма.
        data: [
            { weight: 5, color: '#224080' },
            { weight: 3, color: '#408022' },
            { weight: 2, color: '#802240' }
        ]
    }, {
        iconLayout: 'default#pieChart',
        // Можно переопределить опции макета с префиксом icon.
        iconPieChartCoreRadius: 15
    });

myMap.geoObjects.add(geoObject);
```

## Поля {#properties-summary}

#|
|| **Имя** | **Тип** | **Описание** ||
|| [events](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#events) | [IEventManager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IEventManager.md) | Менеджер событий.

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#events). ||
|#

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

#|
|| **Имя** | **Описание** ||
|| [click](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-click) | Однократное нажатие левой кнопки мыши на объекте. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-click). ||
|| [contextmenu](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-contextmenu) | Вызов контекстного меню на элементе. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-contextmenu). ||
|| [dblclick](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-dblclick) | Двойное нажатие левой кнопки мыши на объекте. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-dblclick). ||
|| [emptinesschange](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-emptinesschange) | Изменение признака пустоты макета. Экземпляр класса [Event](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/Event.md).

Унаследовано от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-emptinesschange). ||
|| [mousedown](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mousedown) | Нажатие кнопки мыши над объектом. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mousedown). ||
|| [mouseenter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseenter) | Наведение курсора на объект. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseenter). ||
|| [mouseleave](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseleave) | Вывод курсора за пределы объекта. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseleave). ||
|| [mousemove](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mousemove) | Перемещение курсора над объектом. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mousemove). ||
|| [mouseup](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseup) | Отпускание кнопки мыши над объектом. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-mouseup). ||
|| [multitouchend](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchend) | Окончание мультисенсорного управления. Данное событие доступно только на устройствах, которые поддерживают множественные сенсорные прикосновения. Возвращает реализацию интерфейса IMultiTouchEvent.

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchend). ||
|| [multitouchmove](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchmove) | Повторящееся событие при мультисенсорном управлении. Данное событие доступно только на устройствах, которые поддерживают множественные сенсорные прикосновения. Возвращает реализацию интерфейса IMultiTouchEvent c информацией о прикосновениях. Определяет свойство touches, которое содержит список прикосновений. Каждое прикосновение описано объектом, которое содержит поля:
- clientX - координата касания X относительно видимой области браузера;
- clientY - координата касания Y относительно видимой области браузера;
- pageX - координата касания X касания относительно начала документа;
- pageY - координата касания Y касания относительно начала документа.

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchmove). ||
|| [multitouchstart](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchstart) | Начало мультисенсорного управления. Данное событие доступно только на устройствах, которые поддерживают множественные сенсорные прикосновения. Возвращает реализацию интерфейса IMultiTouchEvent c информацией о прикосновениях. Определяет свойство touches, которое содержит список прикосновений. Каждое прикосновение описано объектом, которое содержит поля:
- clientX - координата касания X относительно видимой области браузера;
- clientY - координата касания Y относительно видимой области браузера;
- pageX - координата касания X касания относительно начала документа;
- pageY - координата касания Y касания относительно начала документа.

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-multitouchstart). ||
|| [parentelementchange](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-parentelementchange) | Изменение родительского элемента. Экземпляр класса [Event](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/Event.md).

Унаследовано от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-parentelementchange). ||
|| [shapechange](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-shapechange) | Изменение фигуры области охватывающей макет. Экземпляр класса [Event](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/Event.md).

Унаследовано от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#event-shapechange). ||
|| [wheel](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-wheel) | Скролл мышкой. При использовании следует иметь в виду, что при сенсорном вводе события мыши будут эмулироваться. Экземпляр класса [MapEvent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/MapEvent.md). Более детальное описание доступно в [domEvent.manager](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/domEvent.manager.md).

Унаследовано от [IDomEventEmitter](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IDomEventEmitter.md#event-wheel). ||
|#


## Методы {#methods-summary}

#|
|| **Имя** | **Возвращает** | **Описание** ||
|| [build](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#build)() | | Строит экземпляр макета на основе шаблона и добавляет его в родительский HTML-элемент.

Унаследован от [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#build). ||
|| [clear](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#clear)() | | Удаляет содержимое макета из DOM.

Унаследован от [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#clear). ||
|| [destroy](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#destroy)() | | Деструктор. Вызывается при завершении работы с макетом.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#destroy). ||
|| [getData](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#getData)() | Object | Возвращает объект данных макета.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#getData). ||
|| [getParentElement](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#getParentElement)() | HTMLElement | Возвращает родительский HTML-элемент.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#getParentElement). ||
|| [getShape](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#getShape)() | [IShape](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/IShape.md)\|null | Возвращает фигуру, описывающую форму области, охватывающей макет, либо null, если нет возможности рассчитать данную фигуру. По умолчанию пытается построить фигуру через опцию shape - this.getData().options.get('shape'). В опции можно задать как инстанцию класса, реализующего интерфейс IShape, так и JSON-описание пиксельной геометрии фигуры. Координаты геометрии фигуры должны отсчитываться от точки привязки родительского элемента макета.

Унаследован от [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#getShape). ||
|| [isEmpty](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#isEmpty)() | Boolean | Возвращает true, если макет пуст, т.е. не имеет содержимого. Данный признак используется для сокрытия пустых объектов, таких как хинт, балун и другие.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#isEmpty). ||
|| [onSublayoutSizeChange](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#onSublayoutSizeChange)([sublayoutInfo](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#onSublayoutSizeChange-param-sublayoutInfo), [nodeSizeByContent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#onSublayoutSizeChange-param-nodeSizeByContent)) | | Автоматически вызывается при изменении размеров вложенного макета, добавленного с параметром 'observeSize'. Используется для переопределения в конкретных классах макетов для реакции на изменение размеров содержимого.

Унаследован от [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#onSublayoutSizeChange). ||
|| [rebuild](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#rebuild)() | | Перестраивает макет.

Унаследован от [layout.templateBased.Base](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/layout.templateBased.Base.md#rebuild). ||
|| [setData](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setData)([data](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setData-param-data)) | | Задает данные макета.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setData). ||
|| [setParentElement](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setParentElement)([parent](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setParentElement-param-parent)) | | Добавляет макет в DOM-дерево.

Унаследован от [ILayout](https://yandex.ru/dev/jsapi-v2-1/doc/ru/v2-1/ref/reference/ILayout.md#setParentElement). ||
|#

<!-- XLIFF_FARM_ZGNmOTZk_CACHING -->

[*star]: Обязательный параметр.