根据当前相机确定视口上是否可见网格 [英] Determine if a mesh is visible on the viewport according to current camera

问题描述

我一直在用 three.js 开发一个应用程序，但我遇到了这个问题，我似乎找不到任何解决方案.我想根据相机当前瞄准的位置确定哪些网格现在可见，因此我可以刷新我的对象(数据来自服务)，或者不取决于它们是否显示在视口上.

I have been developing an app with three.js but I have encountered this problem and I cannot seem to find any solution to it. I want to determine which meshes are visible right now according to where the camera is currently aiming, so i can refresh my objects (data is coming from a service) or not depending on if they are being shown on the viewport.

我在 CANVAS 模式下使用 THREE.js(我找到了一个使用 WebGL 的解决方案，该解决方案表明对象是否被渲染，但我需要这个项目的 CANVAS).

I'm using THREE.js in CANVAS mode (I have found a solution using WebGL that says if objects are rendered or not, but i need CANVAS for this project).

我一直在尝试寻找 three.js 是否以某种方式设置了一个属性来指示对象是否可见(当前在屏幕上，而不是在整个 3D 世界上)，但我可以没找到网格有一个 visible: 属性，但即使相机没有瞄准该对象，它也始终为真.

I have been trying to find if three.js sets somehow a property to indicate whether the object is visible or not (currently on the screen, not on the entire 3D world), but I can't find it. Meshes have a visible: property but it's always on true even if the camera is not aiming to that object.

推荐答案

这是您想要的代码:

var frustum = new THREE.Frustum();
var cameraViewProjectionMatrix = new THREE.Matrix4();

// every time the camera or objects change position (or every frame)

camera.updateMatrixWorld(); // make sure the camera matrix is updated
camera.matrixWorldInverse.getInverse( camera.matrixWorld );
cameraViewProjectionMatrix.multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
frustum.setFromMatrix( cameraViewProjectionMatrix );

// frustum is now ready to check all the objects you need

console.log( frustum.intersectsObject( object ) );

这篇关于根据当前相机确定视口上是否可见网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！