我在 Canvas 元素上实现了放大和缩小功能。 它的工作原理是缩放 Canvas ，平移它，然后重新绘制整个场景。 问题是重新绘制所有内容需要花费大量时间，因为我的 Canvas 上有很多东西。
我需要一种方法来将 Canvas 复制到图像对象，而不是将图像复制回 Canvas 而不会降低质量。将canvas复制到javascript变量，以及稍后将此变量复制回 Canvas 的具体方法是什么？
如果你写下代码我会很高兴，因为我在互联网上找不到任何好的解释。
谢谢，
最佳答案
drawImage() 方法可以使用另一个 Canvas 而不是图像绘制到 Canvas 。
您可以创建一个与原始 Canvas 大小相同的“备份” Canvas ，将第一个 Canvas 绘制到那里，然后在需要时将其画回原始 Canvas 。
例如
// Assume we have a main canvas
// canvas = <main canvas>
ctx = canvas.getContext('2d');
..
// create backing canvas
var backCanvas = document.createElement('canvas');
backCanvas.width = canvas.width;
backCanvas.height = canvas.height;
var backCtx = backCanvas.getContext('2d');
// save main canvas contents
backCtx.drawImage(canvas, 0,0);
..
// restore main canvas
ctx.drawImage(backCanvas, 0,0);
关于image - html5 : copy a canvas to image and back，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7242006/