image coordinates to geographic coordinates

[Sam Lawrance]

On Thu, 2004-10-21 at 16:29 +0200, Jan Hartmann wrote:
> temiz wrote:
> >
> > Despite all my  efforts, I can not correctly convert image coordinates
> > to geographic coordinates (UTM).
> >  what might  the javascript code be ?
> >
> > here is my code:
> >    x_pct = (evt.clientX / width);
> >     y_pct = 1 - (evt.clientY / height);
> >     x_map = ext0 + ( (ext2 - ext0) * x_pct);
> >     y_map = ext1+ ( (ext3 - ext1) *  y_pct);
> >
>
> This should work, provided that width and height are the current values
> of the image's MAPSIZE and ext-ext3 the current values of MAPEXT. A
> problem could be that you use global coordinates for the click: clientX
> and clientY are measured from the upper left corner of the browser
> window. If your image is somewhere else on the page, you need to
> subtract the coordinates of its upper left corner from the global click
> coordinates. For simple web pages (without nested HTML-elements) you can
> do this simply by:
>
> <img id=mapImgId>
> <script>
> var mapImg = document.getElementById("mapImgId")
> var imgX = evt.clientX - mapImg.offsetLeft
> var imgY = evt.clientY - mapImg.offsetTop
> x_pct = imgX / width   // imgX / mapImg.offsetWidth would work too
> ...
> </script>
>

Remember that offsetLeft and offsetTop are relative to the parent node
of an element. So if your map is nested in other elements, you need to
walk up the tree and add the offsets.

See http://www.faqts.com/knowledge_base/view.phtml/aid/29359 for
functions to do this for you.

Do offsets = getOffsets(event), then use offsets.offsetX and Y in place
of evt.clientX and Y in your code above.