Mapa od Googla bez JavaScriptu

Pod koniec kwietnia Google udostępniło uaktualnienie do Static Maps API, czyniąc z niego znacznie bardziej użyteczne narzędzie. Sądzę że zdecydowana większość przypadków użycia Google Maps na stronach da się załatwić z wersją Static. Jaka jest różnica w stosunku do zwykłego API?

Cała mapa jest generowana jako pojedynczy obrazek i jest osadzana na stronie jako tag img. Nie ma żadnego JavaScript’u, strona ładuje się szybciej, całość jest prostsza, zwłaszcza dla nie znających JavaScript’u. Oczywiście mapa taka nie jest interaktywna (mówiłem już że bez JavaScript’u? :) ), nie da się jej przesuwać i skalować. Ale i tak możliwości są całkiem wystarczające. Jakie to możliwości?

No, oczywiście wygenerowanie mapy żądanej okolicy (tylko jako mapa, widoki Satelitte czy Terrain nie są dostępne) w formacie JPG, PNG lub GIF. Na mapie można zaznaczać miejsca używając znaczników (markery). Owe znaczniki mogą mieć różne kolory, wielkość i ewentualnie różne litery w środku. Dodatkowo na mapie można narysować trasę (do 50 punktów) wybierając grubość, kolor i stopień przeźroczystości linii. Całkiem sporo, zgadza się?

Jak to się robi?

Cóż, niezbędny jest klucz do Google Maps API, skojarzony z adresem pod jakim chcemy wyświetlać naszą mapę. Potem trzeba stworzyć dłuuuuugi URL, który użyjemy jako atrybut src tagu img. Szczegółowo API (czyli jak tworzyć ten URL) jest opisane w dokumentacji, jednak jest narzędzie, które znacznie ułatwia stworzenie (czytaj – wyklikanie) takiego obrazka.

Tutaj przykład – lokalizacja imprezy, na którą zapraszam bardzo serdecznie w najbliższą sobotę 10 maja – Bootstrap 8.5!


Jak widać rezultat jest całkiem zadowalający, a obecny zestaw możliwości jest na tyle duży, że dla znacznej grupy osób statyczne API jest bardzo atrakcyjną alternatywą w stosunku do starszego brata, czyli klasycznego Google Maps API.

I co o tym sądzicie?

Czy według was Static API będzie się cieszyło sporą popularnością? Czy może jest jednak zbyt ubogie w możliwości?

Popularity: 10% [?]

Spodobało się? Podziel się z innymi: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • del.icio.us
  • Gwar
  • Ma.gnolia
  • Wykop
This entry was posted in jaktosierobi and tagged , . Bookmark the permalink.

6 Responses to Mapa od Googla bez JavaScriptu

  1. Narzędzie wystarczające w dużej ilości przypadków, bez dwóch zdań.
    Przydałby się jednak np. link “kliknij żeby otworzyć wersję interaktywną” i wtedy by się otwierała wersja “do przesuwania” z tym samym kawałkiem mapy. Nie powinno to być trudno – można by było nawet tylko kawałek mapy wyświetlić, bez zaznaczonych punktów. Żeby ktoś, kto nie wie, gdzie jest Chłodna i Żelazna, mógł sobie zrobić zoom-out i się zorientować w bardziej ogólnej topografii.

  2. PS. Zmień sobie godzinę na serwerze, bo jest godzinę do tyłu ;)

  3. NetManiac says:

    @Sabon
    Co do czasu – heh, miałem wrażenie, że WP sobie z czasem letnim/zimowym radzi a jednak nie :)

    Co do linku do interaktywnej mapy coś by się dało wyrzeźbić już teraz, w najprostszym przypadku można podlinkować do obrazka maps.google.com odpowiednio wycentrowanej…

  4. Witam!

    Miałem okazję stworzyć już jeden projekt na podstawie StaticGoogleMaps API i owszem, brakuje mi nieco w nim – jak np. ustawianie środka niezależnie od powiększenia określonego na podstawie punktów.

    Tak czy owak, napisanie obejścia nie bylo zbyt trudne, a gdy mój projekt ujrzy światło dzienne, niezwłocznie poinformuję. ;]

    Pozdrawiam,
    Rafał.

    (p.s. projekt czeka na akceptację szefa, bo ukończony już jest)

  5. NetManiac says:

    @Rafał
    No to czekamy z niecierpliwością ;)

  6. Projekt wyszedł “na zewnątrz”.

    Jako, że pracuję w porównywarce cen, więc chcąc ujrzeć mapkę od Google, sugeruję wejść na stronę: http://m.nokaut.pl i podając “gdzie jesteś?” poszukać jakiegoś produktu. Przy szukanym produkcie pojawi się mapka. ;] Miejsce gdzie się jest można również podać bezpośrednio na stronie produktu, lub konkretnego sklepu, np. http://m.nokaut.pl/aparaty-cyfrowe/aparat-canon-400d.html

    Naturalnie w tle dzieje się masa magii, jak dostosowywanie wyglądu mapki do modelu telefonu etc.

    Miłej zabawy i szukania produktów. :-)

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>