Programatically creating imagemap via JS

[walshieau]

i have the following script to create an image, map and its areas

now adding the image to the div works fine, but when i try and append the map onto the image it returns a Unexpected call to method or property access JavaScript error.

[CODE=javascript]personMap = document.create Element('map');
personMap.setAt tribute('name', 'newmap');
personMap.setAt tribute('id', 'newmap');
var hotspots = Default.GetHotS potDetails(MapN o); (AJAX call)
for(var j=0; j < hotspots.value. length; j++)
{
var hs = hotspots.value[j].toString().spl it(':');
area = document.create Element('area') ;
area.setAttribu te('id', j);
area.setAttribu te('shape', 'rect');
var coords = hs[1]+','+ hs[2]+','+ hs[2]+','+ hs[1];
area.setAttribu te('coords', coords);
area.setAttribu te('href', "javascript:Sho wUserPopup('+hs[3]+'|'+hs[1]+'|'+hs[2]+')");
area.setAttribu te('title', hs[0]);
area.setAttribu te('alt', hs[0]);
personMap.appen dChild(area);
}
image = document.create Element('img');
image.setAttrib ute('src', 'PrinterMap.ash x?PhotoID=' + MapNo);
image.setAttrib ute('ismap', 'ismap');
image.setAttrib ute('useMap', '#newmap');
image.setAttrib ute('id', 'PersonImageMap ');
image.appendChi ld(personMap); //error here
document.getEle mentById('imgDi v').appendChild (image);[/CODE]

[acoder]

The map is separate from the image - it's not a child of the image. Just append it to the div instead.

[walshieau]

The map is separate from the image - it's not a child of the image. Just append it to the div instead.

cheers mate that worked. Im reading up on the use of anchors and image maps, i know the anchor object has shape and coords property, can one use an anchor instead of an area?

[acoder]

cheers mate that worked. Im reading up on the use of anchors and image maps, i know the anchor object has shape and coords property, can one use an anchor instead of an area?

I'm not sure. You can use an area as an anchor by setting the href property - see this link.