DonutChart

Свойства DonutChart

• items (DonutChartItem[]):
  Массив объектов, представляющих данные для диаграммы. Каждый элемент определяет значение сегмента и его цвет.
• innerRadius (number):
  Внутренний радиус диаграммы, определяет, насколько большой будет центральное отверстие. По умолчанию: 120.
• outerRadius (number):
  Внешний радиус диаграммы. По умолчанию: 150.
• hoverInnerRadius (number):
  Внутренний радиус, используемый при наведении мыши на сегмент. По умолчанию: 110.
• hoverOuterRadius (number):
  Внешний радиус, используемый при наведении мыши на сегмент. По умолчанию: 160.
• onItemMouseEnter (function(item: DonutChartItem)):
  Обработчик события наведения мыши на сегмент. Возвращает элемент, на который наведена мышь.
• onItemMouseLeave (function):
  Обработчик события, вызываемый при уходе мыши с сегмента.

Внутренние функции

• scale (value: number):
  Преобразует значение элемента в угол (в радианах) для отображения на диаграмме.
• arcs (createMemo):
  Вычисляет набор дуг для диаграммы на основе данных items. Возвращает массив объектов, каждый из которых содержит начальный угол, конечный угол, цвет и данные элемента.

DonutChartArc

Отдельный компонент DonutChartArc отвечает за рендеринг отдельного сегмента диаграммы. Поддерживает взаимодействие с мышью и изменяет радиусы при наведении.

Свойства DonutChartArc

• startAngle (number):
  Начальный угол сегмента (в радианах).
• endAngle (number):
  Конечный угол сегмента (в радианах).
• color (string):
  Цвет сегмента.
• innerRadius (number):
  Внутренний радиус сегмента.
• outerRadius (number):
  Внешний радиус сегмента.
• hoverInnerRadius (number):
  Внутренний радиус сегмента при наведении мыши.
• hoverOuterRadius (number):
  Внешний радиус сегмента при наведении мыши.
• onMouseEnter (function):
  Обработчик события наведения мыши на сегмент.
• onMouseLeave (function):
  Обработчик события ухода мыши с сегмента.

Важные моменты

• arc:
  Функция, которая строит путь SVG для каждого сегмента на основе начального и конечного углов, а также радиусов.
• createMemo:
  Используется для кэширования вычислений углов, дуг и пути SVG для повышения производительности.