Question

我想检查相机中间是否有更多或更少的气缸来进行交互。气缸像按钮一样操作。我的想法是用平截头体检查，但我不知道，如何调整z轴。或者他们可能是更好的选择？

var frustum = new THREE.Frustum();
var matrix = new THREE.Matrix4().multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
frustum.setFromMatrix( matrix );
if(frustum.containsPoint( cylinder.position ))
  cylinder.material.color.setHex( '0xbada55' );
else      
  cylinder.material.color.setHex( '0xffcc00' );

检查气缸是否在视野中，如果在中间范围内则不检查。

Answer 1

光线投射很昂贵。

最简单的方法是将气缸位置投影到屏幕空间并检查它是否靠近屏幕中心。这样，您还可以定义需要接近中心的阈值：

var threshold = 0.2;

var positionScreenSpace = cylinder.position.clone().project(camera);
positionScreenSpace.setZ(0);

var isCloseToCenter = positionScreenSpace.length() < threshold;

我在这里做了一个演示：https://jsfiddle.net/holgerl/z199hzgd/

Answer 2

您可以raycast使用camera.getWorldDirection()作为目标。

这样的事情：

var raycaster = new THREE.Raycaster(camera.position, camera.getWorldDirection());

然后检查您所需的物体是否被击中。

var intersects = raycaster.intersectObjects(scene.children);

if (intersects && intersects[0].object.id == myObjectId) {
    // Object is in the center of the camera
}

Working fiddle

Answer 3

这通常使用光线投射完成：您将光线从视口中心投射到场景中，并检查该光线是否与任何对象相交。原则上，这是您需要的代码：

var raycaster = new THREE.Raycaster();
var center = new THREE.Vector2(0, 0);
var raycastTargets = [
  // add objects (meshes) that should be subject to raycasting
];

function render() {
  // ...

  camera.updateMatrixWorld();
  raycaster.setFromCamera(center, camera);

  var intersections = raycaster.intersectObjects(raycastTargets);
  var intersection = (intersections.length) > 0 ? intersections[0] : null;

  // ...
}

在渲染函数中的代码之后，您将在intersection中看到相关对象是否位于视图的中心。

ThreeJs：检查对象是否在Camera的中心

3 个答案: