javascript - 使用光线转换器从玩家的视野中获取交叉点坐标?

标签 javascript three.js raycasting

我在使用光线转换器获取玩家在世界中所看到的位置的坐标时遇到问题。它没有在任何十字路口上行驶。

更具体地说,我试图获取地形上交叉点的坐标,该地形由多个 BufferGeometry 网格体组成。这是我正在使用的代码,取自 Raycaster example : ( groupedMeshes 数组存储 BufferGeometry 网格)

var mouseX = ( event.clientX / window.innerWidth ) * 2 - 1;
var mouseY = -( event.clientY / window.innerHeight ) * 2 + 1;

var vector = new THREE.Vector3( mouseX, mouseY, camera.near );

// Convert the [-1, 1] screen coordinate into a world coordinate on the near plane
var projector = new THREE.Projector();
projector.unprojectVector( vector, camera );

var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );

// See if the ray from the camera into the world hits one of our meshes
var intersects = raycaster.intersectObject( groupedMeshes );
lastIntersects = intersects;

if ( intersects.length > 0 ) {
    console.log("Intersection!");
}

以及显示玩家 View 的图像:
(红点说明我想从相机中心向地形转换光线)

enter image description here

鼠标/指针已锁定(第一人称相机 View ),所以我假设我想检查屏幕中心是否有交叉点?上面的代码没有这样做,所以我一直在没有锁定指针的情况下进行测试。

如果有人能明白为什么它没有检测到任何交叉点,我将非常感谢您的帮助。谢谢。

<小时/>

编辑:
看来我应该使用 raycaster.intersectObjects( groupedMeshes );不是raycaster.intersectObject( groupedMeshes ); 。我的错。

所以我现在唯一的问题是如何将光线从玩家(第一人称) View 发射到地形。谢谢!

编辑2:

var vector = new THREE.Vector3( 0, 0, 0.5 );

var projector = new THREE.Projector();
projector.unprojectVector( vector, camera );

var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );

var intersects = raycaster.intersectObjects( groupedMeshes );
lastIntersects = intersects;

if ( intersects.length > 0 ) {
    console.log(intersects);
}

最佳答案

通过查看 this example 解决了这个问题脚本。

我现在正在使用它,它允许我从相机位置向玩家/相机面向的方向发射光线:

var raycaster = new THREE.Raycaster();
var direction = new THREE.Vector3( 0, 0, -1 );
var rotation = new THREE.Euler( 0, 0, 0, "YXZ" );

function shootRay() {
    rotation.set( pitchObject.rotation.x, yawObject.rotation.y, 0 );

    raycaster.ray.direction.copy( direction ).applyEuler( rotation );
    raycaster.ray.origin.copy( yawObject.position );

    var intersections = raycaster.intersectObjects( groupedMeshes );
    if ( intersections.length > 0 ) {
        console.log(intersections[0].point);
    }
}

关于javascript - 使用光线转换器从玩家的视野中获取交叉点坐标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22437023/

相关文章:

algorithm - 计算体射线转换中的梯度

javascript - 将客户端处理程序从内容页添加到母版页控件

javascript - 重新定义window.console函数时保持原路径位置

javascript - 带有 id 的 CreateElement?

javascript - 如何在类库项目中调用javascript函数

javascript - 如何通过单击框架场景中的实体/对象来制作 Div 显示

Three.js 示例代码,来自 StackOverflow,无法正常工作

javascript - InstancedBufferGeometry 的 PhongMaterial

godot - 当光线转换击中物体时是否有事件?

java - 如何将 Renderable 放置到 HitTestResult getPoint() 位置