Possible to deep clone HTML5 canvas element with jQuery?

canvas, html, html5-canvas, jquery

Solution

If you don't need to copy any attached event handlers (which, in general, I doubt is possible), I'd just use the currently accepted solution to Display canvas image from one canvas to another canvas using base64

//grab the context from your destination canvas
var destCtx = destinationCanvas.getContext('2d');

//call its drawImage() function passing it the source canvas directly
destCtx.drawImage(sourceCanvas, 0, 0);

Of course, you'd have to create the destination canvas first, so, before that, you'd have to:

var destinationCanvas    = document.createElement('canvas');
destinationCanvas.width  = sourceCanvas.width;
destinationCanvas.height = sourceCanvas.height;

Problem

Original source

Related problems

• Any way to clone HTML5 canvas element with its content?
• Display canvas image from one canvas to another canvas using base64