html复制画布

Question

我实现了放大和缩小功能，但每次缩放时，我都会清除整个画布，缩放并平移它，然后重新绘制所有内容。 问题是重绘需要很长时间（我的画布上有很多对象）。

有没有一种方法可以复制整个场景，缩放和平移画布，然后粘贴 不影响质量吗？

谢谢

Answer 1

是的。您可以使用 drawImage 将画布复制到临时图像，然后再重新绘制。我正在做的这件事有一个调整大小的功能。看看：

http://mtcanvas.com/mem/pencilman/

仅供参考，这是主要部分：

    function resizeCanvas(){

      cWidth = widthInput.val();
      cHeight = heightInput.val();

      jtmp.width = cWidth;
      jtmp.height = cHeight;
      clear(ctmp);
      ctmp.drawImage(jc, 0, 0);


      frame.css({width : cWidth});
      canvas.attr({width : cWidth, height : cHeight});
      clear(c);
      c.drawImage(jtmp, 0, 0);
      win.trigger("resize");
    }