我用 GPT-6 给江南大学建了个 3D 沙盘我用 GPT-6 给江南大学建了个 3D 沙盘我的博客网站最近多了个

我用 GPT-6 给江南大学建了个 3D 沙盘

我的博客网站最近多了个页面：/campus。打开是江南大学蠡湖校区的 3D 沙盘，能旋转、缩放、搜索校内 99 个地点，有日夜和实时天气，图书馆的弧形翼楼、北大门的牌坊、体育馆的浅拱屋顶都在。效果如下图所示：

点击建筑之后可以查看对应建筑的信息：（当然也可以直接通过搜索框输入地点来查找对应的建筑）

通过点击右上角的下载原图，可以下载到我参考的校园地图。

搭建这个校园沙盘的想法

最近 openai 推出了最新模型 gpt6-astra，而且网上用它来使用 Blender 的呼声很高，效果很不错。刚巧，最近赶上开学季了，新生来到学校我想到的是他们可能对校园不熟，而且我之前小红书上面有放过如下的校园地图，但是我感觉上面的数字其实不是很明显，找起来其实挺麻烦的，所以我萌生了一个想法：用 gpt6-astra 搭建一个 3D 版本的江南大学沙盘，提供搜索功能，让新生可以快速定位对应的建筑。

动手前我到处找校园的地理数据，最后发现最靠谱的资料是学校后勤保障处发布的2024 版校园地图——一张插画风格的鸟瞰图（也就是我之前在小红书上面发布的图片），上面标了 99 个编号地点，外加 14 个候车亭对应的 16 个图面点位。在这里插入图片描述

这张图决定了整个项目最关键的一个早期决定：**坐标用图面归一化坐标，不用经纬度。**我把原图的标注位置换算成 1626×1080 的归一化网格，每个地点一个稳定 ID（place-001 到 place-099）。从此搜索、分类、分享链接全部挂在 ID 上，后面不管建筑外观怎么改、位置怎么挪，ID 永远不变。事后看这是最值的一个决定——后来我推翻重做了两次建筑外观，点位数据一行没动。

当然也要注意一点：图面坐标是示意，不是测绘，包括我们的沙盘也是。沙盘里两栋楼隔多远，和现实中差多远，没有任何保证。后续可能通过不断的优化会提高精度，但目前只是参考。

技术栈

建模：Blender 5.2 + Python 脚本（由 gpt6-astra 驱动生成）
网页：Next.js 15 + React 19 + three.js
模型格式：GLB + Draco 压缩
天气：Open-Meteo 免费接口

整体流程

流程其实就四步：先用最简单的几何把页面跑通，再逐栋建模，然后把模型换进去，最后加上天气和日夜。

第一步：火柴盒版

我没有一上来就纠结建筑好不好看，第一版全部是 three.js 里的盒子：一个地点一个方块，加上窗户贴条。这一版确实丑，但搜索、旋转、缩放、点击定位这些交互全都先跑通了。交互没问题时，后面换模型就是纯粹的"换皮"，不用担心把页面改坏。

第二步：Blender 建模

99 栋楼手工建模不现实，我的做法是让 gpt6-astra 写 Python 脚本在 Blender 里生成建筑——描述"这栋楼是几层、入口在哪、屋顶什么形状"，脚本负责搭出来。先拿图书馆练手（弧形翼楼、双组竖窗、截顶坡屋顶，复杂度够高，能验证这套方法行不行），跑通之后分批铺开，最终 99 处全覆盖。