目录

前言

一、关于十大古都

1、相关历史知识

2、提取古都的历史线脉络

二、时空WebGIS可视化实现

1、古都数据结构介绍

2、WebGIS可视化实现

3、十大古都标绘效果

 三、总结

---

前言

        随着信息技术的飞速发展，地理信息系统（GIS）已成为历史研究中不可或缺的工具。GIS技术以其独特的空间分析和可视化功能，使得历史学家能够将历史事件和文化现象放置在具体的地理环境中进行考察。这种结合不仅为我们提供了一个全新的视角来观察和理解历史，而且也使得历史数据的管理和分析变得更加高效和精确。

        通过GIS，我们可以将历史地图、文献记录、考古发掘等多元数据整合在一起，构建出历史时期的地理信息模型。这些模型不仅能够展示历史时期的地理分布，还能够揭示不同历史时期之间的地理变迁。例如，通过GIS技术，我们可以清晰地看到古罗马帝国的扩张过程，或者分析某个历史事件对特定地区的影响。这种空间化的分析方法，极大地增强了我们对历史复杂性的认识。

        此外，GIS与历史的结合也为公众提供了更加直观的历史教育方式。通过交互式的地图和三维模型，公众可以更加生动地体验历史，从而激发对历史的兴趣和探索欲望。总之，GIS与历史的结合，不仅是一种技术革新，更是对历史研究方法的一次深刻变革。

        地理信息系统（GIS）与历史的结合，为我们打开了一扇探索过去的全新窗口。GIS技术，以其强大的空间分析能力，使得历史研究不再局限于文字和图像的平面描述，而是能够在三维空间中重现历史的脉络。这种跨学科的融合，不仅丰富了我们对历史事件和文化变迁的理解，也为历史学者提供了一种全新的研究工具。

        中国上下五千年，历经多个王朝。每个朝代都有都城。在这五千多年的历史长河中，古都是政治中心、文化中文、军事中心。古都不仅仅仅承载着中国悠久的历史和文化，也是中国古都学研究的重要组成部分。通过GIS来看历史，使用地图来将故事，当GIS遇到历史，又会迸发出什么样的火花呢？

        本文即以Leaflet来构建十大古都WebGIS展示为例，首先讲解历史中的十大古都对应的现代城市，然后讲解如何来搜集历史知识，同时将这些历史知识对应到城市中，包含各年代的起止时间。最后将古都对应的现代城市信息使用Leaflet进行空间标注，同时把各朝代及其对应的起止时间进行标注。通过本文不仅让您了解我国的十大古都历史知识，同时可以了解如何使用WebGIS结合历史进行文化知识的演示。地图会将故事，时间遇到空间，见证一场神奇的时空碰撞之旅。

一、关于十大古都

        既然是讲历史知识的，同时是展示十大古都的。因此有必要来介绍一下相关的古都信息。申明，这里的古都展示的都是对应的现代城市。已北京为例，有北平这样的其它城市，在本文中，首先以现在的城市为代称。只要是在该城市建都都归属到当前城市。

