如何保存画布以便以后再次显示（回滚效果）

Question

我有一点问题：

我想创建某种时间回滚效果。 我有一个画布，我的游戏有不同的轮次。现在我想在另一个变量中每一轮保存画布，当玩家死亡时我想显示上一轮的画布。

我希望你理解我的意思。

谢谢！

Answer 1

Canvas元素在其整个生命周期中只有1个唯一的上下文。因此，在任何时候保存画布都无济于事，因为在该点之后的每个新绘图也会改变您保存的上下文。

您可以使用以下方法将画布保存为图像：

var image=new Image();
image.src=context.toDataURL();

然后您可以稍后将该图像重新绘制到画布上：

context.drawImage(image,0,0);

或者，您可以保存用于创建画布的所有绘图命令，并重新发出这些命令以将画布“返回”到任何时间点。