[JavaScript, Canvas] Create a buffer and work on it

Question

Is it possible to create a buffer of arbitrary size and work on that just like on a canvas element?

I would like to create a graphic (> 10'000 x 10'000 pixel) and use methods like drawImage() on that. After everything is done a part should be copied over to the canvas element. createImageData() can make a buffer but there's no way to use methods like drawImage() on it.

Is there a way to achieve my needs without making an invisible canvas element?

Thank you!

Answer 1

Have a look at document fragments. John Resig DOM DocumentFragments and MDC.

I'm not sure if it is cross-browser...maybe someone can clarify for me?

---

EDIT: don't know what I was thinking

Have you tried:

var canvas = document.createElement("canvas");
canvas....

containerElement.appendChild(canvas.cloneNode());

Answer 2

Why not use a canvas element? It doesn't have to be "invisible" (as in "it's part of the page, but styled to not be visible")...just create a new canvas as described above, and simply don't append it to your document. Now you can do whatever you want with it, without worrying about having that extra hidden canvas on your actual page.