使用 THREE.Frustum 计算近/远平面顶点

2023-11-25

我需要一些帮助来处理 THREE.Frustum 对象。

我的问题:

我需要计算近/远平面顶点;我已经看过这些教程

  1. http://www.lighthouse3d.com/tutorials/view-frustum-culling/view-frustums-shape/
  2. http://www.lighthouse3d.com/tutorials/view-frustum-culling/geometric-approach-extracting-the-planes/

我已经草绘了这个函数,它准确地实现了(我希望如此)所解释的过程(只是为了获得左上/右上顶点,假设相机只能向左和向右看):

        // Near Plane dimensions
        hNear = 2 * Math.tan(camera.fov / 2) * camera.near; // height
        wNear = hNear * camera.aspect; // width

        // Far Plane dimensions
        hFar = 2 * Math.tan(camera.fov / 2) * camera.far; // height
        wFar = hFar * camera.aspect; // width

getVertices : function() {
        var p = camera.position.clone();
        var l = getCurrentTarget(); // see below
        var u = new THREE.Vector3(0, 1, 0);

        var d = new THREE.Vector3();
        d.sub(l, p);
        d.normalize();

        var r = new THREE.Vector3();
        r.cross(u, d);
        r.normalize();

        // Near Plane center
        var dTmp = d.clone();
        var nc = new THREE.Vector3();
        nc.add(p, dTmp.multiplyScalar(camera.near));

        // Near Plane top-right and top-left vertices
        var uTmp = u.clone();
        var rTmp = r.clone();
        var ntr = new THREE.Vector3();
        ntr.add(nc, uTmp.multiplyScalar(hNear / 2));
        ntr.subSelf(rTmp.multiplyScalar(wNear / 2));

        uTmp.copy(u);
        rTmp.copy(r);
        var ntl = new THREE.Vector3();
        ntl.add(nc, uTmp.multiplyScalar(hNear / 2));
        ntl.addSelf(rTmp.multiplyScalar(wNear / 2));

        // Far Plane center
        dTmp.copy(d);
        var fc = new THREE.Vector3();
        fc.add(p, dTmp.multiplyScalar(camera.far));

        // Far Plane top-right and top-left vertices
        uTmp.copy(u);
        rTmp.copy(r);
        var ftr = new THREE.Vector3();
        ftr.add(fc, uTmp.multiplyScalar(hFar / 2));
        ftr.subSelf(rTmp.multiplyScalar(wFar / 2));

        uTmp.copy(u);
        rTmp.copy(r);
        var ftl = new THREE.Vector3();
        ftl.add(fc, uTmp.multiplyScalar(hFar / 2));
        ftl.addSelf(rTmp.multiplyScalar(wFar / 2));

getCurrentTarget : function() {
        var l = new THREE.Vector3(0, 0, -100);
        this.camera.updateMatrixWorld();
        this.camera.matrixWorld.multiplyVector3(l);
        return l;
    }

这似乎有效,但是...

我的问题:

我可以使用 THREE.Frustum 对象以更优雅(也许更正确)的方式获得相同的结果吗?


Three.Frustum并不会真正帮助你——它只是一组飞机。好消息是您的解决方案看起来是正确的,但有一种更简单的方法来考虑这个问题。

近平面的右上角是相机空间中的一个点,其坐标如下:

var ntr = new THREE.Vector3( wNear / 2, hNear / 2, -camera.near );

使用你的定义wNear and hNear,这是正确的。

现在,确保camera.matrixWorld更新后,您可以将该点转换为世界坐标,如下所示:

camera.updateMatrixWorld();
ntr.applyMatrix4( camera.matrixWorld );

现在,翻转符号以获得其他三个角,然后对远平面重复计算。

看,你说得对;你只是走了一条更复杂的路线。 :-)

编辑:更新到 Three.js r.66

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

