1

I noticed that when you move a canvas around or when you resize it, everything inside gets erased. I remember having a similar problem in windows forms applications in C#. Anyway, what's the best way to keep the graphics on canvas, even after it moves etc.? (using javascript)

I've been working on a paint using canvas and websockets, you can see my problem here: http://students.info.uaic.ro/~tudor.berechet/ (just go to Coboards, select the Brush tool, click a bunch of times on canvas and then resize the window or enlarge the canvas)

One more thing I noticed, running the site off my HDD, this problem doesn't occur. which makes me wonder if there's some strange error somewhere.

I definitely need a persistent canvas, because I'm gonna have to implement the hand tool to move it around...

What say you?

Spectraljump
  • 4,189
  • 10
  • 40
  • 55
  • nice idea :) Chrome works fine and firefox throws error `WebSocket is not defined [Break On This Error] this._connection = new WebSocket("w....203.207.144:8005"); //alert("asdf"); @line:95` – Tom Tu Feb 01 '11 at 21:34
  • Thank you. Firefox does not support websockets yet, not even firefox 4.x. I'm gonna have to detect browsers and whatnot. But you did encounter the problem I'm talking about, did you? – Spectraljump Feb 01 '11 at 21:42
  • I am using Chrome 10.0,648.11. I can't paint at all on the coborads... – Omiod Feb 01 '11 at 22:53
  • @UVL, did you click on the Brush first? – Spectraljump Feb 02 '11 at 09:01

1 Answers1

0

The problem seems to have gone after cleaning up my code a bit. I still don't know what was causing it, but it seems that the canvas drawings now remain intact even after I move/resize the canvas.

Please confirm. [EDIT] confirmed.

The point is, my original assumption that canvas graphics are not persistent seems to have been wrong. There was most likely some coding error that was "erasing" my canvas.

Spectraljump
  • 4,189
  • 10
  • 40
  • 55
  • Could you please provide more details on how do you resize canvas? I'm facing the same problem right now, and my code is nothing special (`canvas.width = newvalue; canvas.height = newvalue;`). The new values are supposed to be larger than old ones, so the canvas is extended. Unfortunately it is cleared to white rectangle after the resize. It's tested with Chrome and Safari. – Stan Feb 13 '12 at 13:00
  • This answer is incorrect. The question has several duplicates, for example: http://stackoverflow.com/questions/5517783/preventing-canvas-clear-when-resizing-window and http://stackoverflow.com/questions/3543358/resizing-a-html-canvas-blanks-its-contents. According to these answers, canvas is cleared during resizing, and its content can be only preserved by saving and restoring drawings with additional coding. – Stan Feb 13 '12 at 18:19