キャンバスhtml5コンテキストに描画

Question

私はコンテキストにすべてを描画し、後でそれをキャンバスに関連付けることはできますか？ たとえば、10個のコンテキストを作成してキャンバスに1つずつ描画したい場合は

Answer 1

これは興味深い考えですが、できません。キャンバスに依存しない新しいコンテキストを作成することも、キャンバスにコンテキストを割り当てることもできません。

10個のキャンバスを動的に作成する（ドキュメントに追加する必要がないため、表示されないようにする）ことができます。必要に応じて1つのキャンバスを別のキャンバスにスワップします。例：

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);