fantazer
6/8/2017 - 11:15 AM

Карта метка Yandex

Карта метка Yandex

script(src='http://api-maps.yandex.ru/2.0/?load=package.full&lang=ru-RU')

//http://dontforget.pro/javascript/neskolko-svoih-stilizovannyih-metok-na-yandeks-karte-api-2-0 - урок
//https://tech.yandex.ru/maps/jsbox/


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

ymaps.ready(function () {
	ymaps.ready(init); // карта соберется после загрузки скрипта и элементов
	var myMap; // заглобалим переменную карты чтобы можно было ею вертеть из любого места
	function init() { // функция - собиралка карты и фигни
		myMap = new ymaps.Map("map", { // создаем и присваиваем глобальной переменной карту и суем её в див с id="map"
			center: [55.76, 37.64], // ну тут центр
			behaviors: ['default', 'scrollZoom'], // скроллинг колесом
			zoom: 10 // тут масштаб
		});

	}
	var myPlacemark0 = new ymaps.Placemark([55.752577, 37.632134], { // Создаем метку с такими координатами и суем в переменную
		balloonContent: '<div class="baloon"> Новая компания!</div> ' // сдесь содержимое балуна в формате html, все стили в css
	}, {
		iconImageHref: 'img/marker.png', // картинка иконки
		iconImageSize: [32, 32], // размер иконки
		iconImageOffset: [-32, -64], // позиция иконки
		balloonContentSize: [270, 99], // размер нашего кастомного балуна в пикселях
		balloonLayout: "default#imageWithContent", // указываем что содержимое балуна кастомная херь
		balloonImageOffset: [-65, -89], // смещание балуна, надо подогнать под стрелочку
		balloonImageSize: [260, 89], // размер картинки-бэкграунда балуна
		balloonShadow: false
	});
	myMap.events.add('click', function (e) {
	 myMap.balloon.close();
	});

	myMap.geoObjects
			.add(myPlacemark0);

	//myPlacemark0.balloon.open(); //Сразу открывает балун
})
/* Добавляем метки на карту */