blueprint3d https://github.com/furnishup/blueprint3d 是一个挺有意思的开源项目， 可以在浏览器里画户型、摆家具、切换 2D/3D 视图。但原项目基于 jQuery 、CoffeeScript 和已经废弃的 Three.js API ，好几年没人维护了，现在基本跑不起来。
自己有个项目需要用到类似功能，找了一圈没有合适的现代替代品，就干脆自己重写了一遍。
demo: https://blueprint3d-modern.vercel.app/
改了什么
原版 → 现版：
- jQuery + CoffeeScript → TypeScript 严格模式 ES Module
- 废弃的 Three.js Geometry API → Three.js r181 BufferGeometry / WebGLRenderer
- tween.js → anime.js v4 （ camera 动画）
- 无持久化 → IndexedDB 本地存储，不需要任何后端
- 仅英文 → 多语言支持（中文简体 / 繁体 / 英文）
- 无 demo → Next.js 15 App Router + React 19 完整 demo
主要功能
- 2D 平面图编辑器：画墙、移动、删除，带吸附和尺寸标注
- 3D 实时预览：可以拖转视角，随时切换 2D/3D
- 家具放置：从分类目录拖拽摆放（床、沙发、桌椅、衣柜、卫浴、门窗等）
- 每件家具可单独调整尺寸、旋转、锁定位置
- 地板和墙面纹理可以按房间独立设置
- 房间模板：空白画布或预设房型直接开始
- 存档/读档：存在浏览器 IndexedDB ，不需要账号，不需要服务器
- 单位制：英寸/英尺、米、厘米、毫米可切换
技术栈
核心库（ src/）是纯 TypeScript ES Module ，可以独立于任何框架使用。
Demo 应用：
- Next.js 15 App Router
- React 19
- Tailwind CSS v4
- shadcn/ui + Radix UI
- Zustand （状态管理）
- Framer Motion （动画）
- next-intl （ i18n ）
仓库地址
原版： https://github.com/furnishup/blueprint3d 重写版： https://github.com/charmlinn/blueprint3d-modern
 | 1 JoeJoeJoe PRO 已 star 感谢分享! |
 | 2 metalvest 3 月 25 日 有合适的现代替代品 https://github.com/pascalorg/editor |
 | 3 linncharm9 OP @metalvest 感谢推荐 |
 | 4 szdubinbin 3 月 25 日 这个项目之前关注过确实挺不错的，用现在的 Ai coding 可能能把里面历史 bug 和 ui 变得更美观一些 |
| 5 linncharm9 OP @szdubinbin 是的 现在重新改写了一下美观多了 也添加了很多家具 |
Select Language