Save and share HTML5 canvas as an image

This project was awarded to parth1403 for $100 AUD.

Get free quotes for a project like this
Project Budget
Total Bids
Project Description

I have a small HTML5 page with drag and drop function I would like to enhance the user experience for the end result.

Work in progress here: [url removed, login to view]

Using the KineticJS doc, the drag and drop and canvas to dataURI has been done.

Reference: KineticJS

Work to date references the Animals at the Beach example ([url removed, login to view] )

mixed with the drag and drop save image feature ([url removed, login to view]).

A more complex example of what I would like to achieve is at Facetache ([url removed, login to view]). I do not need the ability to choose the background photo or to resize the images that have been dropped to the canvas though.

This has been built using the KineticJS library, then, to get the end result on the new page, the code posts the dataURL to server side, converts it to binary and returns it back (or posts it to Facebook) >> this is the function I require.

Another more basic sample of the click action creating the static image is here - it uses the canvas2image javascript: [url removed, login to view] (the posting to facebook or pinterest would need to be added to this example though)

This job will be live only today. I need the deliverable within 8-10 hours from job posting.

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