HTML5 Canvas Coordinate Capture

This project was awarded to lctwebdesign for $175 USD.

Get free quotes for a project like this
Project Budget
$30 - $250 USD
Total Bids
Project Description

Requiring a tool that captures the html5 canvas X/Y coordinates for a given image. The tool should work along the lines of:  [url removed, login to view]


We want the tool to:

1. Select a Master Image to load into the html5 canvas.

2. Load the selected Master Image into the canvas

3. Use the mouse to click on the image canvas where to capture an X/Y coordinate (based on the image loading into 0 X/0Y from step 2).

This will:

· Capture the X / Y coordinates where the mouse has been clicked.

· Pop up a dialog that allows the entry of an ID for that X/Y location (e.g. 5506)

· Allows the ability to specify a Sub Image for the X/Y location (this will by default always be includes/[url removed, login to view])

· Clicking ok on the popup dialog will send the selected Master Image name | X/Y cords | ID | Sub Image name to a JS ajax function.  (we will write the js function that will record those details in our database - you just need to do an alert of those elements from the ajax array)


Attached is a pretty rough mock up of something we think will work.  If you have a better idea or features then please let us know via PM.

Awarded to:
Skills Required

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online