Save The Developers 0
Akcja pod którą podpisuje się wszystkimi nibynóżkami.
Akcja pod którą podpisuje się wszystkimi nibynóżkami.
Witam czytelników,
Zmiany jakie dopadły mnie w ciągu ostatnich tygodni:
Pozdrawiam
Weekend, wycieczka autem “pod Poznań” (87,6 Km). Spanie w namiocie. Deszcz, wilgoć, komary. Wszystko po to by odstresować się przed egzaminem wstępnym na studia II stopnia i spotkać się z Martą po 2 tygodniach rozłąki. Pełen energii i pogryzień spowodowanych przez Culex pipiens molestus. Wracam do Poznania by dostać się na studia. I podgonić projekty w pracy
Pozdro
Dawno nic o google maps nie pisałem zatem przedstawie wam kurs jak do statycznej strony np z kontaktem dodać mapę googla z kilkoma efektami. Ktoś pewnie zapyta: “po co? Przecież jest dokumentacja na googlemaps.com” Ja pokażę krok po kroku co i jak. Nie obraźcie się jeśli ten tutorial będzie wyglądał jak artykuł z “Komputer świata”.



window.onload = function() {
if (GBrowserIsCompatible()) {
//Inicjalizacja mapy poprzez tworzenie obiektu
var map = new GMap2(document.getElementById("map"));
}else{
alert("sorry but your browser sux hard. update it and come again!");
}
});map.setCenter(new GLatLng(35.083956, 103.710938), 4);map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());var lat = 0;
var lng = 0;
var point = new GLatLng(lat, lng);
var marker = new GMarker(point);
map.addOverlay(marker);map.openInfoWindow(point, 'To jest nasz punkt!');map.clearOverlays(); Modyfikacja template polega na edycji pliku header.php plus ewentualnie można dodać kilka linii css w style.css
Najpierw zostawmy wszystkie style i temu podobne
Musimy w sekcji head dwie linie:
<head>
<script src="http://maps.google.com/maps?file=api&v=2&key=TUTAJ_WSTAWIAMY_API_KEY" type="text/javascript"></script>
<script src="<?php bloginfo('template_directory'); ?>/js/gmaps.js.php" type="text/javascript">
</script>
</head>
Sprawa prosta. Publikujemy nową stronę. Nazywamy ją kontakt.

I dodajemy do niej naszą mapkę:
<div id="map"></div>
Można przy okazji ją również ostylować.
<div id="map" style="width: 100%; height: 400px;"></div>
Nim odpalimy po raz pierwszy naszą mapkę. To najpierw pamiętajmy o wrzuceniu na serwer wszystkich plików. Nie wiem czy zbyt wiele wymagam ale biorę za pewnik to że potraficie obsługiwać jakiegokolwiek klienta FTP.
Zatem wrzucamy pliki:
wp-content/themes/nasztheme/js/gmaps.js
wp-content/themes/nasztheme/header.php
Wszyscy doskonale zdają sobie z tego sprawę że strona musi być efektowna. Można też użyć cytatu:
- Aplikacja?
- Ma być droga i robić biiip
No to sprawa prosta żeby zadbać o tzw. “Wow Effect” (nie mylić z Word Of Warcraft) możemy zastosować małą animację. Dla dużego odsetka klientów ten cytat jest
Np. Jeżeli Firma ma trzy oddziały w mieście to możemy zrobić takie coś:
By zaimplementować taki skrypt nie potrzebujemy dużo dodatkowej wiedzy z dziedziny javascript’u. Po pierwsze musimy wiedzieć jak używać funkcji:
window.setInterval(function() {
//tutaj implementujemy swoją funkcje bądź wywołujemy już wcześniej zaimplementowaną
}, 4000);
//4000 to czas w milisekundach czyli w tym wypadku 4 sekundy.
Za animację naszej mapy będzie odpowiadać:
//dodajemy marker
var marker = new GMarker(point);
map.addOverlay(marker);
//wyświetlamy dymek
map.openInfoWindow(point, 'tekst o odzdziale');
//przesuwamy mapę
map.panTo(point);
Gdzie point to element z tablicy gdzie zdefiniowaliśmy oddziały firmy.
Po wyświetleniu trzeba wyczyścić mapę za pomocą:
map.clearOverlays();
W sumie zastanawiam się czemu piszę taki tutorial, ponieważ jest gotowy plugin do wordpress’a który rozwiązuje problemy z googlemaps. Konfigurowalny z wp-admin z ładnego formularza.
Może tylko po to by nauczyć się korzystać z narzędzi, które ułatwią nam pracę i nauczą pisać dobre javascripty. Zachęcam do prób z kodowaniem map by Googlemaps. I zapewniam że GoogleMaps API nie gryzie
Wygoda pracy to chyba podstawa sukcesu każdego programisty, ponieważ zapewnia nieprzerwanego skupienia. Programista skupiony nie robi głupich błędów. Nie przeczytał całego wykopu, ani joemonster’a. Jeżeli komfortowo może kodować to nic więcej do szczęścia mu nie potrzeba, no może za wyjątkiem odrobiny motywacji. Jednak nie mówię tutaj o klimatyzowanych biurach na 22 piętrze, a o oprogramowaniu.
Z góry przestrzegam, że tekst ten jest w 100% subiektywny i przedstawia tylko i wyłącznie moje zdanie. Nie zgadzasz się? To zapraszam do dyskusji w komentarzach.
Z dumą informuje, że zostałem członkiem grupy użytkowników adobe w Poznaniu. Najbliższe spotkanie odbędzie się 18 lipca.
Będę miał małą prezentacje dotyczącą Adobe AIR pt. “Hello Word”
Zapraszam wszystkich chętnych. Szczegółowy plan spotkania dostępny na:
Witam wszystkich czytelników. Nadchodzi wielkimi krokami dzień publikacji artykułu o środowisku webdevelopera. Tekst jest już napisany. Linki do stron z dodatkowymi zasobami już są. Teraz muszę porobić screenshoot’y, sprawdzić pisownię i można publikować.
Tymczasem w piątek mam jak narazie najważniejszy egzamin w życiu (Licencjacki), więc datę publikacji mogę przybliżyć do przyszłego weekendu.
Ponad to muszę jeszczę edytować obecny theme wordpressowy, ponieważ jest problem z kolejnymi stronami wpisu. I muszę dodać nawigację między stronami artykułu.
Mam nadzieję, że ktoś to przeczyta w całości bo jest dosyć długie
. Grupę docelową stanowią zarówno początkujący jak i bardziej zaawansowani programiści aplikacji webowych (mowa przedewszystkim o php)