|
|
|
|||||||||||
|
|
|
|||||||||||
"Stadtplan"
"Stadtplan" oznacza po niemiecku "plan miasta" i stworzyłem go właśnie w tym celu. Miałem olbrzymi plik z planem miasta, ktory chcialem umieścić na mojej stronie. Jedynym sensownym rozwiązaniem było pociecie go na kawałki pasujące szerokością i długością do strony. Miało to jednak tę wadę, że w wielu przypadkach pocięte zostały na rożne kwadraty ważne budynki i ulice. Wielką pomocą okazał się GIMP.
Przygotowanie mapy
W wersji 1.2 dla Linuxa można polożyć na obrazek linjie pomocnicze (engl. "grid") jako raster (kratka) o wybranej wielkości. Ja wybrałem 100 na 100 pikseli. W filtrach w kategorii "web" (w Linuxie) istnieje funkcja "perlotine", która potnie obrazek według ustawionej wcześniej kratki. Otrzymamy przez to plik np.: perlotine.html zawierający tabelke o ramce (engl. "border") = 0 z ulożonymi odpowiednio częściami mapy. Te części mapy znajdują się albo w podkatalogu, albo w tym samym katalogu co plik HTML (możesz sam ustawić w opcjach perlotine przed cięciem). Potrzebujemy tylko tych obrazków! Skopiuj je do jakiegoś katalogu w Tojej stronie intenetowej (najlepiej wlasny katalog dla nich).
Konfiguracja
Ściągnij i otwórz teraz Stadtplan.zip.
Jest w nim katalog "img" ze strzałkami do poruszania się po mapie
oraz skrypt o nazwie "stadtplan.php". Strzałki skopiuj z całym katalogiem
do miejsca w któym znajduje się już katalog z częściami mapy (poprzedni akapit)
albo kopiuj tylko strzałki do jakiegoś innego katalogu (np. do tych części mapy)
- w tym wypadku będziesz musiał zmienić też URL do tych strzałek.
Otwórz skrypt w edytorze i uważaj, żeby nie poprzesówał komentarzy do następnych
linii (wrapping), bo pojawią się błędy.
Piewsze co zmieniasz, o ile chcesz, to jest nazwa samego skryptu (nie koniecznie).
Jeżeli nie chcesz używać mojej nazwy skrypu zmień też zmienną '$name
= "Stadtplan.php";' (tylko zawartość
znaków cytatu = ").
Drugie to katalog, w którym znajdują się przygotowane kawalki mapy (poprzedni
akapit). przykład: $dir = "perlotine2";
Trzecie zadanie to zmiana prefiksu. Jest to prefiks, który wybrałeś dla kawałków
mapy w ustawieniach "perlotine" z minusem na końcu (wszystko do pierwszej
liczby). Jeżeli nie chciałeś prefiksu, to wszystkie pliki będą zaczynać się
od minusa, wiec nie mieniaj nic ('$prefix = "-";'). przykład dla prefiksu
"mapa" bedzie $prefix = "mapa-";
Czwarte to szerokość (ile kawałków ma być obok siebie: szerokość pomnożona przez
szerokość kawałka da Ci szerokość naszej mapki) a piąte to wysokość (podobnie
jak w czwartym). przykład dla kawałka o 100 pikselach: $width =
4; $height = 4; da nam mapke o wielkości 400x400 pikseli.
W '$imagesX = 23;' należy podac ilosc kawałków, które
utworzył perlotine dla X czyli szerokości. Kolejnosc kawałka od lewej do prawej
to druga liczba w nazwie kawałka (np.: w kawlek-5-12.jpg bedzie to 12). Chodzi
tu o najwyższą liczbę czyli ostatni (prawy) kawalek. Podobnie w '$imagesY
= 13;' - jest to wysokość. Te dane będą potrzene, żeby nie wychodzić
poza obrazek (wyobraź sobie, że ktoś klika cały czas strzałkę na prawo i wychodzi
poza obrazek... jak temu zapobiec? Ten skrypt sprawdza automatycznie, czy nie
wychodzisz poza obrazek - w tym wypadku klikanie na prawo nic nie da, bo skrypt
będzie podawał tylko ostatnie cztery kawałki spawdzając właśnie tę zmienną).
O statnie cztery zmienne to właśne te strzałki, o których mówiłem. Jeżeli nie
przesunąłeś ich do innego katalogu, tylko zostawiłeś w "img", to wszystko
powinno być gotowe. Inaczej mnień w atrybucie 'scr' ich URL. Mozesz zastąpić
je też tekstem! Jak kto woli!
Uruchamianie
Skrypt tem musi być uruchamiany z podanymi zmiennymi X, Y, modeX, modeY. X podaje kolejność od lewej do prawej, Y od góry do dołu. 'modeX' to orientowanie podanego w X i Y kawałka: left = z lewej, middle = w centrum, right = z prawej. Podobnie 'modeY': upper = u góry, middle = w środku, bottom = u dołu.
Możesz sterować tą mapą, jeżeli wrzucisz ją do IFRAME'u np:
<iframe src="http://www.heilsberg.org/pl/Stadtplan.php?X=10&Y=4&modeX=left&modeY=upper"
name="MAPA" width="450" marginwidth="0" height="470"
marginheight="0" align="middle" scrolling="auto"
frameborder="0">Plan miasta jest chwilowo niedostepny. Przepraszam.
Kontakt pod adresem ...</iframe>
stworzy to ramkę wewnątrz strony i tylko ona będzie wciąż odnawiana a nie cała
strona. Możesz stworzyć linki, typu:
<button onClick=" window.open('Stadtplan.php?modeX=middle&modeY=middle&X=13&Y=9',
'MAPA', '')">Pokaż</button>
będą one na nowo ładowały ramkę z nową koordynacją. Ciekawą rzeczą jest, że
przez nadanie dla IFRAME atrybutu 'name=MAPA' można
otwierać też z innej IFRAME na tej samej stronie mapkę. Ważne jest dodanie tylko
skryptu
<script language="JavaScript1.3">
var MAPA = opener.MAPA;
</script>
podajesz więc tylko przez JavaScript onClick = "window.open('URL',
'MAPA', inne 'atrybuty')" odpowiedni URL. Jeżeli
znasz niemiecki zobacz, jak ja to rozwiązałem na http://www.heilsberg.org/seiten/Stadtplan.html
Wypróbuj sam!