Google Maps na własnej witrynie

Określenie lokalizacji

Do rozpoczęcia prac konieczne jest określenie, gdzie znajduje się firma oraz jej oddziały (jeżeli istnieją lub jest ich więcej). Terminem nierozerwalnie związanym z lokalizacją jest długość i szerokość geograficzna. Dzięki tym parametrom, określonym z pewną dokładnością, możliwe jest bardzo szybkie odnalezienie dowolnego punktu na globie.

Określenie lokalizacji polega na odczytaniu współrzędnych geograficznych. Wystarczy zaznaczyć na mapie miejsce, wyśrodkować i odczytać współrzędne Przez ostatnie kilka lat nastąpił znaczący wzrost liczby urządzeń wykorzystujących system pozycjonowania GPS. Przenośne lokalizatory GPS byłyby oczywiście bezużyteczne bez odpowiedniej mapy. Mapy pozwalają na przygotowanie trasy dojazdu lub odnalezienie się w danej lokalizacji. Jeżeli mamy lokalizator GPS, możemy odczytać aktualne wartości przekazywane przez urządzenie.

Z uwagi na chęć otrzymania możliwie precyzyjnych wyników, należy tego dokonać poza obszarem budynku, w którym się znajdujemy. Warto teraz sprawdzić czy otrzymane wyniki są zgodne z mapą Google. Wchodzimy na Google Maps i podajemy po przecinku otrzymane wyniki. Określenie lokalizacji możliwe jest także bez korzystania z jakichkolwiek urządzeń.

Wystarczy w Google Maps wprowadzić nazwę ulicy, miejscowość oraz kraj, np. Rynek Główny, Kraków, Poland.

Kraków jest dość dużym miastem o unikalnej nazwie, więc niekonieczne jest określanie kraju czy kontynentu, którego ma dotyczyć poszukiwanie. Inaczej jest z nazwami miejscowości występujących w wielu miejscach na różnych kontynentach. Gdy np. szukając Kasiny Wielkiej wprowadzimy "Kasina", odnajdziemy "Kasina, Sierra Leone" w Afryce. Musimy więc sprecyzować, gdzie znajduje się ta miejscowość. Wpisujemy więc: "Kasina, Polska". Jeżeli do wyszukiwarki wprowadzimy "Brzeg, Polska", Google Maps odnajdzie trzy lokalizacje. Wystarczy z listy wybrać właściwe województwo, by odnaleźć pożądane miasto.

W momencie odnalezienia właściwej lokalizacji klikamy prawym przyciskiem w miejscu, w którym znajduje się firma. Wybieramy "Center Map Here". Następnie po prawej stronie nad mapą klikamy "Link to this page". Pojawia się małe okienko z adresem. W całym ciągu znaków interesuje nas ostatni parametr o nazwie "ll":

ll=50.061561,19.938764

Zawartość tego parametru to szerokość i długość geograficzna. Wystarczy teraz wkleić do okna wyszukiwarki frazę "50.061561,19.938764", by się przekonać, że wskazuje ona na Kościół Mariacki w Krakowie.

Rejestracja

By umieścić mapę na stronie, trzeba spełnić dwa warunki:

• mieć konto w Google (by stworzyć takie konto wystarczy podać swój e-mail – dowolny, niekoniecznie w Gmail – oraz hasło; konto jest bezpłatne i możemy je wykorzystywać do rejestracji także w innych usługach Google, np. w Google SiteMaps),
• zaakceptować licencję Site Maps API i wygenerować tzw. klucz API (ang. API key), który pozwala na wyświetlenie mapy w obrębie wskazanego adresu URL.

By zarejestrować stronę w Maps API, wchodzimy na stronę http://www.google.com/apis/ m... i wybieramy "Sign up for a Google Maps API key". Akceptujemy regulamin i wprowadzamy adres strony (np. http://mojastrona.pl). To bardzo istotne. Mapa nie zadziała, jeżeli adres strony, na której jest umieszczona, nie będzie zgodny z podanym w formularzu. W odpowiedzi otrzymujemy klucz. Jeżeli nie mamy konta w Google, konieczne będzie uzupełnienie krótkiego formularza rejestracji.

Wdrożenie

Do wdrożenia możemy wykorzystać przykładowy kod, który wyświetla się w momencie generowania klucza. Taki kod możemy przygotować samodzielnie, dostosowując jego zawartość do własnych potrzeb. Do tego celu konieczne jest poznanie funkcji, które odpowiadają za poprawne wyświetlanie kolejnych elementów strony.

By nie zmuszać Czytelnika do własnoręcznego implementowania poszczególnych funkcji, nasze przykłady będą w pełni działające.

Jedynym wymaganym do uruchomienia przykładów zadaniem będzie dodanie klucza do kodu przykładu oraz zmiana współrzędnych. Warunkami wyświetlenia poprawnej mapy są dwa aspekty:

• wprowadzenie poprawnego klucza do kodu źródłowego strony, odpowiedzialnego za wyświetlanie mapy,
• zgodność adresu podanego w formularzu rejestracyjnym z adresem, pod którym pracuje mapa. Jeżeli korzystamy z serwera testowego, zlokalizowanego na domowym komputerze, konieczne będzie utworzenie osobnego klucza, np. dla domeny localhost.

Nie ma ograniczenia w ilości generowanych kluczy, a ponadto wygenerowanie nowego klucza nie dezaktywuje starego. By wyświetlić mapę, konieczne jest wklejenie na stronę określonego fragmentu kodu.

Nie jest to takie proste. Jeżeli nie chcemy lub nie potrafimy zmodyfikować nagłówka HEAD dokumentu HTML tylko na potrzeby podstrony z mapą, musimy skorzystać z ramki. Takie rozwiązanie jest najłatwiejsze do wdrożenia i nie ma żadnych przeciwwskazań. Jedyną wadą jest konieczność stworzenia dodatkowego pliku HTML, który będzie bardzo łatwy do modyfikacji.

Edytujemy szablon strony odpowiedzialny za dział, gdzie ma się znaleźć mapa lub korzystamy z panelu administracyjnego systemu CMS. Przełączamy się na edycję kodu źródłowego, jeżeli wybraliśmy CMS.

W pożądanym miejscu wstawiamy kod:

 

 

HTML

<center><iframe src="http://www.mojadomena.pl/ mapa.html" width="540" height="340"
   frameborder="0">niestety twoja przeglądarka nie obsługuje ramek - nie mogę
   wyświetlić mapy</iframe></center>

Powyższy kod wstawi w określone miejsce stronę mapa.html, ograniczając ją do rozmiarów 540 x 340 pikseli. Jeżeli chcemy stworzyć większą lub mniejszą mapę, modyfikujemy te parametry. Nie trzeba zachowywać żadnych proporcji pomiędzy powyższymi wymiarami. Kod naszej mapy musimy zatem ukryć w pliku mapa.html. Tworzymy taki plik w dowolnym edytorze i przenosimy na serwer. Do tego celu należy wykorzystać dowolnego klienta FTP (np. Total Commander, WinSCP itp.).