清除html5的问题

Question

我有这个代码

function clear(){
    context2D.clearRect(0, 0, canvas.width, canvas.height);
}


function desenhaBonecoDir(){

    clear();
    context2D.setTransform(1, 0.30, 1, -0.30, 10, 380);//problem here
    context2D.drawImage(bonecoRight, x, y);
    x += -10 * xDirection;
}

如果我删除我评论“问题在这里”的行，脚本运行良好，但如果我用set变换改变透视我不知道为什么，图像被复制但未删除，结果是重复我按下按键时的图像

任何帮助？

感谢

Answer 1

问题是由于更改透视图而导致的，但是当您清除它时不会将其更改回来，因此它会清除“透视图”而不是整个画布，请尝试以下操作。它的作用是保存当前的视角，然后将其更改为您需要的任何内容，绘制等，然后恢复恢复之前的视角，以便恢复正常的连接。

context2D.save();
context2D.setTransform(1, 0.30, 1, -0.30, 10, 380);
context2D.drawImage(bonecoRight, x, y);
context2D.restore();

稍微修改一下代码以显示它的工作原理。 http://jsfiddle.net/89yjG/1/

注释保存和恢复，你会注意到这些文物。