从几张图纸做出数字孪生 — 完整复现教程
客户就给了几层平面图 + 一张门头照,没 CAD、没模型、没 BIM。
这套流程只用 4.5 小时:GPT-6 读图 → Blender 建模 → 实拍贴图 → Three.js 渲染
以下每一步都附可直接复制的提示词和实操技巧。
准备:你手里的材料
| 材料 | 数量 | 说明 |
|---|---|---|
| 建筑平面图(手机拍照或截图) | 每层 1 张 | 地下一层~四层,越清晰越好 |
| 建筑外观照片 | 1 张起 | 门头/立面,用来做贴图 |
| (可选)现场视频 | 1 段 | 补视角细节 |
技巧①:图纸拍歪没关系,GPT-6 能理解透视畸变;但别拍反光(玻璃/屏幕反光会糊掉线条)。尽量拍正,桌面摊平拍。
第 1 步:GPT-6 读图 → 结构化数据(15 分钟)
把每张平面图发给 GPT-6,用下面这个提示词:
【角色】你是资深建筑建模师。
【任务】逐层分析我发给你的建筑平面图,输出结构化数据。
【输出格式】
- 层名:
- 房间清单(名称/大致尺寸/数量)
- 墙体结构说明(承重墙位置/厚度规律)
- 门窗位置与数量
- 特殊结构(楼梯/电梯井/机房/阳台)
【要求】全部用表格输出;看不清楚的地方标注"不确定",不要瞎编。
技巧②:一次只发一层图,让它逐层出表,最后再让它汇总五层结构 + 检查楼层是否对齐。直接丢 5 张图一起发,AI 容易串层。
技巧③:让 AI 输出完自己找矛盾——"检查楼上楼下楼梯位置是否对齐、外墙是否在同一轴线",这是人工建模最容易返工的坑。
产出:每层的墙体/门窗/房间数据表(复制到记事本备用,Blender 建模时对照)。
第 2 步:AI 通过 Blender MCP 自动建模(2.5 小时)
不用手动描墙。装一个 Blender MCP 插件,让 AI 直接驱动 Blender 建出整栋楼的结构。
2.1 安装 Blender MCP(一次性)
# 1. 装 Blender(免费开源):https://www.blender.org/download/
# 2. 装 uv(Python 包管理器):https://docs.astral.sh/uv/ 按官方指引安装
# 3. 安装 Blender MCP 插件(项目地址:https://github.com/ahujasid/blender-mcp):
uvx blender-mcp install-addon
# 4. 在 Blender 里启用:
# 编辑(Edit) → 偏好设置(Preferences) → 插件(Add-ons)
# → 勾选 "Interface: MCP for Blender"
# 5. 连接:
# Blender 3D 视口按 N → 找到 "MCP for Blender" 标签页
# → 点击 "Start MCP Server"
2.2 给 AI 建模提示词(把第 1 步的数据表 + 平面图一起丢给它)
【任务】你现在通过 Blender MCP 操作 Blender,根据以下材料建出一栋
五层建筑的完整结构模型:
1. 结构数据表(见下,GPT-6 已分析完的墙体/门窗/房间信息)
2. 平面图图片(在 {图片路径},已作为参考图加载)
【要求】
- 先从地下一层开始,逐层向上建(首层→二层→三层→四层)
- 墙体按数据表中的厚度和位置建模,层高统一用 {3.3}m
- 每层建完用窗口截图反馈一次,等我确认再建下一层
- 门框窗框开口尽量用布尔/挖洞实现,保证后面贴图不穿模
- 全部完成后整理命名:每层一个 Collection(L1/L2/L3/L4/B1)
2.3 让 AI 用门头照片辅助建模
门头照片不只是贴图——先把照片喂给 AI,让它读出门头结构(雨棚/立柱/招牌位/玻璃幕墙范围),建模时直接体现:
【补充】这是一张门头实拍照片({路径}):
- 请识别门头结构:雨棚、立柱、招牌位置、玻璃幕墙范围、入口尺寸
- 建模时按这些元素在首层立面还原,尺寸按与楼体的比例推算
- 招牌位留出平整面,后续直接贴照片
技巧④:MCP 建模先让 AI「查场景」——问它当前 Blender 里有什么,确认 MCP 通了再下建模指令,别直接开建不响应。
技巧⑤:逐层确认——每建一层让 AI 截图反馈,五层叠上去对不齐是 MCP 建模最常见的翻车点,逐层看能第一时间发现。
技巧⑥:复杂结构手动补——AI 建的楼梯/异形结构可能粗糙,建完用 Blender 手动微调这几处即可,主体结构(墙/梁/板)AI 完全够用。
产出:五层结构体完整模型(.blend 文件),每层一个 Collection,首层含门头结构。
第 3 步:门头实拍 → 立面贴图(40 分钟)
- 门头照片导入 Blender(Shift+A → Images as Planes)
- 裁剪:Edit Mode 把平面形状调整到只留立面范围
- 贴到模型外立面:选择外墙面 → 材质面板新建材质 → Base Color 选「Image Texture」→ 选门头照片
- 调整 UV 让照片对齐墙面尺寸
技巧⑦:招牌/Logo 区域单独切一块贴(比整图拉伸清晰);照片如果有透视变形,先用 PS/美图裁正再贴。
产出:真实感门头,模型"一眼就是真楼"。
第 4 步:Three.js 网页渲染(数字孪生的"活"版本)
把 Blender 模型导出为 GLB,在网页里能转、能点、能切楼层:
Blender: File → Export → glTF 2.0 (.glb) → 勾选 "Z Up" 和 "Apply Modifiers"
网页代码(Three.js 加载 GLB,约 30 行):
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/loaders/GLTFLoader.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/controls/OrbitControls.js"></script>
</head>
<body style="margin:0">
<script>
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x0a0e1a);
const camera = new THREE.PerspectiveCamera(45, innerWidth/innerHeight, 0.1, 1000);
camera.position.set(30, 20, 30);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(innerWidth, innerHeight);
document.body.appendChild(renderer.domElement);
new THREE.OrbitControls(camera, renderer.domElement);
// 加载数字孪生建筑模型
new THREE.GLTFLoader().load('building.glb', (gltf) => {
gltf.scene.traverse((mesh) => { // 遍历所有网格
if (mesh.isMesh) {
mesh.material.transparent = true; // 半透明,能看内部
mesh.material.opacity = 0.7;
}
});
scene.add(gltf.scene); // 加入场景
});
scene.add(new THREE.AmbientLight(0xffffff, 0.6)); // 环境光
scene.add(new THREE.DirectionalLight(0xffffff, 1)); // 主光
(function animate() { // 渲染循环
requestAnimationFrame(animate);
renderer.render(scene, camera);
})();
</script>
</body>
</html>
技巧⑧:楼层切换 = 给每层建模时分组(Layer Group),网页里用 group.visible = true/false 切换显示,就是"看内部结构"的效果。
技巧⑨:体积太大卡顿就导出时 Apply Modifiers + 按材料合并网格;面数控制在 50 万以内。
一图总结整个流程
客户素材(平面图×5 + 门头照×1)
│
▼
① GPT-6 读图 ──→ 墙体/门窗/房间数据表(15min)
│
▼
② Blender 底图描墙 → 挤出 → 镜像/开洞 → 逐层对齐(2.5h)
│
▼
③ 门头实拍 → 立面贴图(40min)
│
▼
④ 导出 GLB → Three.js 网页交互渲染(1h)
│
▼
✅ 数字孪生:半天交付
核心思路:AI 干最费眼力的读图,Blender 干结构,实拍照片干真实感,Three.js 干交互。 别让 AI 建模(它粗),也别让 AI 读图(你累)。
评论一下?