Клуб API Карт

Переключение адресов на яндекс карте

l.semen4enko
5 мая, 20:03
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script src="http://api-maps.yandex.ru/2.1/?load=package.standard&lang=ru-RU" type="text/javascript"></script>

	<div id="map" style="width:400px; height:300px"></div>

	<a href="#" class="goto" data-map="Москва">Москва</a><br>
	<a href="#" class="goto" data-map="Киев">Киев</a><br>
	<a href="#" class="goto" data-map="Екатеринбург">Екатеринбург</a><br>
	<a href="#" class="goto" data-map="Одесса">Одесса</a>

<script>
		ymaps.ready(init);

		function init() {
			var myMap = new ymaps.Map('map', {
			    center: [55.753994, 37.622093],
			    zoom: 10,
			    controls: []
			});

	        destinations = {
	            'Москва': [55.753559, 37.609218],
	            'Санкт-Петербург': [59.938531, 30.313497],
	            'Екатеринбург': [56.829748, 60.617435],
	            'Одесса': [46.466444, 30.7058]
	        },        

		    $('.goto').on('click', function(e){
		    	e.preventDefault();

		    	var pos = $(this).data('map'); 

		    	console.log(pos);

		    	// переходим по координатам
		    	myMap.panTo(destinations[pos], {
		    	    flying: 1
		    	});
		    });


		    var myPlacemark = new ymaps.Placemark(destinations['Москва'], {
		        
		    }, {
		    	iconLayout: 'default#image',
		        iconImageHref: 'map-icon.png',
		        iconImageSize: [79, 96],
		        iconImageOffset: [0, -50],
		    });

		    myMap.geoObjects
		        .add(myPlacemark);
		}
	</script>

Есть карта и ссылки с data атрибутами, внутри которых записаны адреса. По клику на ссылку должен происходит переход (не обязательно плавный)  или новая загрузка карты с этим самым адресом вн. дата атрибута данной ссылки. 

destinations  не подходит для данной цели, потому как редактирование адресов не через скрипт будет происходит, а с помощью задания этих самых адресов внутри data-map.

Вопрос: как можно поправить скрипт, чтобы формировалась карта с меткой (и маркером к ней) + по клику на ссылку происходил переход к адресу ссылки, с центрированием и отображением маркера у данного адреса?

3 комментария
Подписаться на комментарии к посту
Вы можете не хранить координаты адресов в destinations, а геокодировать адрес при клике, и брать координаты из ответа геокодера
Примеры работы с геокодером есть в песочнице
l.semen4enko
8 мая, 11:51
dimik,
как через геокодер брать координаты, если есть четко прописанный адрес в ссылке, и как записать эти координаты в destinations?
l.semen4enko,

https://gist.github.com/dimik/eba8820e8396b162c61dc71856ee4b1f