landkaart met klikbare provincies

  • Onderwerp starter Onderwerp starter baws
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.
B

baws

Terugkerende gebruiker
Lid geworden
9 apr 2010
Berichten
1.258
Hallo,

op mijn site wil ik het graag mogelijk maken voor bezoekers dat ze op de provincies van nederlands kunnen klikken en dan worden verwezen naar de pagina van de provincie.
hoe kan ik dit het best realiseren,ik ken de html map functie maar die wil ik niet gebruiken.
is het mogelijk met php of is er een soort afbeelding (behalve flash wat niet iedereen ondersteund) dat ik kan gebruiken.

de site moet voor alle browsers beschikbaar zijn

mvg
 
Php is een back-end script taal. waarmee je HTML/Javascript naar een browser stuurt.
Php heeft nix te maken met de front-end.
 
Je kan met sommige programma's clickable maps maken. Ik denk dat dit de makkelijkste manier is.
 
ik denk dat als je geen map wil dat je echt richting java gaat oid.

Waarom wil je geen map gebruiken? er zijn op internet genoeg html map generators te vinden. daarmee kan je makkelijk je links in je afbeelding plaatsen.
 
Hoi baws,
Je zou het met transparante link-oppervlakken + css kunnen doen, maar het probleem is dan dat die oppervlakken alleen rechthoekjes kunnen zijn, en de provincies grillige vormen hebben, die ook nog in elkaar gepuzzelstukt zijn.

nl-kaart-css-vakjes.png

Dat betekent dat je alleen maar stukjes in het midden van elke provincie aanklikbaar kunt maken (anders gaan ze overlappen). Dan komen er onklikbare gaten op de kaart, en dat is niet erg gebruikersvriendelijk (of dat snappen sommige mensen misschien niet). Om dat wat te verzachten, kan je er met javascript hovers op maken (met css zal dat niet gaan).
Het werkt ook alleen prettig als het kaartje flink groot is, en/of je moet een aantal rechthoekjes per provincie maken.
Of je moet er de provincienamen in zetten, en alleen die (met een stukje er omheen) klikbaar maken, dat kan wel.

=======
Ik zou toch voor image-maps gaan, die kunnen precies de provincie-grenzen volgen en exact per provincie klikbaar zijn.
De kaart kan dan ook zo klein zijn als je wilt:

nl-kaart-hotspots.gif

Met wat javascript kan je er ook een hover-variant op maken, zodat men meteen feedback krijgt bij het hoveren over een provincie.



Met vriendelijke groet,
CSShunter
 
Laatst bewerkt:
Ja, die ziet er aardig uit.
Ik gebruik zelf hiervoor een oude FrontPage-editor (is ie toch nog ergens goed voor! ;) ).


  • Tip: PC op lage resolutie zetten, dan wordt de afstand tussen de pixels groter, en is het een stuk makkelijker om de hotspot-punten nauwkeurig op het image te mikken.

Met vriendelijke groet,
CSShunter
 
Als het kaartje niet al te groot hoeft te zijn, zou ik werken met een bitmap presentatie en de provincie bepalen aan de hand van de kleurcode van de provincie.
Wanneer de muis zich bijvoorbeeld op (x:258, y:200) boven het plaatje bevindt (wat dan bijvoorbeeld boven Gelderland is met een rode kleur op het plaatje) en de pixel 258,200 heeft in de mappende tabel de kleurcode (255,0,0), dan weet je dat Gelderland geselecteerd moet zijn.

Je hoeft dan in principe alleen een plaatje om te zetten naar een x,y array.
 
ik zie het verband niet zo tussen kleur en positie, een van beide lijkt me wel genoeg toch?
 
Hoi Baws, ik had toevallig precies hetzelfde probleem en heb dit nu permanent opgelost.
We hebben www.klikbarekaart.nl ontwikkeld en ik denk dat je dit wel handig zult vinden!

Groeten,
Luuk
 
:rolleyes:Nou, dan zal Zuid Holland zijn eilanden, voorne/putten en goeree/overflakkee ook zo wel heroveren :D:rolleyes:

Ron
 
Even kijken: momenteel is Voorne/Putten al wel in ZH gelegerd.
zh-minus-go.png

Maar Goeree/Overflakkee wacht nog op herovering. De Zuid-Hollandse strijdmacht zeker te druk met het beleg van de 2e Maasvlakte. :D

vp-go.png

bron: Wikipedia.nl​

=======
PS: Zonder Afsluitdijk ziet NL er wel een beetje kaal uit, en is er nog een Zuiderzee ipv IJsselmeer.
adijk.png
Moeten de toeristen op Marken voorzichtig zijn met eb en vloed. ;)

Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan