Javascript Three.js使用光线检测两个移动对象之间的碰撞

我正在使用THREE.js和WebGL渲染制作一个3D突破游戏。我想用THREE.Ray来检测弹跳球和底部平台之间的碰撞，这个平台可以由您控制，但我遇到了麻烦

<>我已经成功地把一个光线从平台投射到球上（或者其他方式），但是一旦我做到了，球就被卡在屏幕中央，不能被动画化。

var ray = new THREE.Ray( platform.position, ball.position.subSelf( platform.position ).normalize() );
var intersects = ray.intersectObject( ball );

if ( intersects.length > 0 ) console.log(intersects[0].distance);

我已尝试删除

子自我

和

normalize（）

，但这破坏了检测

以下是游戏和代码，可在script.js中找到：

如果打开控制台，可以看到如果移动面板，距离值会发生变化，这很好。但是球不能被设置动画，因为在每一帧它都被设置到那个位置

上面是我最初的做法，只需计算球和面板的Z位置，看看它是否更大，是否在面板的宽度（x）坐标内，如果是，则将其反弹

---

球的弹跳只是每帧改变X和Z坐标一个固定的量，如果球在任何一个方向上走得太远，则将该量反转，使其返回。

经过一番游戏后，我算出了它

var ray = new THREE.Ray( ball.position, new THREE.Vector3(ball.position.x, ball.position.y, platform.position.z).subSelf( ball.position ).normalize() );

var intersects = ray.intersectObject( platform );

if ( intersects.length > 0 ) {

    var face = intersects[0].face.d,
    dist = intersects[0].distance;

    if(face == 4 && dist <= 7) sizes.ball.velocityZ = -sizes.ball.velocityZ;

};

var-ray=new THREE.ray（ball.position，new THREE.Vector3（ball.position.x，ball.position.y，platform.position.z），subSelf（ball.position.normalize（））；
var intersects=射线。intersectObject（平台）；
如果（相交长度>0）{
变量面=相交[0]。面.d，
距离=相交[0]。距离；
如果（面==4&&dist在以下位置存在碰撞检测示例：

有关如何移动多维数据集的说明，请参见：
这太难调试了。你能用相关代码制作一个简单的示例吗？你能让你的简单示例在JSFIDLE中运行以便更容易被黑客攻击吗？当然，这里：我需要的是一条光线来检测平台和球之间的碰撞，然后如果它们接触，将球弹起。如何使用THREE.ray来检测碰撞在红色球和绿色平台之间？尝试将碰撞代码添加到小提琴上。到目前为止，您做得还不错。：-）如果您仍有问题，请重新发布。这是我所能做到的。我可以检测到它们之间的距离，但现在您无法移动绿色平台，它会移动到中间。这非常有用。但现在是2019年，所以threejs已更改。我们可以使用此
var ray=new THREE.Raycaster（ball.position，new THREE.Vector3（ball.position.x，ball.position.y，platform.position.z）.sub（ball.position.normalize（））；
使用光线投射器代替光线，使用sub代替subSelf。