2

I'm trying to edit union draw

I want to store the state of the canvas, so if a new visitor comes in, he will see the state of the last drawn stuff. currently the canvas clears everything for the new visitor.

what do I have to do with union draw to store the state of the canvas?

Is it possible with something like this? If yes, how?

var states = [];
function saveState(ctx){
  var c = document.createElement('canvas');
  c.width  = ctx.canvas.width;
  c.height = ctx.canvas.height;
  c.getContext('2d').drawImage(ctx.canvas,0,0);
  states.push(c);
  return c;
}

function restoreState(ctx,idx){
  var off = idx==null ? states.pop() : states[idx];
  ctx.drawImage(off,0,0);
}
  • 1
    http://stackoverflow.com/questions/7242006/html5-copy-a-canvas-to-image-and-back – Michał Miszczyszyn Apr 19 '12 at 16:32
  • Any mileage in storing pen moves and recreating when new visitor enters? – jing3142 Apr 19 '12 at 17:18
  • @Miszy no I don't mean saving the canvas as an image to harddrive – user1322343 Apr 19 '12 at 21:06
  • @jing3142 recreating the pen moves would be interesting too, but what I mean is the new visitor should see what has been drawn already on the canvas. – user1322343 Apr 19 '12 at 21:07
  • Have you looked at [fabric.js](http://fabricjs.com)? It provides an API on top of the canvas and it allows you to import and export JSON or SVG. I'm not familiar with union draw so I don't know if it is compatible. – cordsen Apr 20 '12 at 04:52

0 Answers0