JSFiddle - React, Tailwind, and code Playground
HTML
<div id="map"></div>
CSS
</style><script type="text/javascript" src="https://yandex.st/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<style>
#map{height:600px;}
JavaScript
ymaps.ready(function init() {
map = new ymaps.Map('map', {
center: [55.76, 37.64],
zoom: 10,
autoFitToViewport: 'always',
controls: ['zoomControl', 'typeSelector', 'rulerControl', 'geolocationControl']
});
map.behaviors.disable("scrollZoom");
objectManager = new ymaps.ObjectManager({
clusterize: true,
clusterOpenBalloonOnClick: false,
clusterDisableClickZoom: true,
});
objectManager.add(collection);
map.geoObjects.add(objectManager);
objectManager.clusters.events.add('click', function (e) {
var cluster = objectManager.clusters.getById(e.get('objectId'));
// предположение №1
objectManager.objects.setObjectOptions(e.get('objectId'), {
contentLayout: 'test111',
balloonContentLayout: 'test222',
clusterBalloonContentLayout: 'test333',
contentBodyLayout: 'test444',
balloonContentBodyLayout: 'test555',
clusterBalloonContentBodyLayout: 'test666',
});
alert('pass #1');
// предположение №2
objectManager.clusters.setClusterOptions(e.get('objectId'), {
contentLayout: 'test111',
balloonContentLayout: 'test222',
clusterBalloonContentLayout: 'test333',
contentBodyLayout: 'test444',
balloonContentBodyLayout: 'test555',
clusterBalloonContentBodyLayout: 'test666',
});
alert('pass #2');
});
});
var collection =...