Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML] Mapka województwa podzielona na powiaty
Forum PHP.pl > Forum > Przedszkole
Mackos
Witajcie, mam dosyć ciekawy problem.
Mam mapkę województwa z podziałem na powiaty, i teraz z każdego powiatu chciałbym zrobić osobny link.
Identycznie tak jak to się ma na stronie http://kantory.pl/kantory/ z mapą Polski.
W jaki sposób zrobić to możliwie najłatwiej, bo ręcznie wszystkich 'krzywizn' mi sie nie chce określać.
modern-web
1. Albo wyznaczasz `krzywizny`
2. Albo otwierasz Adobe Flash Professional i robisz to w technologii flash
3. JS -> zapewne jest na to jakiś sposób lecz nie mam zielonego pojęcia

Pozdrawiam!
everth
Ech, rozwiązanie.
modern-web
O! Dzięki; Mi także się przyda wink.gif
qrzysztof
Ale ta mapka Polski nie wygląda mi na uniwersalne i elastyczne rozwiązanie (choć mogę się mylić bo w kod nie zaglądałem, ale wątpię). Tam właśnie trzeba te wszystkie spany ręcznie poustawiać. Chyba mniej roboty i zgodniej ze standardami użyć <map> oraz <area>. Są wtedy ograniczenia (kształt pola może być prostokątny bądź okrągły) ale coś za coś. Ja to widzę tak: jakieś kółeczko na środku powiatu - kursor w kółeczku: cały powiat się świeci. Dosyć intuicyjne.

Zależy co to ma być. Jeśli jednorazowa historia to można skorzystać z rozwiązania podanego przez everth. Jeśli mapek ma być sporo to może lepiej pójść na pewien kompromis.
Winston_Wolf
Cytat(qrzysztof @ 4.03.2011, 13:07:56 ) *
Ja to widzę tak: jakieś kółeczko na środku powiatu - kursor w kółeczku: cały powiat się świeci. Dosyć intuicyjne.


z samym <map /> nie zrobisz podświetlenia ..i tak musisz ręcznie ustawić podświetlony element na obrazku ..


..co do uniwersalości mapy Polski to jest tylko przykład, jak można to zrobić ..bez żmudnej edycji css.a się nie obejdzie ...choć gdyby ktoś potrzebował to mogę się zająć taką mapką powiatu ..czy jakiegokolwiek regionu świata ... kontakt via PW albo http://winstonwolf.pl/contact.html
qrzysztof
Mnie by interesowało coś jeszcze o półkę wyżej.

Czyli automatyzacja tworzenia takich mapek. Mam mapkę, zaznaczam obszar poprzez kliknięcie punktów. Kliknięcie w sąsiedztwie pierwszego punktu zamyka zaznaczenie. Współrzędne są odczytywane javascriptem, wysyłane ajaxem na serwer i zapisywane w bazie. Potem taka mapka jest gotowa do umieszczenia na stronie.

To na pewno da się zrobić. Problemem może być tylko rysowanie kresek pomiędzy poszczególnymi punktami. Tutaj trzeba by zapewne wykorzystać element canvas z HTML 5. Nie wiem czy w starszej technologii da się to jakoś inaczej rozwiązać. Ale nie zdziwiłbym się.

modern-web
Może znacznik <area> ? Głowy nie daję ale wiem, że coś takiego istnieje ^
sadistic_son
Ściągnij darmowy EdHTML , tam jest opcja graficznego tworzenia takich odnośników.
everth
@Winston_Wolf - nie patrzyłem w kod bo wydawało mi się że używasz jQuery MapHilight. Teraz przejrzałem i faktycznie - twoje rozwiązanie jest co najmniej dziwne, zwłaszcza że powyższa wtyczka bazuje na canvas/VML co wydaje się bardziej "poprawne".

@qrzysztof - nie wiem czy taki automat istnieje. Na tej stronie autor opisuje jak używać MapHilight oraz załącza przykładowy skrypt generujący automatycznie mapę z pliku SVG. Niestety plik SVG ma odpowiednią strukturę - poszczególne granice są wydzielone w odpowiednich ścieżkach. Jak znajdziesz taki dotyczący interesujących cię krajów to jesteś w domu. Inaczej ręcznie musisz sobie taki przygotować.
Winston_Wolf
Cytat(everth @ 4.03.2011, 20:09:11 ) *
.. bazuje na canvas/VML co wydaje się bardziej "poprawne".


zależy co masz na myśli pisząc 'poprawne' ;P ..IMHO poprawne jest całkowite oddzielenie prezentacji od treści ..po wywaleniu JS i stylów zawsze zostaje najzwyklejsza lista z odnośnikami ..

..swoją drogą moja mapka powstała po głupim pytaniu na Blip.ie: czy da się zrobić mapkę w samym CSS ..i poprawnym xHTML 1.1 ..i jak widać da się ;P

..wracając do tematu, śmiało można użyć plików SVG i prostego skryptu odpowiedzialnego za 'klikalność' odpowiednich 'kształtów' ...wszystko znajdziesz na ALA: Cross Platform Scalable Vector Graphics with svgweb
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.