I have a page where I use Raphael.js to allow the user to move a point around a canvas with a background image. What I'm trying to do is capture the final image of the canvas, where I can see where the user placed the point after the user clicks the "confirm position" button. I thought of two methods, however I am not sure how to execute them.
Method 1: just grab the canvas as an image. Somehow this is not possible with Javascript, and I'm not too sure that Raphael has a built-in function to allow this. I also read about exporting the svg xml file and passed it through a batik-type library, however, I'm not quite sure how to do this. The tutorials that I read are really confusing.
Method 2: use the coordinates of the point and overlay the point image that I already have on the background image, and save it as an image.
Please advise, and I hope I was clean.
source
share