floorplan-3d 是一款用原生 HTML、CSS、JavaScript 写成的户型布置工具，以 MIT 协议开源。整个应用只有一个 index.html，没有构建步骤，下载后用浏览器打开就能用：在 2D 平面图上拖家具、改墙体、量尺寸，按 T 键即可切换到 Three.js 渲染的 3D 场景，鸟瞰全屋或第一人称走进房间查看效果。
项目地址：GitHub 项目主页；在线体验：在线演示页
2D 平面布置
画布按原始户型以 1:60 或 1:100 比例显示，尺寸单位为毫米。左侧家具库收录 60 余种家具家电，覆盖卧室、客厅、餐厨、卫浴、家电、书房休闲几大类，拖入画布即可摆放；家具支持拖动、旋转、调整尺寸，贴墙自动吸附。测量工具靠近墙面会自动吸附，按住 Shift 可锁定水平或垂直方向。户型墙体分承重墙与非承重墙，承重墙单独标示，拆墙模式下只能拆改非承重墙。尺寸标注、房间名、家具、网格、承重墙都有独立的图层开关。
3D 鸟瞰与第一人称漫游
按 T 键从 2D 切换到 3D，场景按平面方案重建，提供鸟瞰、斜视、俯视多个视角，点击房间列表可直接飞到对应房间。漫游模式下桌面端用 WASD 加鼠标行走，触屏设备出现虚拟摇杆，走到门前按 E 开门进出；3D 里也能选中拖动家具，改动与 2D 实时同步。场景支持全高墙与剖切墙切换，还有日照时间滑块和夜景灯光，可以观察一天里光线落在地板上的变化。
方案统计与导出
每个房间的面积和套内使用面积会自动统计，换地面材料时数字同步更新。材料库提供木地板、地砖、大理石、水磨石、地毯等选项，选中后按房间面积加 5% 损耗估算造价。方案支持导出 PNG 保存视图，也能导出 JSON 下次导入接着改；操作有撤销重做兜底，方案自动保存在浏览器本地，关掉网页再打开，上次摆的家具还在原处。
上手方法
常用快捷键：T 切换 2D/3D，V、M、X 分别切换选择、测量、拆墙，R 旋转 90 度，Delete 删除家具，Ctrl 加 D 复制，Ctrl 加 Z 撤销，F 适应窗口。想换成自己家户型时，户型数据直接写在 index.html 里，改房间、墙体、窗洞和材料数组即可。首次加载 3D 需联网从 CDN 拉取 Three.js。
下载
关注「软件教程管家」
回复软件名即取即下：网盘下载链接 + 提取码，一步直达，不用再跳转。
本站资源仅供个人学习交流，请勿用于商业用途。软件与资料版权归原作者所有；如有侵权，请通过公众号「软件教程管家」联系我们，我们将在 24 小时内下架处理。查看免责声明 ›
