JSFiddle - React, Tailwind, and code Playground

by Maksim Morozov

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://api-maps.yandex.ru/2.0/?load=package.standard&lang=ru-RU" type="text/javascript"></script>

<div id="map"></div>

CSS

#map {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;       
}

JavaScript

ymaps.ready(function () {

    var myMap = new ymaps.Map('map', {
            center: [52.281875,76.978864],
            zoom: 15,         
            controls: ['zoomControl']
        }),
		
		    objectManager = new ymaps.ObjectManager({
            clusterize: true,
            gridSize: 32
        });
		

    objectManager.objects.options.set( {
        iconLayout: 'default#image',
        iconImageHref: 'http://vk.mirada.kz/ava/1a.png',
        iconImageSize: [30, 42],
        iconImageOffset: [-3, -42]
    });
	

    objectManager.clusters.options.set('preset', 'islands#greenClusterIcons');
	


    $.ajax({
        url: "http://vk.mirada.kz/users.php"
    }).done(function(data) {
        objectManager.add(data);
    });

	
    myMap.geoObjects.add(objectManager);    
});