threejs：如何获得几何体的boundingBox？

最新推荐文章于 2025-05-17 11:15:51 发布
最新推荐文章于 2025-05-17 11:15:51 发布
阅读量1.5k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： threejs 前端开发 文章标签： 前端 计算机视觉
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/lilycheng1986/article/details/124961294
本文讲解了在使用Three.js时，如何正确地计算并获取BoundingBox的值。文章指出，BoundingBox和其他Geometry属性一样，并不是直接可用的，而是需要先进行计算。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

如果我们直接打印boundingBox（如下图），得到的结果将会是null，需要先计算，然后再打印。

正确的做法：

同理，Geometry的很多属性，也都是要先计算后取值。

Three.js中文文档

Three.js 基础入门--第04课：基础功能之 Geometry 几何体
liuhao9999的博客
04-11 448
前一篇，我们讲解了场景的结构和基类，对 Three.js 的结构有了一个大概的了解，我们的代码案例还是停留在显示一个立方体的状态。本文，我们将制作更多的几何体形状。一个模型是由几何体 Geometry 和材质 Material 组成。Three.js 内置了很多的几何体种类，如立方体、三棱锥、球、八面体、十二面体、二十面体等等，本文我们将介绍这些几何体的模型创建和几何体的通用方法。
ThreeJS入门（231）：THREE.Box3Helper 知识详解，示例代码
大剑师兰特的GIS世界
01-26 975
`THREE.Box3Helper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个三维包围盒（Bounding Box）来帮助可视化几何体的空间范围。这个工具类常用于调试目的，帮助开发者更好地理解几何体的大小、位置和方向。
WEB 3D技术 three.js 包围盒
weixin_45966674的博客
01-06 2426
THREE.Box3Helper 需要两个参数 第一个是 需要处理的包围盒对象 就是我们从gltf几何体对象上拿到的 boundingBox属性 第二个为一个颜色属性。还有就是 比如 我们物体做的比较复杂 是非常多顶点构建的 那么 我们判断它有没有和其他物体接触就很麻烦 但 有了包围盒 我们只需要判断包围盒有没有接触即可。它的作用 比较明显的就是 当用户点击某个物体 我们用包围盒套住 用户能够很直观的知道自己当前选中的物体是哪一个。这里 我们有两个 一个是 包围盒 另一个是 包围圈。
Three.js 中的包围盒（Bounding Box）
qq_34820371的博客
01-01 1503
包围盒通常是一个简单的矩形或立方体，它最小化了包含物体所需的空间。包围盒的核心目的是提供一个快速计算物体空间占用的方式，不需要处理复杂的几何形状。轴对齐包围盒（AABB，Axis-Aligned Bounding Box）：包围盒的边与坐标轴平行。最小包围盒（OBB，Oriented Bounding Box）：包围盒的边不一定与坐标轴平行，它能够更紧密地包围物体。在 Three.js 中，我们常用的是轴对齐包围盒（AABB）。
Threejs 奇幻几何体：边缘、线框、包围盒大冒险
Small world
05-17 558
Draco 是一个开源的 3D 图形压缩库，可以有效地减少 3D 模型的文件大小，加快加载速度，并保持较高的图形质量。在 Three.js 中，模型解压是指将压缩的模型文件解压缩为 Three.js 可以直接使用的模型对象的过程。包围盒(Bounding Box)是一个用于描述物体体积的几何体，用于计算物体的位置、大小和碰撞等属性。方法用于合并两个包围盒，返回值为合并后的包围盒对象。方法用于计算几何体的包围盒，返回值为包围盒对象。属性用于获取几何体的包围盒，返回值为包围盒对象。
threejs如何显示box的包围盒boundingbox？
weixin_73320836的博客
02-25 1214
threejs的boundingbox快速显示
three.js 学习笔记 | 光线投射技术 - 包围盒(碰撞检测)
好好学习天天向上
04-27 2694
如果没有设置则每次调用都会初始化一个新数组。
three.js 包围盒简单应用
weitaming1的博客
08-30 8679
一、包围盒 二、包围盒简单应用： （一）移动模型到合适的位置 计算多个模型组合的group的包围盒 var bbox = new THREE.Box3().setFromObject(group) 将导入的外部模型移动到世界坐标中心。（比较粗糙的，实际上是包围盒的中心移动到世界坐标中心，而非实际模型） 注意点：从代码中看，group.position.set(-x1,-y1,-z1)...
基于ThreeJS的横穿马路碰撞检测效果
03-06
Three.js提供了几何体类，如PlaneGeometry用于创建平面，BoxGeometry或 CylinderGeometry等用于创建立体几何形状。 接下来是碰撞检测的核心部分。Three.js本身并不直接支持高级的物理模拟或碰撞检测，但我们可以...
Threejs渲染3D字体介绍
Jinuss的博客
10-31 1242
本文主要介绍如何在Three.js中加载渲染3D字体以及其实现原理
threejs教程：绘制3D地图（广东省区划图）
Honiler的博客
06-18 2466
threejs的使用教程案例，绘制3D地图（广东省区划图）
113 Three.js的obb （OrientedboundingBox）方向包围盒的使用
现在学习也不晚
08-28 6886
一、包围盒简介： 包围盒是一个简单的几何空间，里面包含着复杂形状的物体。为物体添加包围体的目的是快速的进行碰撞检测或者进行精确的碰撞检测之前进行过滤（即当包围体碰撞，才进行精确碰撞检测和处理）。包围体类型包括球体、轴对齐包围盒（AABB）、有向包围盒（OBB）、8-DOP以及凸壳。 包围盒广泛地应用于碰撞检测，比如射击、点击、相撞等，每一个物体都有自己的包围盒。因为包围盒一般为规则物体，因此用它来代替物体本身进行计算，会比直接用物体本身更加高效和简单。 目前广泛应用的是AABB和OBB包围盒，其中AA
THREEJS 第三十七用 Box包围盒
webgpu
07-14 6086
geometry.computeBoundingBox();//得到一个box Object.updateMatrixWorld( true ); box.copy( Object.geometry.boundingBox ).applyMatrix4( Object.matrixWorld ); box.intersectsBox ( box : Box3 ) 要update对应objec...
three.js加载的stl模型的坐标位置(postion)与boundingbox计算的位置不一致怎么办?
敖丙007的博客
01-25 1020
three.js加载的stl模型的坐标位置(postion)与boundingbox计算的位置不一致怎么办?
Three.js杂记（十三）—— 包围盒
苦作舟的空城机
04-29 2397
ThreeJs包围盒Box按照字面理解就是包围一个物体的盒子，那就是一个长方形空间。可以用于碰撞检测、物体选择、可视化剔除等功能。
Three.js通过不规则路径生成墙体
漫漫漫漫的博客
12-23 6675
Three.js通过不规则路径生成墙体 在一些3D场景的搭建中，经常会遇到图中通过墙体来分割内容的效果，目前Threejs提供的Geometry类型还无法直接处理一些不规则墙体的搭建 生成算法 通过BufferGeometry基础图形搭建 通过路径解析算法，构建出所有需要渲染的面 支持三维路径进行构造 /** * option => * params height path material * 通过path构建墙体 * **/
Three.js获取模型内部children子模型真实位置信息的方法
小小只程序媛
05-16 2800
Three.js获取模型内部children子模型真实位置信息的方法；computeBoundingBox()；computeBoundingSphere()
WEB 3D技术 three.js 解决几何体移动后 包围盒还留在原地问题
weixin_45966674的博客
01-08 618
几何体对象的boundingBox字段值.applyMatrix4参数 Mesh出来的实例对象下的 matrixWorld 字段。我们可以通过 updateMatrixWorld和applyMatrix4的世界坐标更新举证解决。简单说 Mesh出来的实例对象.updateMatrixWorld 两个参数都为true。然后 通过 position 改变物体的位置 例如 这里我们改它的x轴。不过记得修改位置坐标的代码 一定要比举证的代码先执行 否则无效。我们最基础方式 创建的包围盒。
threejs包围盒的应用
yunduanzhijie的博客
01-05 4756
1、可以当作场景边界的判定值 2、用于相机飞行的参考值 3、物体碰撞的载体 4、不规则物体的体积判断 5、不规则物体的中心点计算（group更好用）
three.js实现几何体半斤计算
最新发布
07-23
在three.js中，几何体通常有包围盒（bounding box）和包围球（bounding sphere）的概念，用于描述几何体在空间中的范围。 参考用户提供的引用[2]中的代码片段，涉及到了相机控制和位置计算，其中使用了`radius`...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值