搭飞机太无聊，开发者用“vibe coding”打造出托尔金《魔戒》的交互式中土地图
https://www.techbang.com/posts/128749-ai-vibe-coding-plane-middle-earth-map
一名开发者在横越美国的班机上，趁著美国航空提供的免费机上 Wi-Fi，用 AI 辅助程式
设计的方式，把《魔戒》与《哈比人》世界的地理资讯做成了一张全功能互动地图，并公
开发布在网络上。这件事在知名科技论坛 Hacker News 上迅速引发热烈讨论，截至发稿
时已累积逾两百则留言回应。
从经济舱座位诞生的中土地图
这个专案由开发者 Fraser Marlow 制作，作品名称为“Middle-earth Interactive Map
”，目前部署于 Google Firebase 的静态网站服务，网址为
https://middle-earth-interactive-map.web.app/，任何人都可以免费浏览使用。
Marlow 在文章中描述，他长期奔波于美国东西两岸，在机上有大量的空闲时间。他利用
美国航空提供的免费 Wi-Fi，以“vibe coding”的方式，与大型语言模型反复对话，逐
步把整个专案建立起来。他也坦言，AI 对托尔金作品的了解程度令他惊艳：“LLM 对托
尔金著作的了解量相当可观，能够深入挖掘许多细节，让这个过程非常有趣。”
交互式地图功能一览
打开地图后，使用者可以在一张高分辨率的中土世界全图上自由缩放与拖曳浏览。地图的
互动功能相当丰富，主要包括以下几个面向：
旅程路线追踪：可叠加显示多位主要角色的旅行路线，包含魔戒远征队全体成员（佛罗多
、亚拉冈、波罗莫、梅里与皮肤、甘道夫、咕鲁）、以及哈比人之旅的比尔博路线，路线
以彩色虚线绘制，视觉上一目了然。
事件标记系统：地图上分类标记了来自《精灵宝钻》（Silmarillion）、《哈比人》、《
魔戒》三部曲（魔戒现身、双城奇谋、王者再临）以及附录的重要地点与事件，共涵盖超
过百个标记点，点选后可查看事件说明与相关人物。
时间轴页面：另有一个独立的 Timeline（时间轴）页面，以时序方式列出整个传说年代
记的事件，并可点选直接飞往地图上对应的位置。
距离测量工具：开启“Measure distance”功能后，在地图上点选任意两点，即可换算出
两地之间的英里与里格（leagues）距离。
卫星视图：地图另提供一个概念性的“卫星视图”（Satellite view），由 Stable
Diffusion 的 img2img（图像转图像）功能生成，虽然目前效果仍属粗略，例如海洋呈现
出过于干燥的视觉效果，但已引起不少网友的兴趣与讨论。
技术架构：地图图砖与 Leaflet.js
这张地图的运作原理，其实和你平常用 Google 地图的方式非常相似。当你在 Google 地
图上拉近镜头，画面不会整张重新加载，而是会依照你看的区域，即时拼出一小块一小块
的图片，这种技术叫做“地图图砖”。Marlow 在这个专案中也采用了同样的做法：他先
把一张巨大的中土世界全图，预先切割成数百张小方块图片，并依照不同的缩放程度分别
准备好对应的版本。这样一来，无论你拉近看魔多火山口的细节，还是拉远看整个中土的
轮廓，地图都能快速回应，不会因为加载一整张超大图片而卡顿。
呈现这些图砖的框架，是一套叫做 Leaflet.js 的开源函式库。你可以把它想成是制作互
动地图的“乐高底板”，它处理所有拖曳、缩放、标记点击等互动逻辑，开发者只需要把
图片素材和资料填进去就好。这套工具被广泛用于各种网络地图应用，算是业界相当成熟
的选择。
至于概念性的“卫星视图”，Marlow 则是借助了 AI 图像生成工具 Stable Diffusion，
让它根据原始地图去推测“如果从卫星角度看中土会是什么样子”，再自动生成对应的图
片。目前成果仍很粗糙，海洋看起来像沙漠，部分山脉的质感也不够自然，但这个方向本
身已引起不少网友的兴趣。整个专案的程式码已完整公开于 GitHub（
https://github.com/frasermarlow/middle-earth-map），有兴趣的开发者可以自行参考
或延伸。
旅程路径的平滑化处理
另外，地图上的旅程路线并非直线折线，而是透过 Catmull-Rom spline 插值算法生成的
平滑曲线。程式码中设有距离门槛，仅在相邻两点距离超过一定像素时才启动插值，避免
在近距离点之间产生不自然的曲线循环。这个细节让地图上的旅程路径更贴近手绘风格，
视觉上更加自然。
论坛上的热烈讨论
这个专案发布后，在 Hacker News 上引发多个方向的讨论。
有网友指出，目前地图使用的是第三纪元（Third Age）的版本，这对于标注第一纪元的
精灵宝钻事件来说，在地理上存在一定的误差，因为第一纪元结束后，贝勒尔兰（
Beleriand）地区已沉入大海，根本无法在现有地图上定位。Marlow 也坦承这是一个限制
，并表示若能找到合适的原始素材，不排除未来制作分纪元的版本。
部分托尔金考据派指出了几处地标位置的误差，例如西力斯昂哥（Cirith Ungol，即《王
者再临》中佛罗多被囚禁之处）与日落之窗（Henneth Annûn，法拉墨的藏身地）的座标
标记偏北偏东，与书中描述不符。Marlow 表示已记录下来，将陆续修正。
另有一些网友对“vibe coding”方式的使用带着复杂的情感。有人认为，原本以为开发
者是怀抱对托尔金的热情、亲自钻研每一处细节，但得知是 AI 生成后，那份感觉稍微打
了折扣。Marlow 的回应是：“我完全理解。但实际上，我建造这张地图正是为了亲自探
索托尔金的传说年代记，因为我对它深深着迷。这是我分享所学的方式，整个过程我也学
到了很多。”

通勤还在做side project,怎么跟我一样

只是世界观地图超大没用啊 魔戒是因为设定资料靠北多而且本来就跟地图对得上

是有多无聊成这样

有点类似RAG