Javascript Canvas Element - Array Of Images
Posted
by Ben Shelock
on Stack Overflow
See other posts from Stack Overflow
or by Ben Shelock
Published on 2009-09-01T03:31:50Z
Indexed on
2010/03/28
5:53 UTC
Read the original article
Hit count: 260
I'm just learning JS, trying to do things without jQuery, and I want to make something similar to this however I want to use an array of images instead of just the one.
My image array is formed like this
var image_array = new Array()
image_array[0] = "image1.jpg"
image_array[1] = "image2.jpg"
And the canvas element is written like this. (Pretty much entirely taken from the Mozilla site)
function draw() {
var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.src = 'sample.png';
img.onload = function(){
for (i=0;i<5;i++){
for (j=0;j<9;j++){
ctx.drawImage(img,j*126,i*126,126,126);
}
}
}
}
It uses the image "sample.png" in that code but I want to change it to display an image from the array. Displaying a different one each time it loops.
Apoligies if I've not explained this well.
© Stack Overflow or respective owner