城市制霸：把去过的中国城市涂在地图上
最近做了一个小网站：城市制霸。
在中国地图上把去过的城市一个个涂上颜色，最后得到一张属于自己的足迹地图，还能保存成图片分享出去。
缘起
之前很流行一个「中国制霸」的小游戏（itorr/china-ex），以省为单位，给去过的省份涂色、算分。玩起来很上头，但总觉得省这个粒度有点粗：去过广州不代表去过广东，在杭州住过几年，也不代表去过浙江的每一个地方。
于是就想做一个细化到城市的版本：地图用真实的矢量边界，全国视图看全局，点进某个省再逐个标记城市。
能做什么
- 标记城市：在全国地图上点一个省，地图会放大到这个省；再点城市，选择去过的程度。
- 五个等级：居住（5 分）、短居（4 分）、游玩（3 分）、出差（2 分）、路过（1 分），总分自动统计。
- 画笔：先选好等级，再连续点击多个城市，一口气涂完。
- 搜索：输入城市名、简称或拼音（
shenzhen、sz都行），直接定位。 - 保存图片：全国视图保存全国足迹图；在省视图保存这个省的「XX 制霸」图，全省点亮还会盖上「全制霸」印章。
370 座城市是怎么来的
这里的「城市」指地级行政区，外加几类通常也会被当作「一个地方」的单位：
| 类别 | 数量 |
|---|---|
| 地级市 | 293 |
| 自治州 | 30 |
| 地区 | 7 |
| 盟 | 3 |
| 省直辖县级单位（仙桃、济源、海南各市县、新疆兵团城市等） | 30 |
| 北京、天津、上海、重庆、香港、澳门、台湾（各算一个） | 7 |
| 合计 | 370 |
理论满分是 370 × 5 = 1850 分。不过要拿满分，得在每座城市都住满一年以上，也就是先活个 370 岁再说。
数据存在哪
不需要注册登录，所有标记都只保存在你自己的浏览器里，不会上传到任何服务器。换手机、换电脑或清理浏览器之前，可以在统计卡片里点「导出」存成一个 JSON 文件，之后再「导入」恢复。
技术上的一点碎碎念
整个网站是纯静态页面，没有后端：
- 地图边界来自阿里 DataV GeoAtlas，用 mapshaper 修复拓扑、简化后投影成 SVG；全国视图先加载一份粗略的边界，进入省视图时再换成精细版。
- 界面字体用的是开源的得意黑，按页面实际用到的字做了子集，不到 100 KB。
- 用 Vite 构建，部署在 Vercel 上，国内也能直接访问。
代码以 MIT 协议开源在 GitHub。
最后
网站地址：https://china.loveyou.moe/，手机和电脑的浏览器都能直接打开（在微信里打不开的话，点右上角「在浏览器打开」）。
欢迎来涂一涂，看看自己到底点亮了多少座城市。