Andrew Simpson
Andrew Simpson

Reputation: 7314

Create an array of canvas elements

I would like to create an array of canvas controls.

This is my code so far:

var j = new Array();
var canvas = new Array();
var ctx = new Array();
var d = new Array();

for (var i = 0; j < 16; i++) {
    j[i] = new JpegImage();
    canvas[i] = document.createElement("canvas" + i);
    ctx[i] = canvas[i].getContext("2d");
    d[i] = ctx[i].getImageData(0, 0, 180, 119);

    j[i].onload = function () {
        j[i].copyToImageData(dHidden1);
        ctx[i].putImageData(d[i], 0, 0);
        ctxHidden.drawImage(canvas[i], 0, 0, 180, 119);
    };
}

I get this error:

enter image description here

Upvotes: 0

Views: 600

Answers (1)

GameAlchemist
GameAlchemist

Reputation: 19294

your code ends up calling for instance :

document.createElement('canvas0');

And canvas0 is not a valid html tag, so no canvas get created, so getContext cannot get called also.

In your loop, Simply use :

    canvas[i] = document.createElement("canvas");

Upvotes: 1

Related Questions