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.

Efektowny interfejs ze strony Mapy Google

Ten artykuł dotyczy API w wersji 2

« powrót do listy poradników

Bardzo ważną częścią każdej aplikacji jest jej interfejs - im bardziej przejrzysty i dobrze zaprojektowany, tym lepiej.

Google przykłada szczególną uwagę do prostoty interfejsów swojej aplikacji, dlaczego więc nie skorzystać z ich osiągnięć, i nie upodobnić swojej własnej mapy w Google Maps API do oryginalnego serwisu maps.google.com? Jest to kwestia zaledwie jednej linijki.

Poniższy kod:

mapa = new GMap2(document.getElementById("mapka"));
mapa.setCenter(new GLatLng(52.06600028274635, 19.00634765625), 6);
mapa.setUIToDefault();

doda do mapy kontrolki, znane z oryginalnych Map Google. Dodatkowo, dzięki tej jednej linijce włączone zostaną:

  • obsługa mapy za pomocą klawiatury (strzałki, klawisze PageUp, PageDown, a także + i -)
  • operowanie poziomem przybliżenia za pomocą kółka myszy

Sprawdź przykład 1, by zobaczyć, jak działa to w praktyce: 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


Kategorie markerów i polilinii

API v2

Stwórz markery/polilinie w kilku kategoriach, a następnie ukrywaj i pokazuj wybrane kategorie


jQuery i Google Maps

API v2

Przyjemne dla oka animacje za pomocą bilbioteki jQuery uatrakcyjnią każdą mapę!


Wbudowane kontrolki i sterowanie

API v2

Kurs podstaw cz. VI: Dodawanie wbudowanych kontrolek i definiowanie sterowania mapy