-
글쓴이글
-
2021년 9월 27일 20:58 #15642
김병태참가자html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<canvas id = "canvas"></canvas>
<script src = "main.js"></script>
</body>
</html>main.js
<blockquote>var canvas = document.getElementById('canvas');var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth-100;
canvas.height = window.innerHeight-100;var dino = {
x:10,
y:200,
width:50,
height:50,
draw(){
ctx.fillStyle='green';
ctx.fillRect(this.x, this.y, this.width, this.height);}
}// dino.x += 1; 이거보다 라이브러리 쓰는게 더 좋다.
//dino.draw(); 밑의 함수로 이동
class Cactus{
constructor(){
this.x = 500;
this.y = 200;
this.width=50;
this.height=50;
}
draw(){
ctx.fillStyle='red';
ctx.fillRect(this.x, this.y, this.width, this.height);
}
}// var cactus = new Cactus();
// cactus.draw()var timer = 0;
var cactus여러개 = [];
var 점프timer =0;
var animation;function 프레임마다실행할거(){
animation = requestAnimationFrame(프레임마다실행할거);
timer++;ctx.clearRect(0,0,canvas.width, canvas.height);
// dino.x++;
if(timer % 144 ===0){ //cactus가 120프레임마다 1개씩 생긴다.
var cactus = new Cactus();
cactus여러개.push(cactus);
}
cactus여러개.forEach((a,i,o)=>{
//x좌표가 0미만이면 제거
if(a.x<0){
o.splice(i,1)
}
a.x--;충돌하냐(dino,a); //충돌체크는 여기서 해야. 공룡 vs 모든 선인장 충돌체크 해야하므로
a.draw();
})
// cactus.draw();
// dino.y -=3; //점프 속도//점프기능
if(점프중 == true){
dino.y-=3;
점프timer++;
}if(점프중 == false){
if(dino.y<200){
dino.y+=3;
}
}if(점프timer>40){
점프중 = false;
점프timer = 0;
}
dino.draw();
}프레임마다실행할거();
//충돌확인
function 충돌하냐(dino, cactus){
var x축차이 = cactus.x - (dino.x + dino.width);
var y축차이 = cactus.y - (dino.y + dino.heigth);
if((x축차이 <0) && (y축차이 <0 )){
ctx.clearRect(0,0, canvas.width, canvas.height);
cancelAnimationFrame(animation)
}
}var 점프중 = false;
document.addEventListener('keydown', function(e){
if(e.code ==='Space'){
점프중 =true;
}
});</blockquote>
강의 보고 한번 따라했는데 충돌에서 아무런 반응이 안 일어나네요. 뭘 잘못 쓴건지 못 찾겠습니다..
2021년 9월 27일 22:24 #15647
codingapple키 마스터var y축차이 = cactus.y - (dino.y + dino.heigth);
height 오타같은데요
-
글쓴이글
- 답변은 로그인 후 가능합니다.