Pascal Editor 是一款基于 Web 的开源 3D 建筑编辑器，它允许用户直接在浏览器中创建、编辑和导出三维建筑模型。
该项目采用 MIT 开源协议，完全免费且开放，部署在 editor.pascal.app 供用户在线体验。目前，其在 GitHub 已获得超过 7.5K 的 star 数，展现了其受欢迎程度和社区认可度。
它不仅仅是一个简单的 3D 查看器，而是一个架构严谨、功能完备的参数化建筑建模工具，旨在为建筑师、设计师和开发者提供一个高性能的在线 3D 创作平台。
功能特点
Pascal Editor 提供了完整的建筑建模工作流：
核心建模功能
用户可以从零开始绘制墙体、楼板、屋顶，划分功能区域（Zone），并在场景中放置门窗、家具等各种物品。编辑过程支持层级化管理，从场地、建筑、楼层到具体构件，逻辑清晰，便于管理复杂项目。
模型导入导出
支持将生成的模型导出为通用的 glb 格式，便于在其他 3D 软件或引擎中使用。同时，也允许用户上传已有的 glb 模型进行二次编辑，这大大增强了工具的灵活性，使其能融入现有工作流。
高性能实时渲染
编辑器基于现代 Web 图形技术构建，利用 WebGPU 渲染器提供流畅、逼真的 3D 可视化效果。WebGPU 作为下一代 Web 图形 API，能够更好地释放 GPU 性能，确保了在复杂建筑场景下依然有流畅的交互与渲染体验。
完整的编辑与状态管理
内置了撤销/重做功能，支持将场景状态持久化保存。用户界面直观，提供了工具栏和清晰的交互逻辑，方便用户进行绘制、选择、修改、复制、删除等所有基础操作。
核心创新
Pascal Editor 在架构和实现上有多项创新，巧妙地解决了在 Web 端进行复杂 3D 几何实时编辑的性能与工程难题。
数据驱动渲染与动态注册机制
编辑器将场景中的所有物体抽象为统一的“节点”（Node），并构建了节点树结构。通过一个全局的注册表（Registry），系统能够将数据节点与对应的 Three.js 渲染对象实时绑定。这意味着当数据发生变化时，视图可以高效、精准地更新，而无需遍历整个场景图，极大地提升了响应速度。
系统驱动的按需几何更新
与传统即时渲染模式不同，编辑器引入了“系统”（Systems）概念。例如，墙体系统（WallSystem）、楼板系统（SlabSystem）会持续运行，监听相关节点数据的变化，并仅更新受影响的几何部分。这种按需更新的机制避免了不必要的计算，是保障复杂场景流畅运行的关键。
内置空间计算与网格管理
为了提升编辑的准确性和用户体验，编辑器内置了空间网格管理器。它可以进行碰撞检测和放置验证，确保家具等物品被正确放置在楼板上而不会穿模；同时自动计算楼板高程，使物品能对齐到正确的高度，简化了用户操作。
清晰的分层架构设计
项目采用单体仓库（Monorepo）架构，将核心逻辑、渲染引擎和用户界面彻底分离：
- 核心层：负责定义数据模型、管理整个场景的状态，并处理所有几何生成逻辑。它是整个应用的“大脑”。
- 渲染层：专门负责将数据转换为 3D 对象，处理相机、光影和后期效果。它基于强大的 React Three Fiber 和 Three.js 构建。
- 应用层：提供用户交互界面和编辑器特定的业务逻辑。
这种清晰的分离使得各层可以独立开发、测试和维护，不仅提高了代码的清晰度和可维护性，也为社区贡献和功能扩展提供了便利。
应用场景
在线建筑与室内设计
建筑师、室内设计师或学生无需安装庞大的专业软件，即可在浏览器中快速搭建建筑三维原型，进行空间规划、材质尝试和设计演示，非常适合方案初期推敲和快速汇报。
教育与技术学习
该项目是学习现代 Web 3D 开发、数据驱动架构和性能优化技术的绝佳范例。开发者可以通过它深入理解复杂状态管理、实时几何处理与高效渲染的结合方式，是一个高质量的 开源 学习资源。
轻量级模型处理与协作
用户可以对现有的 3D 模型进行快速修改、添加标注或构件，并导出用于汇报、分享或进一步深化设计。这种轻量化特性适合需要快速迭代和远程协作审查的场景。
总之，Pascal Editor 通过其创新的数据驱动架构和系统化更新策略，在纯浏览器环境中实现了堪比桌面应用的复杂 3D 建模能力。它不仅是一个实用的工具，也为 Web 端图形应用开发提供了宝贵的设计思路。如果你对 Web 3D 或建筑可视化感兴趣，这个项目值得深入研究。更多技术细节和项目动态，欢迎在 云栈社区 的相关板块与我们交流。
项目地址：
GitHub：https://github.com/pascalorg/editor
发表于 3 小时前
|
查看: 4|
回复: 0
