画布html5绘画到上下文中

Question

我可以将所有内容绘制到上下文中，然后将其与画布相关联吗？ 例如，我想创建10个上下文，然后在画布上逐一绘制它们

Answer 1

这是一个有趣的想法，但不是，你不能这样做。您不能独立于画布创建新的上下文，也不能为画布分配上下文。

您可以做的是动态创建10个画布（您不必将它们附加到文档中，这样它们将不可见），然后在需要时替换另一个画布。例如：

var canvas = document.getElementsByTagName('canvas')[0]; 
var frames = []; 
for (var i=0; i<10; ++i){ 
    var c = frames[i] = document.createElement('canvas'); 
    c.width = canvas.width; c.height = canvas.height; 
    var ctx = c.getContext('2d'); 
    // draw what you want here 
} 

var frame = 0; 
// Cycle through the canvases at 15fps 
setInterval(function(){ 
    var c = frames[++frame % frames.length]; 
    canvas.parentNode.replaceChild(c, canvas); 
    canvas = c; 
},1000/15);