使用 THREE.Frustum 计算近/远平面顶点 的相关文章

  • Crypto-Js 库的 hmac-256 脚本返回函数结构而不是 Google Apps 脚本中的值,在外部工作正常吗?

    我正在设置一个谷歌电子表格项目来连接到我的 CryptoExchange API 但是当涉及到这个简单的 CryptoJs Hmac sha256 脚本时 它不起作用 它返回函数结构而不是值 而在外部它工作正常 看我的jsfiddle ht
  • 如何将 Django 中的数组传递给模板并在 JavaScript 中使用它

    我想将数组传递给模板 然后通过 JavaScript 使用它 In my views py I have arry1 Str 500 20 return render to response test html array1 arry1 在
  • 我如何使用 querySelector() 选择具有双类的元素

    当我想使用 querySelector 选择元素时遇到问题 ul class xoxo blogroll ul 我怎样才能选择它ul元素 在我的代码中我像这样使用 var list document body querySelector u
  • 如何在bootstrap中默认隐藏侧边栏?

    我在这里有一个很好的参考 作为 Bootstrap 在设计 Web 表单应用程序时的侧边栏 http startbootstrap com template overviews simple sidebar http startbootst
  • 实现悬停信息框

    我有一个日历 当用户将鼠标悬停在单元格上时 会出现一个很大的信息框 其中包含该日期的详细信息 虽然当用户离开时使信息框消失 但我遇到了一些麻烦 我基本上想要它 这样当鼠标光标移出信息框隐藏的日历单元格时 它就会消失 但我遇到了麻烦 因为mo
  • Javascript 在另一个函数中检测“Shift”键按下

    我正在从 Flash 影片 使用外部接口 调用我的 html 页面中的 Javascript 函数 并且我想知道调用该函数时用户是否按下了 Shift 键 例如 如果我通过鼠标单击调用该函数 这似乎很简单 因为我可以传递事件并检查 if e
  • Angularjs 完整日历不显示事件

    我正在用那个https github com angular ui ui calendar https github com angular ui ui calendar在 Angularjs 中使用 FullCalendar 它显示日历并
  • 在 setInterval / setTimeout 中使用变量作为时间[重复]

    这个问题在这里已经有答案了 这是一个示例情况 var count time 1000 setInterval function count 1 time 上面的代码会将 count 变量加 1 即 1000 毫秒 看来 setInterva
  • 限制 Dropzone 仅上传特定类型的文件

    我正在使用 Dropzone 上传文件 这是我的代码 div div
  • Cosmos DB Mongo API 如何管理“请求率很大”情况

    我有以下代码 async function bulkInsert db collectionName documents try const cosmosResults await db collection collectionName
  • 游戏手柄 JavaScript 未能按预期更新

    我正在尝试让浏览器报告我的 XBOX 控制器的状态 然而 在第一次按下按钮后 它似乎变得 卡住 我究竟做错了什么
  • html canvas动画卡顿

    谁能解释为什么提供的画布动画断断续续 我创建了一个测试存根来演示该问题 我在桌面上的 FF Chrome IE 以及 Android 上的 FF 和 Chrome 中看到了卡顿现象 口吃是由于垃圾收集造成的吗 似乎 raf 在每次调用时都会
  • 如何循环遍历对象数组并生成键值对?

    我有一个像这样的对象数组 let someObj items id 12 value true id 34 value true id 56 value false 我想将其添加到现有对象中 其中 id 是该对象的键 如下所示 let ob
  • 如何知道浏览器空闲时间?

    如何跟踪浏览器空闲时间 我用的是IE8 我没有使用任何会话管理 也不想在服务器端处理它 这是纯 JavaScript 方法来跟踪空闲时间 并在达到一定限制时执行一些操作 var IDLE TIMEOUT 60 seconds var idl
  • put方法中的Angularjs文件上传不起作用

    我有一个简单的待办事项应用程序 我试图在其中上传照片和单个待办事项 现在我已经创建了这个工厂函数来负责待办事项的创建 todosFactory insertTodo function todo return http post baseUr
  • 将 window.location 传递给 Flask url_for

    我正在使用 python 在我的页面上 当匿名用户转到登录页面时 我想将一个变量传递到后端 以便它指示用户来自哪里 发送 URL 因此 当用户单击此锚链接时 a href Sign in a 我想发送用户当前所在页面的当前 URL
  • JavaScript Promise 不执行 .then()

    我在 JavaScript 中的 Promise 方面遇到了一些问题 我想做的是获得一个地址列表 然后对于每个地址 我需要调用地理编码 API 来获取 lat lng 然后我将继续将标记与热图一起绘制 这是我的代码 let promiseK
  • 如何:带有 onclick 的 div 位于另一个带有 onclick 的 div 中

    只是一个简单的问题 我遇到了 div 与 onclick javascript 之间的问题 当我点击内部 div 时 它应该只触发它的 onclick javascript 但外部 div 的 javascript 也会被触发 用户如何点击
  • 在方法内部执行方法

    我目前正在 FreeCodeCamp 中进行 JavaScript 练习 我的代码应该使用的测试用例之一是函数调用 如下所示 addTogether 2 3 这是我得到的基本功能 function addTogether return 当我
  • JQuery 删除和内存泄漏

    我正在开发一个游戏 我看到了很多内存消耗 我使用jquery animate 动画完成后 我 remove 元素 我的问题是 从 dom 树中删除一个元素后 对象还存在记忆中吗 Javascript 是一种垃圾收集语言 这意味着当没有代码保

