如何在Three.js中检测两个物体是否了发生碰撞

JavaScript018

如何在Three.js中检测两个物体是否了发生碰撞,第1张

使用Raycaster进行碰撞检测 用Raycaster来检测碰撞的原理很简单,我们需要以物体的中心为起点,向各个顶点(vertices)发出射线,然后检查射线是否与其它的物体相交。如果出现了相交的情况,检查最近的一个交点与射线起点间的距离,

你可以在拖动时获取子div的offsetLeft和offsetTop,然后联合子div、父div的高度和宽度计算两个div位置的关系。

offsetTop :当前对象到其上级层顶部的距离.

offsetLeft :当前对象到其上级层左边的距离.

比如:

父div的四个点的位置是(0,0),(0,width1),(height1,0),(height1,width1)

而子div的四个点的位置是(offsetTop,offsetLeft),(offsetTop ,offsetLeft+width2),(offsetTop+height2,offsetLeft),(offsetTop+height2,offsetLeft+width2)

然后对比这些点的位置即可

reatejs,看看你应该能懂

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

//敌机与子弹的碰撞检测

function updateEnemy(){

var i, j,fire,enemy1

for(i=0i<fires.lengthi++){

for(j=0j<enemy.lengthj++){

fire = fires[i]

enemy1 = enemy[j]

var fx = fire.x

var fy = fire.y

var ex = enemy1.x

var ey = enemy1.y

var ew = enemy1.getBounds().width

var eh = enemy1.getBounds().height

if(ey>=800 || ex>=600){

enemy.splice(j,1)

stage.removeChild(enemy1)

}

if(fy <ey+eh &&fy >ey &&fx>ex &&fx<ex+ew &&ey >0){

score += 10

fires.splice(i,1)

enemy.splice(j,1)

stage.removeChild(fire)

stage.removeChild(enemy1)

createjs.Sound.play("explosion")

var exp1 = new createjs.Sprite(spriteSheet,"exp")

exp1.x = ex

exp1.y = ey

exp1.addEventListener('animationend',function(e){

stage.removeChild(e.target)

})

stage.addChild(exp1)

}

}