холст 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);