Как настроить кастомные кластеры в am5map?

Для настройки кастомных кластеров в am5map, мы должны использовать ClusteredSeries вместе с кастомными кластеровощами, которые являются дочерними элементами кластера.

Вот пример кода, который показывает, как настроить кастомные кластеры в am5map:

// Создание кластерованной серии
var series = chart.series.push(new am5maps.ClusteredSeries());
series.dataFields.value = "value";
series.dataFields.category = "category";

// Настройка кластеровщика
var cluster = series.clusteredDataItems.template;
cluster.clustered = false; // Отключение встроенного кластеризатора
cluster.labelX = am5core.percent(50); // Позиция X метки кластера
cluster.labelY = am5core.percent(50); // Позиция Y метки кластера

// Настройка кастомных кластеров
var customCluster = cluster.createChild(am5maps.MapImageSeries);
var circle = customCluster.createChild(am5core.Circle);
circle.radius = 20; // Радиус круга
circle.fill = am5core.color("#ff0000"); // Цвет круга
circle.stroke = am5core.color("#ffffff"); // Цвет обводки круга

// Привязка данных кастомных кластеров
customCluster.dataFields.value = "value";
customCluster.dataFields.category = "category";
customCluster.data = series.data;

// Включение отображения кастомных кластеров
customCluster.show();

// Настройка метки кластеров
var label = customCluster.createChild(am5core.Label);
label.text = "{value}"; // Использование значения элемента в метке
label.fontSize = 12;
label.horizontalCenter = "middle";
label.verticalCenter = "middle";

// Загрузка данных для кластеров
series.data = [
  {"category": "A", "value": 5},
  {"category": "A", "value": 7},
  {"category": "B", "value": 2},
  {"category": "B", "value": 4},
  {"category": "C", "value": 10}
];

В этом примере мы сначала создаем кластеризованную серию и настраиваем свойства данных, такие как value и category. Затем мы отключаем встроенный кластеризатор и настраиваем позицию метки кластера.

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

Затем мы настраиваем метку кластера, используя значение элемента в качестве текста метки. Наконец, мы загружаем данные для кластеров.

Таким образом, с помощью этих шагов мы настраиваем кастомные кластеры в am5map.