HTML5 : Paint multiple canvases on one main canvas

Question

我正在寻找一种 [快速] 方法来在主 Canvas 元素上绘制来自多个 Canvas 的图像。什么是正确且最快的方法？

Answer 1

Canvas 的drawImage 方法可以接受一个Canvas 对象作为第一个参数。这是最快和推荐的方式。

这是来自 w3.org 的摘录:

// drawing images

void drawImage((HTMLImageElement or HTMLCanvasElement or HTMLVideoElement) image, double dx, double dy);

void drawImage((HTMLImageElement or HTMLCanvasElement or HTMLVideoElement) image, double dx, double dy, double dw, double dh);

void drawImage((HTMLImageElement or HTMLCanvasElement or HTMLVideoElement) image, double sx, double sy, double sw, double sh, double dx, double dy, double dw, double dh);

请注意，您的 Canvas 元素不必添加到您的文档中。我在内存 Canvas 中使用所有缓冲或 Sprite 对象 (someSprite = document.createElement('canvas');...)。