В предыдущем посте я рассказал о примере показа объектов из Google Places на карте. Сегодня к ним добавлю фотографии сервиса Panoramio.
Если кто не знает, Panoramio — это фото хостинг, где изображения имеют привязку к местности. С некоторых пор, Panoramio входит в Google. Соответственно, присутствует тесная интеграция с Google maps, earth и т.д.
Существует масса вариантов как разместить фотографии из Panoramio на своем сайте.

В рассмотренном у меня примере рядом с картой расположена форма выбора типа объектов, я просто решил добавить еще одну галку «фотографии».
Соответственно, осталось реализовать совместную работу Google Places и Panoramio Api. Сделать это оказалось очень просто: нужно загрузить соответствующие библитеки и добавить слой с фотографиями.
Для загрузки нескольких библиотек нужно перечислить их через запятую:

"http://maps.google.com/maps/api/js?sensor=false&libraries=places,panoramio"



var map = new google.maps.Map(document.getElementById("g-map"), myOptions);

добавим в форму чекбокс, в случае, если он отмечен добавляем на карту слой:

 var panoramioLayer = new google.maps.panoramio.PanoramioLayer();

 panoramioLayer.setMap(map);';

и вот результат!

стоит отметить, что слой уже содержит все минимально необходимое: при клике на превью открывается окно просмотра со ссылкой на страницу фотографии, при масштабировании автоматически показываются фотографии соответствующие видимой области.

Так же, можно дописать желаемый функционал, например список просмотренных фото.

Остается только добавить, что по данным из википедии на 3 октября 2011 года в Panoramio было 60 миллионов фото и каждый следующий миллион загружается на сайт примерно за 20 дней.
Вот такая забавная статистика…

Добавление фотографий из Panoramio на карту