MapFont -Yandex Map integration

by Dmitry Kosatchev

HTML

<!--style-->
<link href="//mapfont.org/css/mapfont.css" rel="stylesheet">

<h2>Yandex Map integration</h2>
<div>
	<div id="yandexmap"></div>
</div>

<!--Yandex Maps API-->
<script type="text/javascript" src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"> </script>

CSS

h2 {
	font-family: "Proxima Nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	margin-bottom: 10px;
	font-size: 25px;
	color: #1568b1;
}
#yandexmap {
	height: 400px;
}

JavaScript

ymaps.ready(function(){

	var yMap = new ymaps.Map("yandexmap", {
		center: [57.145, 65.523],
		zoom: 14
	});
	
	point = new ymaps.GeoObject({
		geometry: {
			type: "Point",
			coordinates: [57.145, 65.523]
		},
		properties: {
			iconContent: '<i class="mf mf-map-marker mf-ymap-api"></i>',// Use standard MapFont classes with addition class mf-ymap-api
			balloonContent: 'Point desctiption'
		}
	}, {
		preset: 'islands#grayCircleIcon',// Best view with light colour circle icon
		draggable: true,
	}),
	
yMap.geoObjects
.add(point);
});