Несколько динамических элементов холста?

Question

У меня есть некоторый код, динамически генерирующий элементы холста из изображений с использованием jquery, и я хочу применить один и тот же контекст рисования ко всем без исключения элементам, используя document.getElementsByName или подобный метод, возможно ли это?Вот мой код:

$('#imagebox img').each(function(){

      var width = $(this).width();
      var height = $(this).height();

        $('<canvas/>', {
        name: 'canv',
        css: {
          margin: '0px',
          background: '#FF0000',
          float: 'left',
          width: width,
          height: height
        }
      }).appendTo('#main'); 

          // Get the canvas element and its drawing context
        var canvas = document.getElementsByName('canv');
        var context = canvas.getContext('2d');

        /*
        |---------------------
        | Origin: Top Left
        | End: Bottom Right
        |---------------------
        */

        context.beginPath();
        context.moveTo(0, 0);
        context.lineTo(canvas.width, canvas.height);
        context.stroke();

        /*
        |---------------------
        | Origin: Top Right
        | End: Bottom Left
        |---------------------
        */

        context.save();
        context.beginPath();
        context.moveTo(canvas.width, 0);
        context.lineTo(0, canvas.height);
        context.stroke();
        context.restore();

    });

Answer 1

Да, конечно, можно достичь желаемого эффекта.

Вы просто рисуете в одном из контекстов холста, а затем используете drawImage(originalContext,0,0) во всех других контекстах холста, чтобы сделать полную копию.

Исходный холст (тот, над которым вы выполняете все операции рисования) даже не должен находиться на странице. При желании его можно создать просто в коде, и все на странице - это просто drawImage из этого контекста холста.

Вот пример двух холстов, «разделяющих» контекст. Весь материал рисуется на canvas1, а затем я масштабирую меньший canvas2 и рисую на нем контекст canvas1:

http://jsfiddle.net/U6QLN/

Answer 2

возможно ли это?

Нет, это невозможно.

Элемент Canvas похож на любой элемент HTML - каждый экземпляр может отображаться на странице HTML только один раз.

Кроме того, каждый холст имеет ровно один контекст, и контексты не могут быть общими.