1、相关历史知识

        为了更好的来描述我国的十大古都，受限于我有限的历史知识。首先，我们借用一些人工智能和搜索引擎来辅助进行相关知识的构建。中国古都有广义和狭义之分，广义上的古都：作为一个独立的王朝或政权，不受外来的控制，其都城已成为政治中心，就皆应视为古都；狭义上的古都：古都不仅是独立王朝或政权的都城，还应该具有较为长久而不是过分短暂的年代，其遗址的现在地理位置应是确切的而不是推论的臆定，还应是距现在有关的城市较近，而不是相离很远的废墟。 [1就广义的古都来说，自三代以下，中国共有古都217处，涉及的王朝或政权277个，这里面包括建立在内地的古都164处，建立在周边各地的古都53处。

        截至2016年10月，中国古都学会共确定中国“大古都”十处，分别是西安、洛阳、南京、北京、开封、杭州、安阳、郑州、大同、成都，统称“十大古都”。这里的十个大城市就是本博客的重点内容。

2、提取古都的历史线脉络

        有了上述的城市历史列表之后，我们再分别来提取这些古都的简称历史。比如建都朝代的起止时间，建都朝代的具体名称等等。这里以西安市和南京市为例，我们可以通过某百科来进行相关信息的搜集。我们可以通过某百科的相关知识来进行梳理。

西安，被誉为“十三朝古都”，在此建都的朝代包括西周、秦、西汉、新朝、东汉(献帝时期)、西晋(愍帝时期)、前赵、前秦、后秦、西魏、北周、隋朝和唐朝。西安的建都历史非常悠久，从西周开始，历经秦、汉等朝代，直至唐朝，每个朝代都留下了独特的印记。例如，西周的都城是丰京和镐京，秦朝的都城是咸阳，西汉时期刘邦将都城迁至长安，并在此建造了著名的未央宫。隋朝时期，隋文帝在长安城附近建立了新的都城大兴城，而唐朝则进一步修建和完善了长安城，使其成为当时世界上最大的城市之一。 

南京，肃有“六朝古都”、“十朝都会”之称。东吴:229年孙权在武昌称帝后迁都至此改名建业，是南京第一次作为都城出现在历史舞台。东晋:317年，司马睿在建康(今南京)重建晋朝，史称东晋。南朝 (宋齐梁陈):420年至557年，分别作为南朝宋齐梁陈四个政权的都城。五代:杨吴西都，937年徐知诰(后改名李昪)代吴建南唐都江宁(今南京)。明朝:1368年朱元璋在应天(今南京)称帝，建立明朝，后迁都北京，南京成为留都。中华民国:1912年孙中山在南京就任中华民国临时大总统，以南京为首都。此外，太平军1853年攻克南京，改称天京，作为太平天国都城;1644年明朝被李自成的农民起义军推翻后，明朝的残余势力在南京建立了南明政权，南京曾短暂作为都城。

        通过这些历史脉络的梳理 ，为我们的历史时空WebGIS的展示奠定坚实的基础。在此基础之上，后续我们将根据这些知识进行空间信息的标注展示。

二、时空WebGIS可视化实现

        为了展示十大古都的位置信息，我们将采用其对应的现代城市的坐标。获取城市坐标后，将建都朝代以及朝代起止年份绑定到当前城市的DivIcon中，让相关信息在地图上进行标注。本节首先将介绍相关数据的结构，然后根据搜索的相关信息构建基本数据列表，最后根据数据列表来构建古都信息及地图可视化成果展示。

1、古都数据结构介绍

        为了显示更准确的基本信息，我们首先来查询基本信息。大家可以直接搜索引擎中直接搜索，即可得到标准的查询反馈。如下图所示：

        根据以上的信息，我们可以给对城市信息进行一个简单的结构的定义，期望中的古都信息，主要包含以下信息：设 D为所有城市信息的集合，D中的每个元素 ， 是包含以下属性的集合：。

        其中每个定义为：,表示第i个古都的基本信息，其中，是一个实数，表示第 i 个城市的纬度;是一个实数，表示第i个城市的经度;是一个字符串，表示第 i个城市的中文名称;是一个字符串，表示第 i个城市作为都城的朝代数量;是一个字符串，表示第 i 个城市在图表或地图上的颜色代码;是一个集合，包含了第 i个城市作为都城的各个朝代的信息。

        其中，中的每个元素也是一个集合,包含朝代的名称和存在的时间,即：,每个定义为：,而表示第i个城市的第j个朝代的名称，则表示第i个城市第j个朝代的起止时间。根据上述的定义，可以将朝代和起止时间整理成如下的数据格式，以下以北京为例：

//北京
var dataJson = [{lat:39.842286,lon:116.411133,c_name:"北京",num:"六朝",color:"#03a9f4",
			cdlist:[{name:"燕",time:"(-)"},{name:"辽",time:"(938年—1125年)"},{name:"金",time:"(1153年—1215年)"},
		{name:"元",time:"(1272年—1368年)"},{name:"明",time:"(1403年—1644年)"},{name:"清",time:"(1644年—1912年)"}]}];

2、WebGIS可视化实现

        根据前一节的信息检索以及朝代检索。我们可以整理出以下的静态数据。下列数据中，关于朝代的具体起止时间有待考证，本文非严格的历史学，仅在研究如何将历史信息和GIS进行融合。因此不对时间年代进行严格的考证。因此本文的年代信息均从搜索引擎中获取，如有问题，还请指正。示例的完整十大古都的历史信息如下：

// 待标绘的点
var dataJson = [
	{lat:39.842286,lon:116.411133,c_name:"北京",num:"六朝",color:"#03a9f4",
			cdlist:[{name:"燕",time:"(-)"},{name:"辽",time:"(938年—1125年)"},{name:"金",time:"(1153年—1215年)"},
	{name:"元",time:"(1272年—1368年)"},{name:"明",time:"(1403年—1644年)"},{name:"清",time:"(1644年—1912年)"}]},
	{lat:32.040677,lon:118.800659,c_name:"南京",num:"六朝",color:"#ff9800",
			cdlist:[{name:"东吴",time:"(229年-280年)"},{name:"东晋",time:"(317年-420年)"},{name:"南朝",time:"(-)"},{name:"五代",time:"(420年-975年)"},
	{name:"明",time:"(1368年-1644年)"},{name:"中华民国",time:"(1912年-1949年)"}]},
	{lat:34.260622,lon:108.94043,c_name:"西安",num:"十三朝",color:"#591ee9",
			cdlist:[{name:"西周",time:"(前1057年-前771年)"},{name:"秦",time:"(前350年-前207年)"},{name:"西汉",time:"(前202年-8年)"},{name:"新朝",time:"(8年-23年)"},{name:"东汉",time:"(25年-190年)"}
		,{name:"西晋",time:"(313年-316年)"},{name:"前赵",time:"(319年-329年)"},{name:"前秦",time:"(350年-394年)"},{name:"后秦",time:"(386年-417年)"},{name:"西魏",time:"(535年-556年)"},
		{name:"北周",time:"(557年-581年)"},{name:"隋朝",time:"(581年-618年)"},{name:"唐朝",time:"(618年-907年)"}]},
		{lat:30.202114,lon:120.234375,c_name:"杭州",num:"两朝",color:"#607d8b",
			cdlist:[{name:"吴越",time:"(907-978年)"},{name:"南宋",time:"(1138-1279年)"}]},
		{lat:30.557531,lon:104.0625,c_name:"成都",num:"五政",color:"#4b29b5",
			cdlist:[{name:"古蜀",time:"(前1045年-前316年)"},{name:"蜀汉",time:"(221年-263年)"},{name:"成汉",time:"(304年-347年)"},{name:"前蜀",time:"(907年-925年)"},{name:"后蜀",time:"(934年-966年)"}]},
		{lat:34.578952,lon:112.456055,c_name:"洛阳",num:"十三朝",color:"#a50b0b",
			cdlist:[{name:"夏",time:"(前2070年-前1600年)"},{name:"商",time:"(前1600年-前1046年)"},{name:"东周",time:"(前770年-前256年)"},{name:"东汉",time:"(25年-220年)"},{name:"曹魏",time:"(220年-266年)"},{
		name:"西晋",time:"(266年-316年)"},{name:"北魏",time:"(386年-534年)"},{name:"隋",time:"(581年-618年)"},{name:"唐",time:"(618年-907年)"},{name:"后梁",time:"(907年-923年)"},{name:"后唐",time:"(923年-936年)"},{name:"后晋",time:"(936年-947年)"}]},
		{lat:34.773204,lon:114.318237,c_name:"开封市",num:"八朝",color:"#a030b5",
			cdlist:[{name:"夏",time:"(前1950年-前1750年)"},{name:"战国魏",time:"(前361-前220年)"},{name:"后梁",time:"(907年-924年)"},{name:"后晋",time:"(936年-947年)"},{name:"后汉",time:"(947年-950年)"},{name:"后周",time:"(951年-961年)"},
		{name:"北宋",time:"(960年-1134年)"},{name:"金朝",time:"(1115年-1155年)"}]},
		{lat:36.080182,lon:114.400635,c_name:"安阳市",num:"七朝",color:"#3fb5a5",
			cdlist:[{name:"殷商",time:"(前1600年-前1046年)"},{name:"曹魏",time:"(220年-266年)"},{name:"后赵",time:"(319年-351年)"},{name:"冉魏",time:"(350年-352年)"},{name:"前燕",time:"(337年-370年)"},
		{name:"东魏",time:"(534年-550年)"},{name:"北齐",time:"(550年-577年)"}]},
		{lat:34.388779,lon:115.647583,c_name:"商丘市",num:"七朝",color:"#13a159",
			cdlist:[{name:"夏",time:"(前1950年-前1750年)"},{name:"商",time:"(前1600年-前1046年)"},{name:"周",time:"(前1046年-前256年)"},{name:"汉",time:"(前202年-220年)"},{name:"北魏",time:"(386年-534年)"},
		{name:"南宋",time:"(1127年-1279年)"},{name:"金",time:"(1115年-1155年)"}]},
		{lat:34.737098,lon:113.631592,c_name:"郑州市",num:"五朝",color:"#784775",
			cdlist:[{name:"夏",time:"(前1950年-前1750年)"},{name:"商",time:"(前1600年-前1046年‌)"},{name:"管国",time:"(前1046年-前660年)"},{name:"郑国",time:"(前806年-前375年)"},{name:"韩国",time:"(前403年-前230年)"}]},
		{lat:40.057052,lon:113.291016,c_name:"大同市",num:"三朝",color:"#a0b768",
			cdlist:[{name:"北魏",time:"(398年-494年)"},{name:"辽",time:"(907年-1125年)"},{name:"金",time:"(1115年-1155年)"}]}
];

        在进行朝代的信息展示时，需要循环cdlist这个集合，然后把每个朝代的名称、起止日期进行转换成html元素，关键函数代码如下：

function buildHtml(dataJson){
	var html = "";
	html += "<div class='marsBlackPanel' style='background:"+dataJson.color+";' animation-spaceInDown><div class='marsBlackPanel-text'><b>【"+dataJson.c_name +"】</b><span>"+ dataJson.num +"古都</span></div>";
	for(var j=0;j<dataJson.cdlist.length;j++){
		html += "<div class='marsBlackPanel-text' style=''>" + (j + 1)+ "、" + dataJson.cdlist[j].name + dataJson.cdlist[j].time + "</div>";
	}
	html += "</div>";
	return html;
}

        我们在Leaflet中采用DivIcon的方式进行古都的标绘。核心方法如下：

var collisionLayer = L.LayerGroup.collision({margin:3});
	
for(var i=0;i<dataJson.length;i++){
	var marker = L.marker([dataJson[i].lat, dataJson[i].lon], {
		icon: L.divIcon({
			iconSize: null,
			className: '',
			popupAnchor:[5,5],
			shadowAnchor:[5,5],
			html: buildHtml(dataJson[i])
		})
	}).addTo(collisionLayer);
}
	
collisionLayer.addTo(map);

        经过以上步骤，基本可以完成我国十大古都的信息标绘。下面我们来看一下实际的效果。

3、十大古都标绘效果

        首先从地理来看一下整体的空间位置，这些古都基本都是位于我国的中原地带，有偏北方的北京、大同、西安等城市，纬度比较靠南边也就是杭州。历史书上说的逐鹿中原，是有一定的历史依据和原因的。

十大古都空间分布

河南省古都列表

        可以看到，河南省作为中原腹地，当之无愧的是古都大省，郑州、商丘、开封等城市都是非常有历史既视感的。

建都次数较多的城市

        西安和洛阳都是建都次数较多的，长安城和洛阳城自然是底蕴丰富。

 江南古都之金陵城和临安府

        作为江安的两座城市，金陵城和临安府也是仅有的两个古都城市，而南京在朱元璋的明朝建都，来到了鼎盛时期。 喜欢历史文化的朋友们不妨可以这十大古都看看，感受一下这些城市的历史底蕴。

 三、总结

        以上就是本文的主要内容，本文即以Leaflet来构建十大古都WebGIS展示为例，首先讲解历史中的十大古都对应的现代城市，然后讲解如何来搜集历史知识，同时将这些历史知识对应到城市中，包含各年代的起止时间。最后将古都对应的现代城市信息使用Leaflet进行空间标注，同时把各朝代及其对应的起止时间进行标注。通过本文不仅让您了解我国的十大古都历史知识，同时可以了解如何使用WebGIS结合历史进行文化知识的演示。地图会将故事，时间遇到空间，见证一场神奇的时空碰撞之旅。

        古人不见今时月,今月曾经照古人。许多波澜壮阔的历史，在浩如烟海的历史之中，不过只留下了两地笔墨，希望大家都平平淡淡，开开心心。行文仓促，定有许多不足之处，如有不足，还恳请各位专家博主在评论区不吝指出，不甚感激。

        文章编写，参考了以下资料：

        1、中国十大古都。

        2、十大古都。

        3、西安市百科。