Polygon imagemap coords ophalen

[Anoniem: 352206]

Voor een hobby / studieproject ben ik bezig interactieve kaarten te maken. Het is met deze kaarten de bedoeling dat de bezoeker op een website met de muis over de kaart en gemeentes kan bewegen en deze hier dan direct feedback van krijgt. Zo heb je duizenden kaarten en dus duizenden verschillende soorten feedback.

Ik had hiervoor voor Flash kunnen kiezen, maar dat is niet mijn sterkste kant en bovendien wil ik functies gebruiken die in Flash iets lastiger (voor mij althans) te integreren zijn. Ik heb dus de keuze gemaakt dit te doen met XHTML / CSS / JS / PHP / MySQL.

Wat er precies gebeurd is als volgt:

• De gebruiker selecteert een onderwerp.
• PHP leest uit de MySQL database alle gegevens van alle gemeentes van de kaart uit.
• De gebruiker kan met de muis over de kaart bewegen.
• JS / CSS zorgt dat de gemeente opkleurt (door een imagemap te verkleuren van doorzichtig naar een klaar) en dat er een tekstballon met info naast verschijnt.

Na lange tijd heb ik bovenstaande voor elkaar gekregen. Fijn dus! Nu komt het nadeel waar ik zelf geen goede oplossing voor kan vinden. Er zijn wereldwijd heel wat gemeentes en de kaart is vrij klein (schermvullend). Alhoewel bovenstaande werkt, moet ik nu dus duizenden gemeentes tot op de pixel nauwkeurig na gaan tekenen. Dat is weken (geestdodend) werk. Nu vroeg ik mij af of voor deze selectie, voor mij spreekwoordelijk de punten op de i, een tool bestaat die dat wat gemakkelijker maakt. Zo zou een soort van Magic Wand geweldig zijn. Je klikt in de kaart en krijgt op een of andere manier de coords terug.

Ik heb een aantal tools geprobeerd, maar er geen gevonden die ook daadwerkelijk werkt. Heeft er iemand suggesties?

[CodeCaster]

Een soort Google Maps met custom layers bedoel je?

[Anoniem: 352206]

Niet helemaal, want Google maps toont niet overal de juiste verhoudingen. Daarnaast zijn de kaarten die ik gebruik net wat anders omdat men ook per jaar informatie kan opvragen. Sommige landsgrenzen lagen toen net wat anders. Vandaar dat ik voor eigen kaarten heb gekozen en dit polymap systeem heb gekozen. Misschien niet de meest voor de hand liggen optie, maar bij gebrek aan Flash kennis wel zo'n beetje mijn enige oplossing.

[Bosmonster]

Een dergelijke tool kun je eenvoudig zelf maken door klikpunten op een kaartje uit te lezen toch?

[Sjaakmeister]

Misschien heb je hier iets aan: http://avenza.com/mapublisher

Het is een tijdje geleden dat ik ermee gewerkt heb, maar het heeft mijn kaart toen perfect opgesneden in polygons, waar ik heel makkelijk van kaart (omgezet naar Illustrator) naar website kon.

Ik zie dat er in de tussentijd een hoop veranderd is, dus misschien is het even zoeken hoe het nu moet.

[Voor 71% gewijzigd door Sjaakmeister op 06-07-2011 13:04]

[Anoniem: 352206]

Een schop ter aanvulling. Er zijn er weinig die naar dit onderwerp zoeken, maar voor diegene die dat wel doen, is het de moeite waard.

Ik ben hier weken mee bezig geweest. Ik moest uiteindelijk tientallen kaarten omzetten naar imagemaps en dat allemaal met de hand doen is nagenoeg onmogelijk.

Ik heb heel veel verschillende programma's geprobeerd, freeware en betaald. Het programma van de tip van Sjaakmeister vond ik te duur ($1300) dus die is niet langs gekomen, maar wel heel veel soortgelijke programma's die van alles beloofden, maar uiteindelijk toch niets deden.

Uiteindelijk ben ik de kaarten van PDF om gaan zetten in SVG, ook hiermee een hoop problemen tegen gekomen, waardoor ik de SVG zelfs nog met de hand moest corrigeren. Daarna moest de SVG data weer omgezet worden naar coords via een eigen geschreven PHP-functie. Dat ging redelijk, maar al die coords moesten stuk voor stuk weer aan de scripts verbonden worden die ik gebruikt had.

Ik heb net echter een veel gemakkelijkere methode gevonden.

1. Open Imageready en laad de PDF in (PNG etc. kan nu dus ook).
2. Gebruik de magic wand en kopieer de lagen die je wilt hebben.
3. Klik op Layer -> New Layer Based Image Map Area
4. Zet de Maparea op polygon (onder het tabje Image Maps)

That's it!