Question
Need help on javascript where my images wont show on screen #canvas{border: 1px solid black;} var canvas=document.getElementById('canvas'); var context=canvas.getContext('2d'); var mapArray= [ [1,1,1,1,1,1,1,1,1,1,1,1,1,1], [1,0,0,0,0,0,0,0,0,0,0,0,0,0], [1,0,0,2,0,0,0,0,2,2,2,2,2,2],
Need help on javascript where my images wont show on screen
#canvas{border: 1px solid black;}
var canvas=document.getElementById('canvas');
var context=canvas.getContext('2d');
var mapArray= [
[1,1,1,1,1,1,1,1,1,1,1,1,1,1],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0],
[1,0,0,2,0,0,0,0,2,2,2,2,2,2],
[1,0,0,2,0,0,0,0,2,2,2,2,2,2],
[1,0,0,2,0,0,0,0,0,0,0,0,0,0],
[1,0,0,0,0,0,0,0,0,0,0,0,0,0],
[1,1,1,1,1,1,1,1,1,1,1,1,1,1]
];
var wall=new Image();
var tree=new Image();
var grass=new Image();
wall.src='wall.png';
tree.src='tree.png';
grass.src='tree.png';
var posX=0;
var posY=0;
for(var i=0; i < mapArray.length; i++){
for(var j=0; j < mapArray[i].length; j++){
if(map[i][j]==0){
context.drawImage(grass, posX, posY, 32,32);
}
if(map[i][j]==1){
context.drawImage(wall, posX, posY, 32,32);
}
if(map[i][j]==2){
context.drawImage(tree, posX, posY, 32,32);
}
posX+=32;
}
posX=0;
posY+=32;
}
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started