From: David Mark on
Mark Read wrote:
> In article <memo.20100419130227.1036A(a)steve.cix.co.uk>,
> j80k-vpfc(a)dea.spamcon.org (Mark Read) wrote:
>
>> *Subject:* Refresh image map.
>> *From:* j80k-vpfc(a)dea.spamcon.org (Mark Read)
>> *Date:* Mon, 19 Apr 2010 13:02 +0100 (BST)
>>
>> Hi,
>>
>> I have an image that displays in graphical format, content from a
>> database that is
>> constantly changing. I would like to be able to display certain
>> information using
>> tool-tips by using an image map.
>>
>> The image refreshes using js every 10 seconds, meaning that the
>> image map is soon
>> out of date.
>>
>> The image and map are built using php, and the map (a flat file) is
>> inserted using
>> a php 'include'.
>>
>> I'm sure there must be a way of updating the map without reloading
>> the page, but
>> despite extensive googling, I've yet to come up with anything that
>> works.
>>
>> Would someone give me a nudge in the right direction please? I
>> daresay I haven't
>> explained things too well, so feel free to ask me what I'm babbling
>> on about. ;-)
>>
>> - Steve
>>
> and finally....
>
> This appears to be a Firefox issue. Using Firebug, I can see that the
> image map *IS* getting loaded.
>
> Everything with respect to loading image and map is working fine, but I
> cannot fathom how to tell FF to use the new map!!
>
> It loads the image map OK first time, and then uses that one,
> disregarding all attempts to tell it otherwise.
>
> FWIW, Opera, Safari, and IE6+ seem to work fine.
>
> Maybe a browser bug???
>
>

Could be almost anything. You haven't said _how_ you are trying to tell
FF to use the new map. Are you shouting at the monitor?
From: nick on
On Apr 22, 4:56 pm, j80k-v...(a)dea.spamcon.org (Mark Read) wrote:

> Everything with respect to loading image and map is working fine, but I
> cannot fathom how to tell FF to use the new map!!
>
> It loads the image map OK first time, and then uses that one,
> disregarding all attempts to tell it otherwise.

Found out on the web:

| This issue was fixed by generating a random name for the
| image map each time the images are toggled and then using
| the DOM to change the "useMap" attribute to match the
| random name.

Posting the URL will probably break something but that's really all
that was useful there.

Also found this interesting technique:

http://www.frankmanno.com/ideas/css-imagemap-redux/

-- Nick
From: Mark Read on
In article <hqqnsr$qfu$2(a)news.eternal-september.org>,
dmark.cinsoft(a)gmail.com (David Mark) wrote:


> >>
> > and finally....
> >
> > This appears to be a Firefox issue. Using Firebug, I can see that
> > the
> > image map *IS* getting loaded.
> >
> > Everything with respect to loading image and map is working fine,
> > but I cannot fathom how to tell FF to use the new map!!
> >
> > It loads the image map OK first time, and then uses that one,
> > disregarding all attempts to tell it otherwise.
> >
> > FWIW, Opera, Safari, and IE6+ seem to work fine.
> >
> > Maybe a browser bug???
> >
> >
>
> Could be almost anything. You haven't said _how_ you are trying to
> tell
> FF to use the new map. Are you shouting at the monitor?
>

ROFL writing the name on a piece of paper and sticking it through the
slots in the front of my tower case ought to do it. ;-)

Seriously though, this is the code straight from the php source file, so
that you can see how the files are called. 'gdallspots.php' outputs only
the PNG image with all the lines on it. 'call.php' builds the imagemap.

The image loads fine, the imagemap loads fine, and in any other browser
than firefox the two play happily together.

The real thing is at http://www.g0lfp.com/maps and as you can probably
tell, I'm more at home with php. This is just one of those things you
/can't/ do server side ;-)

regards,

Steve

here is the bit that 'does the biz'



<script language="Javascript">
<!-- hide
var x = 30;
var y = 1;

function start()
{
startClock();
timerID2 = setTimeout("loadXMLDoc()", 2000);
}

function startClock()
{
x = x-y;
document.form1.clock.value = x;
if (x < 0) reload();
timerID1 = setTimeout("startClock()", 1000);
}

function reload()
{
now = new Date();
var mapImg = "gdallspots.php<?PHP echo "?band=$band\" + \"&q=\" +
now.getTime()"; ?>;
document.map.src = mapImg;
x = 30;
document.form1.clock.value = x;
loadXMLDoc();
}



function loadXMLDoc()
{
now = new Date();
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
� xmlhttp=new XMLHttpRequest();
� }
else
� {// code for IE6, IE5
� xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
� }
xmlhttp.onreadystatechange=function()
� {
� if (xmlhttp.readyState==4 && xmlhttp.status==200)
��� {
��� //document.getElementById("myDiv").innerHTML=" ";
��� document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
��� }
� }
//$imagefile="imgmap".$band.".txt";

mapfile = "call.php<?PHP echo "?band=$band\" + \"&q=\" + now.getTime()";
?>;
xmlhttp.open("GET",mapfile,true);
xmlhttp.send("");
}

function writeText(txt)
{
document.getElementById("desc").innerHTML=txt;
}
// end hide -->
</script>


- Steve