SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Aug 2003
    Location
    eldersburg, md
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question I want to get ISMAP coordinates

    I'm trying to build a simple image-map-creation tool for a web-based app I'm making. (User selects an image, then clicks on it to set image map areas; initially could be just RECTANGLE, later want CIRCLE and POLYGON.)
    The quickest "solution" was to display the image with anchor tags, with the ISMAP option on. This causes the x/y coordinates to be displayed in the status bar, at the end of the URL. Sweet, but I'd like to be able to tell when the user clicks, and then grab those values. Then I can build a text string holding their selected area, etc. (It'd be great if I could show the selected area with a box or something, too, but that may require doing it in PHP, building images, etc.) Anyway, does anyone know how I can get the X/Y coordinates when the user clicks? Since it's in a form, can I do something with input types to get the values?

  2. #2
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does this example help?
    Code:
    <html>
    <head>
    <script language="JavaScript">
    function showcoords() {
    	var cX = event.offsetX;
    	var cY = event.offsetY;
    	
    	alert(cX + "," + cY);
    }
    </script>
    </head>
    <body>
    <div style="height:200px;width:200px;background-color:#999999;" onclick="showcoords();"></div>
    </body>
    </html>

  3. #3
    SitePoint Member
    Join Date
    Aug 2003
    Location
    eldersburg, md
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up

    It turns out if you do <input type="image" ...>, when you click on the image the X,Y are put into post vars (e.g., in PHP, $_POST['x'] and $_POST['y']... not sure what that equates to in Javascript, but it works great....


Bookmarks

Posting Permissions

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