View Full Version : Load image map with Ajax?

01-27-2009, 08:17 PM
Hello all and thanks for reading.

I am trying to make a simple page that works as follows: It displays an image, and there is an image map associated with it. There is a selector that allows the user to change the image being shown without reloading the page via javascript. That is all well and good and works, but I can't figure out how to reload the image map from the server. Each image has an associated image map file on the server, which I can include in the original html with a server side include, but I want to be able to change that image map as well as the image without reloading the page based on a user selection. Can I do this with javascript or ajax? The relevant code is as follows:

// This part works great
function setimg(imgname,newimgfile) {
document.images[imgname].src = newimgfile;

<div id="my_chart">
<img name='chart_img' src='/?my_img' height='600px' class='chart' usemap='#map1' alt='travel time chart..'/>
<div id='imgmap_container' style='display:none'>
<map name='map1' id='imgmap'>
<area shape="rect" coords="519,249,526,256" alt='some data here'>

01-27-2009, 08:23 PM
hmm, maybe the best to do this would be to load all the image maps at once, ( with different names ofcourse ), then tell the image what map to use when loading.

01-27-2009, 08:36 PM

Thanks for the suggestion. Unfortunately there will be a large number of both images and image maps so including all the image maps would not be a good solution - and new images/maps are periodically generated by the server anyway. Is there really no way to just update the image map content with an ajax request?

01-27-2009, 08:46 PM
I've never tried it, but I assume* that you could simply load the image map into a <div> at the same time as the image is loaded. the image should then read from that map.

hope this helps.

01-27-2009, 11:23 PM
That did the trick! It's so simple I feel dumb for not thinking of it. If you just load the image and the area map at the same time into a div it works.