how to visualise/debug an imagemap?

html imagemap
fearofawhackplanet picture fearofawhackplanet · Jan 4, 2010 · Viewed 7.6k times · Source

I'm dynamically generating an imagemap for a chart tool I have.

I was hoping to be able to set a border or color on the area tags so I could check everything was being generated with the right coords, but a little research shows this is not possible.

So whats the easiest way to check my image map is correct? Are there any browser tools which will "visualise" the areas?

Answer

alex picture alex · Jan 4, 2010

What about using JavaScript (and jQuery) to test it?

http://davidlynch.org/js/maphilight/docs/demo_usa.html

This plugin will highlight image map areas.

Related questions

Responsive image map

I have an existing image map in a responsive html layout. Images scale according to browser size, but the image coordinates are obviously fixed pixel sizes. What options do I have to resize the image map coordinates?

Read More
What is a good alternative to using an image map generator?

I have a large image and I want to make certain sections of the image clickable. I also want to specify the shape of the clickable area (square, circle, custom). Without relying on Javascript, how can I use CSS and …

Read More
Are HTML Image Maps still used?

Do people still use the old HTML Image Maps? The ones with: <map name="test" id="test"> <area shape="poly" alt="" title="" coords=... Or is there a newer, better alternative?

Read More