2013-04-30 2 views
-1

나는 HTML5 캔버스를 서로 바운스하는 상자가 있지만, 서로 붙어서 그 이유를 모르겠습니다. 나는 반송의 비트를 추가하지만 만들어 그것을 더자바 스크립트 2D 충돌 감지

http://passion4web.co.uk/ben/collision1.html

P.s 초급

+2

관련 코드와 HTML을 질문에 붙여주십시오. – JJJ

+0

점검 간격이 충분하지 않은 것 같습니다. 꽤 멋진 부작용, btw. – techfoobar

+0

질문에 JS, HTML 또는 Canvas가 없습니다. 실제로 문제는 추상적이어서 구현 환경과는 관련이 없습니다. – Alnitak

답변

2

당신의 가장 큰 문제를하는 데 도움이 .abs (speed.x)

희망은이 두 줄입니다 : 당신의 속도를 수정

//bounce 
this.speed.y += 0.5; 
this.speed.x += 0.5; 

현재 지시선을 고려하지 않은 상자 운동의 n.

이렇게하면 충돌 감지 알고리즘의 고전적인 문제가 발생하여 개체의 속도를 수정 한 후 계산 된 새 지점이 여전히 충돌 범위 내에 있고 두 개체가 서로 달라 붙을 수 있습니다. 이 문제

한 접근법 (즉, 충돌 검출을 수행 한 다음 속도 위치 벡터에 대한 벡터 및 추가)보다는 현재 위치보다는 미래 위치를 투사 에 기초하여, 충돌 검출을 수행하는 것이다.

엄밀히 말하자면, 정확히 외부에서 외부로 충돌이 발생하지만, 샘플링 속도가 충분히 높으면 시각적 효과가 좋을 것입니다.

0

나는 당신이 -1로 속도를 곱하면 함께 할 수있다 생각한다. 두 개의 충돌 상자가 스크립트를 통해 다음 루프와 여전히 겹치기 때문에 서로 향하게 방향을 바꿉니다. 나는 두 가지 솔루션의

을 생각할 수 있습니다 :

당신이 부드러운 바운스를 원한다면, 단지 속도 변수를 형성 추가 사용 및 빼기

1) 예를 들어/speed.x + = 0.5;

2) 강건한 종류의 바운스를 원한다면 속도 변수를 특정 속도 (예 :/speed.x = 5)로 설정하십시오. 현재 속도와 일치하도록하려면 abs를 사용하십시오. speed.x = Math.abs (speed.x);

그러나 이러한 솔루션 중 하나를 사용하려면 개체가 충돌하는 위치 (위, 아래, 오른쪽, 왼쪽)에 따라 약간 다른 스크립트를 실행해야합니다. 오른쪽에 충돌 한 경우 speed.x = -Math 말이과 최대한 멀리 볼 수 :