Когда дерево дает ветку то все сдвигается в бок прошу ответить по существу. Мне кажется проблема в массиве.
<!DOCTYPE html>
<html>
<head>
<title>Game</title>
</head>
<body>
<style>
#canvas{
border:1px solid black;
}
</style>
<canvas id = "canvas" widht = "320" height = "320"></canvas>
<script type="text/javascript">
document.getElementById("canvas");
var ctx = canvas.getContext("2d");
x = 0;
y = 0;
tree = [];
gens = [];
map = [0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0,
0,0,0,0,0,0,0,0,0,0];
mapp = [];
t = 0;
tree.push({id:95,energy:50,direction:"up"});
map[94] = 1;
function treess(){
for(i in tree){
if(t%4 == 0){
tree[i].energy+=1;
}
if(tree[i].energy == 100){
if(tree[i].direction == "up"){
if(map[tree[i].id - 10] == 0){
map[tree[i].id - 10] = 1;
tree.push({id:tree[i].id-10,energy:50,direction:"up"});
tree[i].energy = -231561132123164654
}
}
}
}
}
function mappp(){
mapp = [];
for(i in map){
if(map[i] == 1){
mapp.push({x:x,y:y});
x+=32;
}
x+=32
if(x >= 320){
x = 0;
y+=32;
}
if(y >= 320){
x = 0;
y = 0;
}
}
x = 0;
y = 0;
}
function game(){
ctx.clearRect(0,0,320,320);
mappp();
treess();
for(i in mapp){
ctx.fillRect(mapp[i].x,mapp[i].y,32,32);
}
t+=1;
}
setInterval(game,20);
</script>
</body>
</html>
