www.gmapsapi.com

Kompleksowy kurs podstaw API, po którym mapowianie nie będzie miało przed Tobą żadnych tajemnic!

Setki przykładów, kursów i poradników z kodem gotowym do skopiowania i korzystania.

Największa strona o Google Maps API w Polsce, największe źródło informacji w języku polskim.

Wstawianie zdjęć z Picasa Web Albums

Ten artykuł dotyczy API w wersji 2

« powrót do listy poradników

W poradniku Tworzenie własnych obiektów GOverlay został opisany sposób na dodanie własnych obiektów do mapy. Jeden z przykładów pokazywał, w jaki sposób można dodać miniaturkę zdjęcia. Było to dość pracochłonne, w celu wyświetlenia większej ilości zdjęć konieczne było pisanie wielu linii kodu. Jeśli posiadasz konto w Picasa Web Albums, a Twoje zdjęcia posiadają informację w EXIF o pozycji geograficznej (lub ich pozycja została ustalona ręcznie) to za pomocą jednej linii kodu możesz w łatwy sposób wyświetlić je na mapie.

W tym przykładzie wykorzystałem galerię zdjęć Picasa Team w serwisie Picasa Web Albums. Wszystkie operacje, które wykonałem da się również powtórzyć dla dowolnego innego konta w Picasa Web Albums.

  1. Wejdź na stronę albumu, z którego zdjęcia chcesz wyświetlić na mapie. Po prawej stronie ekranu powininien znajdować się przycisk "Wyświetl w Google Earth" (zobacz obrazek poniżej)
    Wyświetl w Google Earth
  2. Skopiuj adres linka do schowka (powinen wyglądać mniej więcej tak: http://picasaweb.google.com/data/feed/base/user/picasateam/albumid/5114654179889917777?alt=kml&kind=photo&hl=pl)
  3. Upewnij się, że język aplikacji jest zgodny z parametetrem hl ze skopiowanego linka. Przykładowo, w powyższym adresie URL wartość parametru hl to pl, ale jeśli Twoja mapa posiada interfejs w języku np. hiszpańskim, powienieneś zmienić tę wartość na es.

Tak skopiowany link użyjemy jako adres URL pliku, przekazywany jako jedyny argument w konstruktorze obiektu GGeoXml. Obiekty GGeoXml dodaje się na mapę za pomocą metody addOverlay() mapy GMap2 - wówczas API samo pobierze, sparsuje i wyświetli żądaną treść. Dla wybranego przeze mnie albumu fragment kodu aplikacji wyglądać będzie następująco:

var zdjecia = new GGeoXml("http://picasaweb.google.com/data/feed/base/user/picasateam/albumid/5114654179889917777?alt=kml&kind=photo&hl=pl");
mapa.addOverlay(zdjecia);

Za pomocą dwóch linijek kodu można osiągnąć to, co w przypadku ręcznego kodowania zajęło by wiele linii. Oczywiście, możliwości konfiguracji i wyglądu nie są zbyt duże, ale dla większości początkujących użytkowników efekt powinien być zadowalający: przykład 1pokaż kod przykładu

Polecane artykuły

Dodaj stronę do ulubionego serwisu społecznościowego

Oto, co najczęściej czytają internauci, którzy przeczytali ten artykuł:

Dodawanie markerów przez użytkownika

API v2

Poradnik pokazuje, w jaki sposób stworzyć formularz, pozwalający na dodawanie markerów


Wczytywanie danych z pliku XML

API v2

Kurs podstaw cz. X: Omówienie wczytywania danych z pliku XML za pomocą AJAXa


Pobieranie danych z bazy MySql

API v2

Zobacz, jak pobrać dane markerów, zawarte w bazie MySql i wyświetlić je na mapie


Wyszukiwanie markerów as-you-type

API v2

Jak stworzyć wyszukiwanie i filtrowanie markerów as-you-type przy użyciu bazy danych