JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//api-maps.yandex.ru/2.1/?lang=uk_UA"></script>
<div id="map"></div>
CSS
html, body, #map {
height: 100%;
margin: 0px;
padding: 0px
}
JavaScript
var myMap;
ymaps.ready(init);
function init () {
var map = new ymaps.Map('map', {center: [56.034, 36.992], zoom: 8});
window.myGeoObjects = [];
window.myGeoObjects[0] = new ymaps.GeoObject({
geometry: {type: "Point", coordinates: [56.034, 35.992]},
properties: {
clusterCaption: 'Геообъект №1',
balloonContentBody: 'Содержимое балуна геообъекта №1.'
}
});
window.myGeoObjects[1] = new ymaps.GeoObject({
geometry: {type: "Point", coordinates: [56.021, 36.983]},
properties: {
clusterCaption: 'Геообъект №2',
balloonContentBody: 'Содержимое балуна геообъекта №2.'
}
});
window.clusterer = new ymaps.Clusterer({clusterDisableClickZoom: true});
window.clusterer.add(window.myGeoObjects);
map.geoObjects.add(window.clusterer);
function updateAvto(myGeoObjects){
window.myGeoObjects[0].geometry.setCoordinates([48.353861,25.681236]);
window.clusterer.refresh();
}
setInterval(updateAvto,1000*10,window.myGeoObjects);
}