使用 Three.js 手动剔除视锥体

2023-12-12

我正在使用 Three.js 开发体素游戏。为此,我需要生成填充屏幕所需的尽可能多的块。目前,我正在围绕玩家加载一个半径为 20 的圆。

计算填充相机视锥体所需的块的精确范围并避免计算不可见块的最简单方法是什么?

每个块都有完全相同的大小(假设我们有一个向量size具有正确的值),并且位于 Y=0(X 和 Z 变化)。


var frustum = new THREE.Frustum();
frustum.setFromMatrix( new THREE.Matrix4().multiply( camera.projectionMatrix, camera.matrixWorldInverse ) );

for (var i=0; i<objects.length; i++) {
  objects[i].visible = frustum.intersectsObject( objects[i] );
}

仅渲染相机视锥体内的对象

有记录的here

希望这对你有帮助吗?

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Three.js 手动剔除视锥体 的相关文章

  • 将 A 框架与 Three.js 相结合

    我想知道 是否可以将 Three js 元素添加到 A 框架场景中 假设 A frame 是基于 Three js 构建的 并且 three Version 0 74 0 登录到你的控制台这不应该是一件奇怪的事情 对吧 我在我的 A 框架场
  • 如何沿着简单的路径移动相机

    如何沿着简单的路径 由顶点 点数组创建 移动相机 我需要自动移动它 而不是像第一人称射击游戏那样通过键盘 鼠标事件来移动它 找了这个例子 http trijs org examples webgl geometry extrude spli
  • 星系模拟:更改点的颜色并在鼠标悬停时显示文本

    我正在尝试创建模拟 https riteshsingh github io galaxies 4673 个最近星系的位置 星系是点 我想为鼠标悬停时的点着色并加载星系的名称 我花了很多天试图实现它 我可以更改颜色以及进行基本的光线投射 但是
  • THREE.js 导入的模型不应用面部纹理

    我正在尝试导入使用 THREEJS 导出器从搅拌机导出的模型 到目前为止 模型已加载并出现在我的场景中 并且正确应用了材质 汽车应为黄色 玻璃应为透明 但它并没有将我的纹理应用到以 tga 形式保存的汽车上 如果我不将纹理包含在模型所在的服
  • Three.js:基于图像的光照(IBL)

    I m searching to add an IBL to my scene and objects But I can t find anything on the web There are some examples with an
  • 如何计算给定坐标处相机可见矩形的大小? [复制]

    这个问题在这里已经有答案了 我制作了一个小型的 Three js 应用程序 它将一堆圆圈从画布的底部移动到顶部 let renderer scene light circles camera initialize animate funct
  • Three.js 光线投射器可以与组相交吗?

    我想知道我的光线投射器是否正在查看我已加载的 OBJ 由于从 Cinema4D 导出的方式 我相信 OBJ 是一个具有 3 个子级的 THREE Group 而不是 THREE Object 我可以更改我的 raycaster 代码行来查找
  • Three.js 设置并读取相机外观向量

    而不是使用camera rotation或lookAt 函数旋转相机 我想将外观矢量直接传递给相机 是否可以直接设置相机外观矢量以及是否可以从相机读取外观矢量 相机没有 外观矢量 因此无法设置它 但是 您可以构造一个point通过将您的外观
  • Three.js 对象的“中心”是什么?

    当我使用 Blender 对对象进行建模时 我能够明确定义其发生平移和旋转的中心位置 当使用 Three js 对象时 我似乎没有找到等效的对象 Three js 对象是否具有定义其 中心 位置的属性 如果不是 物体的中心是如何确定的 在
  • Three.js 椭圆

    如何在 Three js 中创建一个椭圆 我看过这个 在 THREE js 中绘制椭圆 https stackoverflow com questions 11419896 drawing an ellipse in three js 但如
  • 在 Webpack 中使用 Three.js 以便我可以使用 OrbitControls 的正确方法是什么?

    在我的 webpack 配置中 resolve alias three path resolve node modules three build three js OrbitControls path resolve node modul
  • 在 Three.js 中从 Web Worker 加载纹理

    当将大纹理图像应用到网格上一段明显的时间时 Three js 会锁定浏览器的主线程 让我们考虑以下示例 var texLoader new THREE TextureLoader texLoader load someLargeTextur
  • 无面点云 (PLY) 文件的 Web 查看器

    我在尝试Three Js https github com mrdoob three js 用于通过网络查看 PLY 文件 使用这个例子 http threejs org examples webgl loader ply html作为参考
  • Tween JS 基础知识之三个 JS 立方体

    我是 Tween JS 的新手 尝试使用 Tween 制作一个向右移动的简单动画 下面是我在 init 函数中的代码 我使用的是三个 JS var geometry new THREE CylinderGeometry 200 200 20
  • 使用 Three.js 遮挡现实世界的对象

    我在实验性增强现实网络浏览器中使用 Three js 该浏览器称为 Argon 本质上 Argon 使用高通的 Vuforia AR SDK 来跟踪手机摄像头中的图像和物体 Argon 将跟踪信息发送到 Javascript 中 在 Jav
  • Three.js - 推开然后恢复“鼠标移动”上的元素位置

    大家好 我正在开发一个项目Three js用户可以在哪里hover一个镶嵌的面 每个网格在与不可见球体相交时都应该被推开 并且当它在其区域之外时返回到其原始位置 我在用this http codepen io soulwire pen Ff
  • 计算顶点法线

    我正在使用 3d 修改器https github com foo123 MOD3 https github com foo123 MOD3弯曲一个立方体 几何体更新 顶点位置更改 后 灯光不会更新 立方体仍然着色 就好像没有任何变化一样 所
  • 使用 Three.js 制作带孔的圆角盒

    我需要创建一个 4 个侧面但顶部和底部都有圆角的盒子 Three js 有一个很好的例子webgl 几何 形状 https threejs org examples webgl geometry shapes我正在尝试复制它以在绿色圆框上添
  • Three.js - 重叠层闪烁

    当多个物体重叠在同一平面上时 它们开始闪烁 如何告诉渲染器将其中一个对象放在前面 我尝试使用 renderDepth 但它只能部分起作用 请参阅此处的示例 http liveweave com ahTdFQ http liveweave c
  • 三种js更新纹理生成Canvas的最佳性能方式

    I have THREE Points with THREE PointsMaterial As a map我使用生成的动态cavas image 我需要重新渲染canvas在每一帧上 我的部分代码 function makeEnemyBa

随机推荐