three.js服务器端冲突检测错误
three.js serverside collision detection error
服务器端对three.js冲突检测的使用与客户端的使用有什么不同吗?我们使用相同的场景,具有相同的设置客户端和服务器端。
我们要做的是在服务器端确定是否与世界发生冲突。为了简单起见,我们的世界只使用了两个盒子。所使用的代码取自Lee Stemkoski碰撞检测示例(为此我们感谢他——它非常出色且清晰)。
客户端代码运行平稳且没有问题,但以完全相同的方式启动的服务器端代码不会检测到冲突。在我们的演示中,玩家使用他的箭头移动。该移动被发送到服务器,服务器与客户端具有完全相同的场景。然后应用变换(旋转、位置更改等),然后将这些新位置发回。服务器和客户端在此之前处于同步状态。然而,客户端检测到我们的对象在世界上的命中(2个框),而服务器没有。
客户端:
socket.on("update", function(data){
var delta = clock.getDelta(); // seconds.
var moveDistance = 200 * delta; // 200 pixels per second
var rotateAngle = Math.PI / 2 * delta; // pi/2 radians (90 degrees) per second
if( data.type == "rot" ){
MovingCube.rotation.x = data.x;
MovingCube.rotation.y = data.y;
MovingCube.rotation.z = data.z;
}
if( data.type == "pos" ){
MovingCube.position.x = data.x;
MovingCube.position.y = data.y;
MovingCube.position.z = data.z;
}
var originPoint = MovingCube.position.clone();
for (var vertexIndex = 0; vertexIndex < MovingCube.geometry.vertices.length; vertexIndex++){
var localVertex = MovingCube.geometry.vertices[vertexIndex].clone();
var globalVertex = localVertex.applyMatrix4( MovingCube.matrix );
var directionVector = globalVertex.sub( MovingCube.position );
var ray = new THREE.Raycaster( originPoint, directionVector.clone().normalize() );
var collisionResults = ray.intersectObjects( collidableMeshList );
if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() )
console.log(" Hit ");
}
})
服务器端代码
socket.on("update", function(data){
console.log("updating location");
var delta = 0.1 ;//clock.getDelta(); // seconds.
var moveDistance = 200 * delta; // 200 pixels per second
var rotateAngle = Math.PI / 2 * delta; // pi/2 radians (90 degrees) per second
if( data == "A" ){
MovingCube.rotation.y += rotateAngle;
socket.emit("update",{"type":"rot","x":MovingCube.rotation.x,"y":MovingCube.rotation.y,"z":MovingCube.rotation.z});
}
if( data == "D" ){
MovingCube.rotation.y -= rotateAngle;
socket.emit("update",{"type":"rot","x":MovingCube.rotation.x,"y":MovingCube.rotation.y,"z":MovingCube.rotation.z});
}
if ( data == "left" ){
MovingCube.position.x -= moveDistance;
socket.emit("update",{"type":"pos","x":MovingCube.position.x,"y":MovingCube.position.y,"z":MovingCube.position.z});
}
if ( data == "right" ){
MovingCube.position.x += moveDistance;
socket.emit("update",{"type":"pos","x":MovingCube.position.x,"y":MovingCube.position.y,"z":MovingCube.position.z});
}
if ( data == "up" ){
MovingCube.position.z -= moveDistance;
socket.emit("update",{"type":"pos","x":MovingCube.position.x,"y":MovingCube.position.y,"z":MovingCube.position.z});
}
if ( data == "down" ){
MovingCube.position.z += moveDistance;
socket.emit("update",{"type":"pos","x":MovingCube.position.x,"y":MovingCube.position.y,"z":MovingCube.position.z});
}
var originPoint = MovingCube.position.clone();
for (var vertexIndex = 0; vertexIndex < MovingCube.geometry.vertices.length; vertexIndex++){
var localVertex = MovingCube.geometry.vertices[vertexIndex].clone();
var globalVertex = localVertex.applyMatrix4( MovingCube.matrix );
var directionVector = globalVertex.sub( MovingCube.position );
var ray = new THREE.Raycaster( originPoint, directionVector.clone().normalize() );
var collisionResults = ray.intersectObjects( collidableMeshList );
if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() )
console.log(" Hit ");
}
})
任何帮助都会很棒。这已经消耗了我两周的时间,没有错误消息,我不知道是什么出了问题。
浮点计算可以在不同的机器上产生不同的结果,让我试着为您找到一篇好文章。
给你,浮点决定论
希望它能帮助
实际上,这里真正的问题是您的服务器端代码可能没有从threejs调用渲染循环(这当然会破坏)
然而,渲染循环为您做了一些额外的工作,它对每个对象调用updateMatrixWorld()方法-
因此,在服务器端,在进行光线跟踪(使用世界矩阵而不是实际位置)之前,一定要调用
your_objects_you_want_to_raytrace.updateMatrixWorld();
在进行实际光线跟踪之前。
在您的情况下,MovingCube.updateMatrixWorld();
相关文章:
- 使用(navigator.geolocation)检测浏览器功能错误
- 导致内容安全策略(CSP)冲突错误的本地jquery.js文件
- 使用JavaScript和HTML5画布进行冲突检测
- 遇到错误后,更改检测似乎中断
- 为什么'滚动到顶部'脚本导致类型错误?jQuery冲突
- 如何避免正确的指令在NetBeans中被检测为错误
- Createjs冲突问题localToLocal不是函数错误
- Safari 5.1.7 flexslider/jquery工具冲突z索引错误
- Javascript/JQuery中的多DIV冲突检测
- three.js服务器端冲突检测错误
- 从数组绘制级别后的冲突检测
- 在 html canvas 元素上使用 javascript 进行冲突检测,而无需使用 jquery
- 关于不同屏幕尺寸的 Phonegap 游戏开发冲突检测
- JavaScript中一帧的冲突检测
- Javascript 2阵列冲突检测
- Javascript画布,通过数组进行冲突检测不起作用
- Javascript(没有jQuery) -谷歌Chrome有时会错误地检测窗口宽度
- 错误:508(检测到循环)
- gameQuery冲突检测
- jQuery 拖动与冲突检测