Skip to content

Instantly share code, notes, and snippets.

@ArtemSites
Last active November 28, 2019 07:31
Show Gist options
  • Save ArtemSites/7d5e97ea3d94fb3b6d7c4267e72fce6c to your computer and use it in GitHub Desktop.
Save ArtemSites/7d5e97ea3d94fb3b6d7c4267e72fce6c to your computer and use it in GitHub Desktop.
Добавление своих меток в yandex карту.
<div class="section-map map">
<div class="map-open js-map-open-xs">
<p>Для открытия карты, кликните на нее</p>
</div>
<div id="map"></div>
<script type="text/javascript" src="https://api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<script>
ymaps.ready(function() {
var myMapBallon = {
iconLayout: 'default#image',
iconImageHref: '/pointer.svg',
iconImageSize: [38, 48],
iconImageOffset: [-19, -24]
};
var myMap = new ymaps.Map('map', {
center: [53.233530, 50.243781],
zoom: 13
}, {
searchControlProvider: 'yandex#search'
}),
myPlacemark = new ymaps.Placemark([51.194990242949352, 52.28401851617851], {
hintContent: '<b>Производство</b> <br>Адрес 1',
balloonContent: '<b>Производство</b> <br>Адрес 1'
}, myMapBallon)
myPlacemarkShowRoom = new ymaps.Placemark([51.214283, 52.184701], {
hintContent: '<b></b>Шоу-рум</b> <br>Адрес 2',
balloonContent: '<b>Шоу-рум</b> <br>Адрес 2'
}, myMapBallon)
myMap.geoObjects.add(myPlacemark);
myMap.geoObjects.add(myPlacemarkShowRoom);
myMap.behaviors.disable('scrollZoom');
$('.js-map-open-xs').on('click', function() {
$(this).remove();
});
});
</script>
</div><!-- /.section-map map -->
// Функция ymaps.ready() будет вызвана, когда
// загрузятся все компоненты API, а также когда будет готово DOM-дерево.
ymaps.ready(init);
function init() {
//[53.2006242, 50.1667614]
// Создание экземпляра карты и его привязка к контейнеру с
// заданным id ("map")
var myMap = new ymaps.Map('map-filter', {
// При инициализации карты, обязательно нужно указать
// ее центр и коэффициент масштабирования
center: [53.2006242, 50.1667614], // Нижний Новгород
zoom: 16
});
//Добавляем элементы управления
myMap.controls
// Кнопка изменения масштаба
.add('zoomControl')
// Список типов карты
.add('typeSelector')
//Линейка масштаба
.add(new ymaps.control.ScaleLine())
// Создание метки
var myPlacemark = new ymaps.Placemark(
// Координаты метки
[53.2006242, 50.1667614], {
// Свойства
// Текст метки
// balloonContentBody: '<a href="#" target="_blank" rel="nofollow">Перейти на сайт</a>',
hintContent: 'Магазин цветов'
}, {
// draggable: true, // Метку можно перетаскивать, зажав левую кнопку мыши.
iconImageHref: '../img/map-point.png', // картинка иконки
iconImageSize: [50, 60], // размеры картинки
iconImageOffset: [0, 0], // смещение картинки
});
// Добавление метки на карту
myMap.geoObjects.add(myPlacemark);
myMap.geoObjects.add(myMap);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment