标签:# WebGL

一个 index.html 搞定 CAD 与 3D 漫游:floorplan-3d 的原生 WebGL 架构与程序化建模实录

在前端工程动辄被 Webpack、Vite、数以万计的 npm 依赖与庞大运行时框架层层包裹的今天,你是否还记得最初打开一个纯 HTML 文件即可在浏览器运行复杂交互应用的纯粹与震撼?开源项目 floorplan-3d 给出了一个教科书级别的范例:全站仅由一个 185 KB 的单体 index.html 构成,没有多余的构建流水线与外部依赖包,却完整实现了一套毫厘级 2D CAD 户型设计器与逼真沉浸的 Three.js 3D 第一人称漫游引擎。

从 2D 矢量平面布置、家具贴墙磁性吸附、非承重墙拆改、高斯多边形算量到 3D 剖切建筑挤出、程序化家具参数建模、日照光影与动态门体碰撞,本文将深度剖析其架构设计精髓与底层图形学实现细节。