Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Jan 2009
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Load image map with Ajax?

    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:

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

    <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'>
    ...
    </map>
    </div>
    </div>

  • #2
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts
    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.

  • Users who have thanked angst for this post:

    landryraccoon (01-27-2009)

  • #3
    New to the CF scene
    Join Date
    Jan 2009
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts
    angst:

    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?

  • #4
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts
    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.

  • Users who have thanked angst for this post:

    landryraccoon (01-27-2009)

  • #5
    New to the CF scene
    Join Date
    Jan 2009
    Posts
    5
    Thanks
    2
    Thanked 0 Times in 0 Posts
    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.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •