问题
I just get confused about canvas clear stuff -- the sketch has been cleared from canvas, but when I click the canvas to draw something new, the cleared sketch just come back at the same position again. It looks like the sketch has been saved to some "cookies", which has been reloaded when the next time clicking the canvas or mouse over the canvas.
clear.click(function()){
var canvas = document,getElementById('mycanvas');
var context = canvas.getContext('2d');
context.clearRect(0,0,width,height);
});
I use sketch.js for drawing: http://intridea.github.com/sketch.js/ Actually, the code in sketch.js did clean canvas too: canvas.width = canvas.width. Any idea about how to clear it thoroughly? thanks!
回答1:
Please try the second solution of following question. It says to reset the transformation matrix before clearing the canvas.
// Use the identity matrix while clearing the canvas
ctx.setTransform(1, 0, 0, 1, 0, 0);
ctx.clearRect(0, 0, canvas.width, canvas.height);
How to clear the canvas for redrawing
See following tutorial about resetting transformation matrix.
HTML5 Canvas Reset Transform Tutorial
回答2:
It's the other part of code gives the problem,and I've already fixed it. It looks like the former sketch has been saved in an array, and each time I add the current sketch to the array, and draw everything there. Thanks! And sorry for the bothering.
来源：https://stackoverflow.com/questions/13352932/cleared-sketch-still-on-canvas-in-html5