这个知识点99%的前端都没有听过,不信你进来看?

简介: 这个知识点99%的前端都没有听过,不信你进来看?

我可不是标题党哦,来!聪明的你请停下脚步,听我灵魂一问:

你知道AABB是什么吗?

哈哈哈,我猜你大概率一脸懵逼。

不服气的你赶紧打开百度:

image.png然后你愣住了。好家伙,沐洒你一个技术人员,跟我在这玩成语?“不不不,沐老师肯定不是在教我们成语。”一些不相信百度的高端玩家,于是打开小火箭🚀,在Google上再次搜索:

image.png


嚯!好嘛,Google给我搜出个非盈利性组织……

好啦,不卖关子啦,我今天既不是要说成语接龙,更不是要聊什么非盈利组织,我要说的AABB其实是这个:

image.png


AABB,全称Axis-Aligned Bounding Boxes,中文直译出来就是“轴对齐包围盒”,参考下MDN的解释:image.png如图所示,AABB呢,其实是一个立体几何概念,起源于数学,但成熟于游戏开发,主要是用于解决3D空间里不同实体的碰撞检测问题。image.png前阵子看过一个视频,讲虚幻引擎5Unreal Engine)的作品为什么画面如此真实自然,其中一个原因说,是因为虚幻5实现了非常优秀的光线追踪算法。没错,光线追踪(Ray Tracing),这门高深的学问,也是基于AABB来展开的。总之,AABB是3D问题的基础,虽然AABB本身不是什么高难度的东西,但是你如果不知道这个概念,那么你面对3D空间的很多问题都是抓瞎的,很容易陷入用2D思维解决3D问题的陷阱,进而产生很离谱的错误。那我作为一个前端,为什么会关注到这个领域的知识的呢?那当然是因为我在做的项目(自动驾驶点云标注)啦!之前我写过一篇文章《当前端遇到了自动驾驶》,非常详细的介绍了我在这个项目里遇到的一个3D问题的整体解决过程。

由于内容过于干燥,在公众号这里的阅读量并不高,但在知乎上,却意外获得了大量的收藏。

image.png


虽然有人反馈太技术了看不懂,但也有不少小伙伴在后台给我留言,说那篇文章很有意思,前端在自动驾驶领域的实践很新鲜有趣,让我多写点相关的东西。

image.png

恰好最近又遇到了一个又意思的场景:碰撞检测,我感觉这东西又可以跟大家聊聊了。

不过考虑到这件事本身也是有一定的理解门槛,所以我今天打算先水一篇,给大家入个门,介绍下AABB是个啥,然后丢点学习链接。感兴趣的朋友可以先私下研究研究,同时可以期待下我的下一篇文章,给你们聊聊我这次又遇到了什么难题,以及整体的解决思路。好啦,文章标题没唬人吧?有多少前端小伙伴是第一次听说AABB的?评论区告诉我。

学习资料:

  • 3D collision detection —— (https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_collision_detection)
  • Bounding volume collision detection with THREE.js —— (https://developer.mozilla.org/en-US/docs/Games/Techniques/3D_collision_detection/Bounding_volume_collision_detection_with_THREE.js)
  • BVH:Bounding volume hierarchy —— (https://en.wikipedia.org/wiki/Bounding_volume_hierarchy)
  • Collision detection —— (https://en.wikipedia.org/wiki/Collision_detection)




全文完。

目录
相关文章
|
7月前
|
前端开发 网络协议 JavaScript
|
7月前
|
JSON 前端开发 网络协议
前端知识点-----跨域
前端知识点-----跨域
74 0
|
3月前
|
Web App开发 前端开发 Linux
「offer来了」浅谈前端面试中开发环境常考知识点
该文章归纳了前端开发环境中常见的面试知识点,特别是围绕Git的使用进行了详细介绍,包括Git的基本概念、常用命令以及在团队协作中的最佳实践,同时还涉及了Chrome调试工具和Linux命令行的基础操作。
「offer来了」浅谈前端面试中开发环境常考知识点
|
4月前
|
缓存 运维 前端开发
前端必备的运维知识点
【8月更文挑战第25天】前端必备的运维知识点
98 1
|
4月前
|
缓存 负载均衡 前端开发
前端必会的nginx知识点
【8月更文挑战第22天】前端必会的nginx知识点
87 0
|
7月前
|
JavaScript 前端开发 Java
前端知识点03(JS)
前端知识点概览:了解JS中的this指向,包括全局、函数、new、apply/call/bind及箭头函数的规则。理解script的async和defer属性对脚本加载和执行的影响。探讨setTimeout和setInterval的用法及其在性能上的考量。ES6与ES5的区别在于新语法特性,如let/const、箭头函数、模板字符串、模块化、类和继承等。此外,ES6还引入了Symbol、解构赋值、默认参数、Map/Set和Generator等功能。别忘了点赞和支持作者哦!
53 1
|
7月前
|
前端开发 NoSQL JavaScript
前端知识点小结--mongodb,保准看明白
前端知识点小结--mongodb,保准看明白
|
JavaScript 前端开发 数据库
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)-3
前端常见知识点汇总(ES6,Vue,axios,Node.js,npm,webpack)
108 0
|
7月前
|
缓存 JavaScript 前端开发
【前端】Vue2知识点大全!
【前端】Vue2知识点大全!
246 1
【前端】Vue2知识点大全!
|
7月前
|
前端开发 JavaScript API
【前端】Vue3知识点合集
【前端】Vue3知识点合集
114 0
【前端】Vue3知识点合集