Как можно реализовать плавное перемещение карты для каждого элемента отдельно? Т.е. задаю какой-то переключатель и он привязывается к одной точке. И эти переключатели могли находится в любом месте экрана. На сайте Яндекса есть пример для списка: http://api.yandex.ru/maps/doc/jsapi/1.x/examples/mappanto.html
<ul id="mapMenu"></ul>
<div id="YMapsID" style="width:600px;height:400px"></div>
var destinations = {
'Москва': new YMaps.GeoPoint(37.609218, 55.753559),
'Санкт-Петербург': new YMaps.GeoPoint(30.313497, 59.938531),
'Екатеринбург': new YMaps.GeoPoint(60.617435, 56.829748),
'Одесса': new YMaps.GeoPoint(30.7058, 46.466444)
};
// Устанавливает центр карты на первом городе из списка
map.setCenter(destinations['Москва'], 10);
var menuContainer = YMaps.jQuery('#mapMenu');
// Создает список городов
for (var item in destinations) {
// Использует замыкание, чтобы работать с конкретным свойством объекта
(function(title, geoPoint) {
// Создает ссылку, обернутую в тег <p> для лучшей читаемости
YMaps.jQuery("<li><a href=\"#\">" + item + "</'a></li>")
.find('a')
// По щелчку на ссылке создает обработчик
.bind('click', function() {
// Подчеркивает все ссылки
menuContainer.find('a').css('text-decoration', 'underline');
// Кроме той, что была выбрана пользователем
YMaps.jQuery(this).css('text-decoration', 'none');
// Перемещает карту
map.panTo(geoPoint, {
flying: 1
});
return false;
})
.end()
// Записывает созданный элемент списка в список
.appendTo(menuContainer);
})(item, destinations[item])
}