Необходимо чтобы при открытии страницы пользователь видел весь Приморский край с 2-мя точками - Уссурийск, Владивосток.
Ниже под картой есть список этих городом, по клику на который мы перемещаемся на конкретный город + увеличенный немного зум.
Вот код, он работает не правильно, точка поставлена только 1 и не там где надо. Помогите пожалуйста исправить!
Вот если нужно потренероваться с кодом, но там не те города.
jsfiddle.net/vdann/YDg62/14
<script src="http://api-maps.yandex.ru/2.0/?load=package.standard&lang=ru-RU" type="text/javascript"></script>
<div id="map" style="width:100%; height:300px"></div>
<a href=\"#\" class="goto">Уссурийск</a><br>
<a href=\"#\" class="goto">Владивосток</a><br>
<div id="result"></div>
//Дождёмся загрузки API и готовности DOM.
ymaps.ready(init);
function init() {
var result = document.getElementById('result'), // для отладки
// в этой версии координаты просто элементы массива (и они поменяны местами)
destinations = {
'Общее': [43.40665415899191,132.53435398828117],
'Уссурийск':[43.80149176264547,131.95095745767208],
'Владивосток': [43.16744918790433,131.93554316535938]
},
// Создание экземпляра карты и его привязка к контейнеру с
// заданным id ("map").
myMap = new ymaps.Map('map', {
center: destinations['Общее'],
zoom: 10
}, {
searchControlProvider: 'yandex#search'
}),
myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
hintContent: 'Собственный значок метки',
balloonContent: 'Это красивая метка'
}, {
// Опции.
// Необходимо указать данный тип макета.
iconLayout: 'default#image',
// Своё изображение иконки метки.
//iconImageHref: 'images/myIcon.gif',
// Размеры метки.
iconImageSize: [30, 42],
// Смещение левого верхнего угла иконки относительно
// её "ножки" (точки привязки).
iconImageOffset: [-5, -38]
});
myMap.geoObjects.add(myPlacemark);
// все ок
result.textContent = 'map init';
// куда скакать
function clickGoto() {
// город
var pos = this.textContent;
result.textContent = pos;
// переходим по координатам
myMap.panTo(destinations[pos], {
flying: 1
});
myPlacemark = new ymaps.Placemark(myMap.getCenter(), {
hintContent: 'Собственный значок метки',
balloonContent: 'Это красивая метка'
}, {
// Опции.
// Необходимо указать данный тип макета.
iconLayout: 'default#image',
// Своё изображение иконки метки.
//iconImageHref: 'images/myIcon.gif',
// Размеры метки.
iconImageSize: [30, 42],
// Смещение левого верхнего угла иконки относительно
// её "ножки" (точки привязки).
iconImageOffset: [-5, -38]
});
return false;
}
// навешиваем обработчики
var col = document.getElementsByClassName('goto');
for (var i = 0, n = col.length; i < n; ++i) {
col[i].onclick = clickGoto;
result.textContent = result.textContent + ' ' + i;
}
}