随机推荐

  • 编写 C++ 版本的代数游戏 24

    我正在尝试编写一个像游戏 24 一样工作的 C 程序 对于那些不知道如何玩的人 基本上你会尝试通过 四个代数运算符找到 4 个数字总计为 24 的任何方法 和括号 举个例子 假设有人输入 2 3 1 5 2 3 5 1 24 由于括号位置的
  • ADB 安装失败并显示 INSTALL_FAILED_TEST_ONLY

    我在将 apk 安装到我的设备时遇到问题 adb install lt apk gt 使用上述命令将返回以下内容 5413 KB s 99747 bytes in 0 017s pkg data local tmp AppClient Te
  • SQL 的扩展占位符,例如id 在哪里 (??)

    赏金更新 已经从马克那里得到了很好的答案 将 改编为 如下 然而 除了 DBIx 之外 我仍在寻找类似的方案 我只是想兼容anything 我需要有关我为参数化 SQL 语句中的 扩展 占位符选择的语法的建议 因为构建一些构造 IN 子句
  • 带弹性盒的计算器键盘布局

    我正在用 Flexbox 构建一个计算器 我想要其中一个键的高度是两倍 另一个键的宽度是两倍 我用谷歌搜索了很多 但找不到这两个案例 对于两倍高度的键 我发现的唯一答案是flex direction as column 但在这种情况下 我将
  • iPython 笔记本避免在函数内打印

    我想阻止某个函数在 iPython 笔记本中打印 在标准 python 中 可以防止打印问题中回答的某些代码行 防止函数在 Python 的批处理控制台中打印然而 此方法在 iPython Notebook 中不起作用 在内核重新启动之前会
  • 您如何在协作、版本控制的环境中处理 Oracle 软件包? [关闭]

    Closed 这个问题是基于意见的 目前不接受答案 我在 Oracle 的多开发人员环境中工作 有一个大包 我们有DEV gt TST gt PRD的促销模式 目前 所有包编辑都是直接在 TOAD 中进行 然后编译到 DEV 包中 我们遇到
  • 使用 Bash 重定向到多个文件时重定向不明确

    echo gt home jem rep 0 1 3 logs SystemOut log bash home jem rep 0 1 3 logs SystemOut log ambiguous redirect 我可以一次重定向到多个文
  • 如何根据特殊条件进行分组

    目前 当我发出此 SQL 时 它会获取不同的用户名 我有一些不同的用户名 它们代表组 例如GRP BSN 我想将所有其他用户名 恰好是数字 分组到一个组中 例如GRP OTHERS select username count from ho
  • 连接到 SoftHSM java

    Code String pkcs11cfg pkcs11 cfg Provider p new SunPKCS11 pkcs11cfg Security addProvider p KeyStore ks KeyStore getInsta
  • 如何在 Angular cli 6.0.1 中创建 Angular 5 项目

    My 角度 cli 版本是 6 0 1 and node版本是8 11 1 如何创建或添加 Angular 5 的新项目 如果我使用ng 新的 项目名称 然后该项目正在下载角6 我也偶然发现了这个场景 这是我的解决方案 不幸的是 我们受到
  • 找出 Windows 的安装语言为

    我遇到一个问题 用户设置的区域设置 德语 与安装的语言 Windows 英语 不同 有没有办法发现安装的 Windows 语言与用户设置的区域设置 我应该注意的问题是我正在创建共享 并且根据区域设置设置权限 因此如果用户将区域设置设置为德语
  • LFSR 实现中的高效位调整

    虽然我有一个很好的 LSFR C 实现 但我想我会在 Haskell 中尝试同样的方法 只是看看它是如何进行的 到目前为止 我的想法比 C 实现慢两个数量级 这就引出了一个问题 如何提高性能 显然 位调整操作是瓶颈 分析器也证实了这一点 这
  • 如何在 Node Js 应用程序的多个实例之间同步对象

    Node JS 应用程序中是否有任何对象可以锁定 是否有多个应用程序实例可用 某些功能不应并发运行 如果实例 A 功能完成 它应该解锁该对象 密钥或某些标识符 并且应用程序的 B 实例应该检查其解锁是否应该运行某些功能 任何对象或密钥都可以
  • 通过 BinaryReader 将字节数组解压缩为字符串会产生空字符串

    我正在尝试解压缩字节数组并使用二进制读取器将其转换为字符串 当执行以下代码时 inStream 位置从 0 更改为数组的长度 但 str 始终是空字符串 BinaryReader br null string str String Empt
  • JavaScript 方括号函数调用

    当我浏览 jQuery 源代码时 我遇到了这一行 jQuery this state show hide 相比之下有什么优势吗 state jQuery this show jQuery this hide 独立示例 var object
  • Google App Engine 和 Google Compute Engine 有什么区别?

    我想知道 App Engine 与 Compute Engine 之间有什么区别 谁能向我解释其中的区别吗 应用引擎是一个平台即服务 这意味着您只需部署代码 平台就会为您完成其他所有事情 例如 如果您的应用程序非常成功 App Engine
  • 可变参数模板递归返回类型推导编译错误

    为什么下面的代码不能编译 template
  • 为什么 fclose 会挂起/死锁? (视窗)

    我有一个目录更改监视器进程 它从一组目录中的文件读取更新 我有另一个进程 可以对这些目录中的大量文件执行少量写入 测试程序 想象一下大约 100 个目录 每个目录有 10 个文件 每秒修改大约 500 个文件 运行一段时间后 目录监视器进程
  • “错误:‘myfn’声明为返回函数的函数”是什么意思?

    我正在尝试编写一个返回函数指针的函数 这是我的最小示例 void myfn int Doesn t work supposed to be a function called myfn that returns a pointer to a
  • 使用 THREE.Frustum 计算近/远平面顶点

    我需要一些帮助来处理 THREE Frustum 对象 我的问题 我需要计算近 远平面顶点 我已经看过这些教程 http www lighthouse3d com tutorials view frustum culling view fr