Как отобразить несколько точек на яндекс картах?

Question

[VladkaPreger]

При добавлении второй точки на яндекс карту, создается вторая карта и накладывается на первую, не могу разобраться как добавить несколько точек в рамках одной карты пример кода.

ymaps.ready(function () {  var ymap = document.querySelector('.contacts__map'); 
 var coordinates = ymap.getAttribute('data-coordinates'); 
 var address = ymap.getAttribute('data-address'); 
 
 var myMap = new ymaps.Map('ymap', { 
 center: [53.2584970,50.2369070], 
 zoom: 16 
 }, { 
 searchControlProvider: 'yandex#search' 
 }), 
 
 myPlacemark = new ymaps.Placemark(myMap.getCenter(), { 
 balloonContent: address 
 }, { 
 iconLayout: 'default#image', 
 iconImageHref: WPJS.siteUrl + '/assets/img/common/marker.svg', 
 iconImageSize: [40, 63.2], 
 iconImageOffset: [-50, -38] 
 }); 
 
 myMap.geoObjects.add(myPlacemark); 
 
 myMap.behaviors.disable('scrollZoom'); 
 
 var myMap = new ymaps.Map('ymap', { 
 center: [53.207394,50.197858], 
 zoom: 16 
 }, { 
 searchControlProvider: 'yandex#search' 
 }), 
 
 myPlacemark2 = new ymaps.Placemark2(myMap.getCenter(), { 
 balloonContent: address 
 }, { 
 iconLayout: 'default#image', 
 iconImageHref: WPJS.siteUrl + '/assets/img/common/marker.svg', 
 iconImageSize: [40, 63.2], 
 iconImageOffset: [-50, -38] 
 }); 
 
 myMap.geoObjects.add(myPlacemark2); 
 
 myMap.behaviors.disable('scrollZoom'); 
 });

Comments

[Илья]

3.8. Использовать для демонстрации фрагментов кода только специальный тег code или специальные демонстрационные ресурсы (например, JsFiddle - https://jsfiddle.net/). Размещение фрагментов кода в виде изображений запрещено.

[VladkaPreger]

Илья, 3.8. Использовать для демонстрации фрагментов кода только специальный тег code или специальные демонстрационные ресурсы (например, JsFiddle - https://jsfiddle.net/). Размещение фрагментов кода в виде изображений запрещено.

[Владислав Лысков]

VladkaPreger, ну дак ты сам создаешь 2 карты, я хз вообще как это работает
раз

var myMap = new ymaps.Map('ymap', { 
 center: [53.2584970,50.2369070], 
 zoom: 16 
 }, { 
 searchControlProvider: 'yandex#search' 
 }),

два

var myMap = new ymaps.Map('ymap', { 
 center: [53.207394,50.197858], 
 zoom: 16 
 }, { 
 searchControlProvider: 'yandex#search' 
 }),

примерно так

myMap.geoObjects
.add(myPlacemark)
.add(myPlacemark2);

[VladkaPreger]

Владислав Лысков, косяк понял, то есть после добавления myplacemark2 все параметры указывать точно так же как и для первой метки?

[Владислав Лысков]

VladkaPreger, ровно так же

[Артем Золин]

Там еще в json можно передавать набор точек, это очень удобно https://yandex.ru/dev/maps/jsbox/2.1/object_manager/

Answer 1

[Николай]

Так, а зачем вы создаете второй раз карту?!

ymaps.ready(function () {
	let ymap = document.querySelector('.contacts__map');
	let coordinates = ymap.getAttribute('data-coordinates');
	let address = ymap.getAttribute('data-address');

	let myMap = new ymaps.Map('ymap', {
		center: [53.2584970, 50.2369070],
		zoom: 16
	}, {
		searchControlProvider: 'yandex#search'
	});

	let myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
		balloonContent: address
	}, {
		iconLayout: 'default#image',
		iconImageHref: WPJS.siteUrl + '/assets/img/common/marker.svg',
		iconImageSize: [40, 63.2],
		iconImageOffset: [-50, -38]
	});

	let myPlacemark2 = new ymaps.Placemark2(myMap.getCenter(), {
		balloonContent: address
	}, {
		iconLayout: 'default#image',
		iconImageHref: WPJS.siteUrl + '/assets/img/common/marker.svg',
		iconImageSize: [40, 63.2],
		iconImageOffset: [-50, -38]
	});

	myMap.geoObjects.add(myPlacemark);
	myMap.geoObjects.add(myPlacemark2);

	myMap.behaviors.disable('scrollZoom');
});

Comments

[VladkaPreger]

Да, спасибо огромное разобрался )