Google工程师制作的中国历史时间线地图:江山时序

平时读历史书或者背古诗词的时候,很多人都有过一种对不上坐标的无力感。

看到《水浒传》里写宋江被刺配江州,下意识以为是今天的重庆,查了资料才知道宋代的江州治所在江西九江。

读到五胡十六国和南北朝,满纸的前秦、后秦、西秦、南凉、北凉轮番登场,光靠文字描述在脑子里拼地图,看不了几页就会彻底糊成一团。

最近,软件工程师 Dean Chen 在 GitHub 上开源了一个名为「江山时序」(DeanChensj/jiangshan-map)的中国历史交互地图时间轴网站(在线体验地址:https://deanchen.me/jiangshan-map/)。

它不需要注册账号,也没有任何第三方前端框架依赖,点开网页就是一幅带有宣纸水墨设色质感与古琴背景雅乐的动态历史地图。

项目把从公元前 403 年(《资治通鉴》开篇的周威烈王二十三年「三家分晋」)至今 2430 年间、18 个历史时期的 198 幅多阶段疆域与州郡政区快照、1761 座历代古城、525 条编年大事、351 个帝王年号以及 125 位以上历史人物的生平行迹,全部装进了同一张画布里。

你只要拖动底部的年份滑块、点开任意一座城池,就能直接看清两千四百年来的版图盈亏、治所更迭与古人走过的万里山河。

一玩就是半小时,相当有意思。

江山时序开篇画面:公元前 403 年周威烈王命韩赵魏为诸侯(三家分晋)与战国诸侯并立版图

▲ 江山时序开篇画面:公元前 403 年周威烈王命韩赵魏为诸侯(三家分晋)与战国诸侯并立版图

Part 1

开发过程

第一次拖动这张地图的时间轴时,很难想象它背后的大量多边形拓扑校准与史料考据是由一名开发者在业余时间搭起来的。

项目作者 Dean Chen 先后毕业于上海交通大学和卡内基梅隆大学(CMU)计算机专业,目前在硅谷 Google 担任软件工程师,参与开源基础设施项目 google/adk-python 的开发(个人主页:https://deanchen.me/,GitHub:https://github.com/DeanChensj)。

他在博客自述里提到,自己虽然是个标准的理科生和程序员,但从小最爱翻的就是初高中历史课本里的插图,平时看历史和地理经常考全班最高分,要不是高中政治论述题实在背不下来,当年大概率就去学文科了。

工作之后,他在读渤海小吏的《两晋悲歌》与《南北归一》时,每次看到五胡十六国那一团乱麻似的政权更迭,心里总想做一张能把整部中国历史朝代更替都装进去、拖一下就能看清变迁的交互地图。

今年 7 月,他曾试着做过一个历史地理小游戏原型,做到一半发现自己真正想看的其实还是纯粹的地图本身,便暂时搁置了。

到了 10 月,趁着模型生成能力提升,他重新捡起这个念头,最开始只给 AI 输入了一句很短的提示词:「帮我做一个能够拖动时间轴的中国历史地图。」

第一版跑出来的页面没有山川河流,只有几个由直线和锯齿拼成的粗糙色块,但当拖动底部滑块看到色块随年份伸缩的那一刻,他决定跟这张地图彻底较一回劲。

接下来的两周半时间里,他在深夜和周末密集提交了两百多次代码,一边翻找哈佛大学与复旦大学联合维护的 CHGIS(中国历史地理信息系统)等公开数据集,一边对照《资治通鉴》、各朝正史和谭其骧主编的《中国历史地图集》逐个朝代修补边界。

在排查数据的过程中,他遇到过不少让人哭笑不得的地理乌龙,比如放大地图才发现辽国的都城上京居然被画在了辽国疆域外面,只好回头把辽北疆域和上京道一点点补齐;还有一次发现横跨欧亚的蒙古帝国在罗布泊附近莫名其妙破了个大窟窿,又查了半天史料才把缺口填上。

等把东晋十六国那一段的 20 个阶段快照全部修好后,他对着自己做的地图把《两晋悲歌》重新翻出来读了一遍,以前怎么也分不清的前秦、后秦、西秦与南凉、北凉,这回终于在空间上彻底理顺了。

东晋十六国时期(公元 398 年):北魏迁都平城,后燕、后秦、西秦、南凉、北凉与东晋同屏对峙

▲ 东晋十六国时期(公元 398 年):北魏迁都平城,后燕、后秦、西秦、南凉、北凉与东晋同屏对峙

项目上线之初,他在国内社交平台发帖一度遭遇限流,直到 10 月下旬被技术博主转发后才突然出圈,短短几天就登上了 GitHub Trending 每日热门仓库总榜第二名,目前已经拿到了超过 4600 颗 Star 和 540 多次 Fork。

Part 2

时间和空间维度

不同于把静态历史地图扫描件做成幻灯片的传统图集,「江山时序」围绕时间横轴、地理纵轴与人物行迹三条线索,设计了四套环环相扣的交互视图。

1. 时间横轴

页面底部是一条贯穿公元前 403 年至 2026 年的彩色时间轴,按《资治通鉴》纪年惯例内联展示当年在位君主(含庙号、谥号与姓名)以及 351 个历代年号。

针对战国七雄、汉末三国群雄割据、东晋十六国、南北朝、五代十国以及宋辽金夏并立等分裂时期,地图支持高对比度宣纸设色的多政权同屏呈现,并收录了 110 个割据与周边政权的历史小传。

当你点击右侧编年栏里的重大开疆或失地节点(例如前 316 年司马错灭巴蜀、前 121 年霍去病开河西、648 年唐置安西四镇、1288 年元设宣政院辖西藏、1881 年曾纪泽收复伊犁),版图在切换瞬间的同时,会在原位置留下一圈上一阶段的朱砂色虚线残影,哪一块地是新拓的、哪座城是刚丢的,一眼就能看清。

随着镜头放大,地图会渐进浮现历代的一级政区(汉刺史部、唐道、宋路、元明清行省)与二级州郡边界,鼠标悬停在任意州府(如明永乐十三年的「应天府」)上方,就会弹出该政区的当朝归属与现代省份对照,顶部图层菜单还支持一键开启「现代省界」透视镜以及黄河改道、云梦泽与罗布泊消长、长城、大运河、丝绸之路与郑和航线等专题图层。

明永乐十三年(1415 年):悬停查看应天府政区边界、明长城、京杭大运河与郑和下西洋航线

▲ 明永乐十三年(1415 年):悬停查看应天府政区边界、明长城、京杭大运河与郑和下西洋航线

2. 地理纵轴

在地图上直接单击任意一座古城、名关,或者在空白处双击鼠标,右侧就会展开一张「点地溯源 · 古今政区沿革」卡片。

卡片顶部会给出这座城市专属的四字风华题记与历史小传,下方则按时间顺序完整列出它从战国、秦郡、汉刺史部、唐道、宋路一路到元明清府州和现代省市的 18 个时期沿革,曾经作为王朝都城的朝代还会挂上醒目的红色「王朝都城」徽章。

更实用的是,卡片把 726 条城池定点历史大事直接嵌进了对应的朝代行里,比如在盛唐开元二十九年(741 年)点开长安,不仅能看到它历经九朝建都的政区变迁,还能顺着时间线直接点选发生在这里的「玄武门之变」「玄奘自天竺载经归长安译经」等 61 条史事,点击任意一条事件,整张地图就会立刻穿越回那一年。

盛唐开元二十九年(741 年):点开长安展开两千四百年古今政区沿革与 61 条定点史事纪要

▲ 盛唐开元二十九年(741 年):点开长安展开两千四百年古今政区沿革与 61 条定点史事纪要

这套「点地溯源」机制还专门解决了古籍阅读中最头疼的「跨朝代同名异地」问题。

以「江州」为例,秦汉与三国时期的巴郡江州在今天的重庆,而东晋、唐、宋时期的江州治所则在浔阳(今江西九江),当你定位到北宋崇宁元年(1102 年)查看白居易当过司马、宋江题过反诗的江州时,地图会精准落针在江西九江的浔阳城,并高亮出北宋江南西路江州的辖境范围。

北宋徽宗崇宁元年(1102 年):精准消歧定位宋代江州治所浔阳(今江西九江)并高亮江州州界

▲ 北宋徽宗崇宁元年(1102 年):精准消歧定位宋代江州治所浔阳(今江西九江)并高亮江州州界

除了历代城邑,地图还用专属的汉阙城楼图标标出了函谷关、潼关、剑门关、雁门关、玉门关、阳关等 20 座天下雄关(附有山脉水系扼守形势详解),并收录了赤壁、垓下、淝水、五丈原、兰亭、滕王阁、蓝关等 186 处诗词名胜与古战场。

东晋太元八年(383 年):点击淝水古战场查看前秦与东晋淮水对峙局势及历代淮南战事沿革

▲ 东晋太元八年(383 年):点击淝水古战场查看前秦与东晋淮水对峙局势及历代淮南战事沿革

3. 人物与器物轨迹

点开左上角的万能搜索框(快捷键 / 或 Cmd/Ctrl + K),输入任意帝王将相或文豪名僧的名字,就能开启「点人溯事」人物生平纪事面板。

地图内置了秦始皇、张骞、霍去病、诸葛亮、玄奘、李白、杜甫、白居易、韩愈、苏轼、辛弃疾、文天祥、王阳明等 125 位以上历史人物的生平轨迹,用朱砂游丝弧线把他们一生的关键落点串在山河版图上,每切换一站,底部的年份、在位君主、王朝版图与原典名句都会跟着古人的脚步同步流转。

点人溯事:苏轼从眉州出川、汴京应试到黄州、惠州、儋州的宦海贬谪生平行迹

▲ 点人溯事:苏轼从眉州出川、汴京应试到黄州、惠州、儋州的宦海贬谪生平行迹

如果你好奇两位或三位历史人物一辈子到底在哪些时空产生过交集,还可以在搜索框或网址里同时传入多个名字(如 李白,杜甫、李白,杜甫,高适、诸葛亮,司马懿 或 曹操,刘备,孙权),开启「同途相逢 · 时空平行对照」模式。

系统会自动把多人的生平大事合并到同一条时间轴上,并通过时空距离匹配算法(年份差不超过 3 年、空间距离在 45 公里以内)自动识别出他们的共同经历:比如输入李白与杜甫,地图不仅会用红蓝双色圆点分别标出两人的独自漫游轨迹,还会用红蓝双色胶囊高亮出唐天宝三年至四年(744—745 年)两人在洛阳初遇、同游梁宋睢阳(今河南商丘)以及齐鲁任城(今山东济宁)话别的三次千古际会。

多人同看模式:李白与杜甫生平轨迹同屏叠加,自动标出洛阳、睢阳与任城三次「同途相逢」

▲ 多人同看模式:李白与杜甫生平轨迹同屏叠加,自动标出洛阳、睢阳与任城三次「同途相逢」

甚至连「传国玉玺」这件传世国器,作者也专门为它整理了一条从公元前 283 年赵惠文王得楚和氏璧、前 221 年秦始皇命李斯篆刻玉玺、王莽逼宫摔崩一角,一路流转十朝直至公元 936 年后唐末帝李从珂携玺自焚于洛阳玄武楼的完整时空履历。

点物溯史:传国玉玺从战国邯郸完璧归赵到五代洛阳玄武楼失传的十朝流转轨迹

▲ 点物溯史:传国玉玺从战国邯郸完璧归赵到五代洛阳玄武楼失传的十朝流转轨迹

4. 舆图寻址挑战

看完了历史轨迹,要是想检验一下自己的历史地理水平,可以点击搜索框引导栏右下角的「古地名小试」,开启「舆图寻址」挑战模式。

进入挑战后,地图会隐去所有城池名称,只保留山川水系与当朝疆域轮廓,系统按难度梯度给出十道题(例如标定西汉时期的「武威」或六朝古都「建康」),并附上不剧透现代城市名的当朝掌故线索;你在地图上凭水系直觉扎针确认后,页面会画出同心圆环计算实际偏差公里数,十道题答完还会根据总分授予「太史令 · 舆图大家」「职方郎中」或「州郡从事」等传统官阶封号。

舆图寻址挑战模式:隐去全图文字标注,仅凭当朝掌故与山河水系盲猜古地名位置

▲ 舆图寻址挑战模式:隐去全图文字标注,仅凭当朝掌故与山河水系盲猜古地名位置

此外,为了方便快速查阅,项目还在 /topics/ 目录下内置了 34 篇静态历史地理专题图志,把 18 个朝代的疆域政区总表、7 位代表人物的生平考据、长平与赤壁等著名战役以及经典唐宋诗词路线整理成了带古今地名对照表的独立百科页面。

江山时序内置的 34 篇静态历史地理百科与专题图志总目录

▲ 江山时序内置的 34 篇静态历史地理百科与专题图志总目录

Part 3

技术细节与本地部署玩法

「江山时序」在工程设计上最有巧思的一点,是它从一开始就为大语言模型与 AI 工具设计了一套免经纬度的「零坐标双参数 URL 协议」。

平时我们让 AI 生成地图或地理可视化时,最怕模型自己瞎编经纬度坐标,往往差出几百公里甚至掉进海里。

而在「江山时序」里,AI 完全不需要猜测任何经纬度数字,只需要从史料或古诗词里考据出两个纯文本语义参数——year(年份,公元前用负数表示)和 place(古今地名列表),拼接到网址后面,前端引擎就会自动完成古今地名解析、镜头包围盒缩放、疆域渲染与轨迹连线:

1. 单点寻址(0D):比如读到韩愈《左迁至蓝关示侄孙湘》里的「雪拥蓝关马不前」,考据出那是唐宪宗元和十四年(819 年)韩愈贬潮州途经秦岭蓝关,直接访问 https://deanchen.me/jiangshan-map/?year=819&place=蓝关,地图就会自动切到 819 年的唐代版图,落针在陕西蓝田关并展开沿革卡片。

2. 同年多站路线(1D):读到杜甫在唐代宗广德元年(763 年)写下的《闻官军收河南河北》「剑外忽传收蓟北……即从巴峡穿巫峡,便下襄阳向洛阳」,只需传入 https://deanchen.me/jiangshan-map/?year=763&place=剑外,巴峡,巫峡,襄阳,洛阳,地图就会在 763 年版图上自动画出从四川梓州(剑外)顺江出峡北上洛阳的 5 站朱砂飞白弧线,并算出全程约 991 公里。

3. 跨年多站路线(4D):读到苏轼《自题金山画像》的「问汝平生功业,黄州惠州儋州」,将年份与地点一一对应传入 https://deanchen.me/jiangshan-map/?year=1079,1080,1094,1097&place=湖州,黄州,惠州,儋州,地图路标会自动标出每一站的贬谪年份,点击任意一站还能同步切换当年的天下局势。

4. 多路会师路线(分号分隔):遇到赤壁之战这种多方进军的战役,用分号隔开不同行军路线传入 https://deanchen.me/jiangshan-map/?year=208&place=许昌,江陵,赤壁;柴桑,樊口,赤壁,画面上就会同时用红蓝双色弧线画出曹操南下与孙刘联军逆江会师的两路进军态势。

同年多站路线自动渲染:公元 763 年杜甫《闻官军收河南河北》从剑外经巴峡、巫峡、襄阳返洛阳的五站归乡路

▲ 同年多站路线自动渲染:公元 763 年杜甫《闻官军收河南河北》从剑外经巴峡、巫峡、襄阳返洛阳的五站归乡路

分号多路会师语法:公元 208 年赤壁之战曹操自许昌南下与孙刘联军自柴桑会师的双色进军图

▲ 分号多路会师语法:公元 208 年赤壁之战曹操自许昌南下与孙刘联军自柴桑会师的双色进军图

为了让你的 AI 能直接调用这套能力,仓库原生提供了三套零依赖工具:

1. 本地 MCP 服务(scripts/mcp_server.js):纯 Node.js 原生模块实现,单次查询耗时不到 5 毫秒,对外提供 inspect_place(查地点沿革)、inspect_person(查单人或多人交集)和 search_atlas(跨全朝代检索)三个标准工具。

2. Agent 技能包与截图 CLI(skills/jiangshan-atlas/):内置的 jiangshan.py 脚本支持在终端直接用 –inspect 获取结构化历史地理 JSON,或加上 –out 参数调用本地无头浏览器一键渲染出 2880×1800 分辨率的高清古舆图 PNG。

3. 网页嵌入模式(&embed=1):在任意分享链接后面加上 &embed=1(还可配合 from、to 锁定时间轴区间或 autoplay=1 自动巡礼),就能直接通过 <iframe> 嵌进个人博客、Notion 笔记或历史教学课件里。

如果你平时喜欢读史书、给孩子讲古诗词,或者想用这套图集做历史图文与教学课件,可以打开 Claude Code、Codex 或 WorkBuddy,把下面这段提示词复制给你的 AI,让它帮你把项目部署到本地并自动安装好历史舆图技能:

请帮我克隆 https://github.com/DeanChensj/jiangshan-map 仓库到本地,并完成以下配置与查询任务:
1. 环境配置:将仓库内的 skills/jiangshan-atlas 技能目录安装到我本地的 AI 技能目录中,并配置 scripts/mcp_server.js 作为本地 MCP 服务(或直接使用 skills/jiangshan-atlas/scripts/jiangshan.py 脚本)。
2. 历史考据与出图:请针对【填写你想探究的诗词、战役、古籍片段或历史人物,例如:辛弃疾北固亭怀古时的南北局势 / 文天祥抗元转战路线 / 诸葛亮与司马懿的正面交锋地】,先考据出准确的代表年份(year)与消歧后的古今地名(place)或人物标识(person)。
3. 执行验证:调用 jiangshan.py 的 –inspect 参数核验当朝政权、州郡归属与名城沿革,生成可点击的在线深链 URL,并使用 –out 参数在本地渲染一张高清古舆图截图保存给我。

Part 4

最后

在作者那篇回顾文章的评论区里,有两条读者留言让人印象很深。

一条是一位家长留下的简短回复:「我儿子被这网站硬控好几天。」

另一条则写道:「拖动时间轴的那一刻,朝代不再是课本上的名词,而是脚下可以反复往返的山河,好工具让记忆有了坐标。」

以前读到辛弃疾在镇江北固亭写下「何处望神州,满眼风光北固楼」,或是看到谭嗣同、文天祥笔下的山河破碎,往往只觉得文字慷慨激昂。

直到你在这张宣纸地图上把年份拨回公元 1205 年或 1278 年,亲眼看着淮水以北的大片故土变成金朝的疆域、看着文天祥的红色行迹一路退到珠江口的零丁洋与崖山海面,那种字里行间的重量才会真正落到实处。

周末闲下来的时候,不妨泡杯茶打开这个网站,点开右上角的「雅乐」听着古琴曲《流水》或《平沙落雁》,搜一搜自己的家乡在两千四百年里换过多少个名字、又路过哪些熟悉的古人。

相关链接:

✦ 江山时序在线体验地址:https://deanchen.me/jiangshan-map/

✦ 江山时序 GitHub 开源仓库:https://github.com/DeanChensj/jiangshan-map

✦ 江山时序 34 篇静态专题图志目录:https://deanchen.me/jiangshan-map/topics/index.html

✦ 作者自述博客《从历史课本里的插图,到 GitHub 1k star:「江山时序」背后的故事》:https://deanchen.me/history/atlas/2026/10/25/jiangshan-map-story.html

✦ 作者 Dean Chen 个人主页:https://deanchen.me/

封面:Gemini

By nanikun