Alex Rivera | Logout

How to save HTML5 canvas?

Asked 2010-03-30T09:58:01.137
13

Currently I am using Canvas2Image to save the content of my HTML5 canvas. It doesn't appear to work in Google Chrome, however. Any ideas on how to work around the issue are welcome. :)

Edit
Report

1 Answer

5

use this code

<html>
<head>
<script src="base64.js" type="text/javascript"></script>
<script src="canvas2image.js" type="text/javascript"></script>
</head>
<body>
<input type="button" id="savecanvas" value="Save Image" onclick="savecanvasfile()"/>
</body>
</html>



<script>
function savecanvasfile(){
    var canvas = document.getElementById('canvas_name');
    Canvas2Image.saveAsPNG(canvas);
}
</script>

download these canvas2image.js and base64.js and save it in local folder for the working of this code.

These will be available in the site https://web.archive.org/web/20140904002425/http://www.nihilogic.dk/labs/canvas2image/

answered 2013-01-09T06:07:43.690

Your Answer