MapLibre + OpenStreetMap，这个开源工具把任意城市做成打印级地图海报

TerraInk 是一个免费开源的地图海报生成工具，数据来自 OpenStreetMap，完全在浏览器里运行。你搜索任意城市或输入坐标，选一个主题，调整配色和图层，导出一张打印级别的地图海报——整个过程不需要安装任何软件。

网站地址：https://terraink.app (opens in a new tab)

能做什么

任意位置都支持

支持全球任意位置，搜索城市名称或手动输入经纬度坐标，地图实时加载对应区域的 OpenStreetMap 数据。找到目标区域后可以自由拖拽、缩放和旋转，精确定位你想要的画面范围。

主题和配色

内置数十套精选主题，覆盖深色、浅色、复古、极简等风格。选定主题后还可以逐个修改每个颜色值，实时预览效果，不满意随时调。字体从 Google Fonts 选取，可以在地图上叠加城市名称、坐标等文字信息。

图层独立控制

水体、公园、建筑轮廓三个图层可以独立开关，决定地图里保留哪些地物。只想要道路和建筑轮廓、不要绿地？关掉公园图层就好。这个细节对最终海报的视觉密度影响很大。

PDF 导出

导出格式是 PDF，矢量格式，送去打印店直接印，不用担心分辨率不够的问题。这是它和普通截图工具的核心差异——输出的是可以放大到任意尺寸的矢量文件。

怎么用

打开网站，整个流程分三步：

定位：在搜索框输入城市名称，或直接输入经纬度，地图跳转到目标位置后，拖拽调整构图
样式：从主题库选一个基础风格，然后按需调整配色、字体、图层显示
导出：点击导出按钮，下载 PDF 文件

支持 PWA 安装，可以把网站添加到桌面作为独立应用使用，同时支持自动获取当前地理位置快速定位。

背后的技术

矢量瓦片让实时换肤成为可能

普通地图用的是光栅瓦片——服务端把地图渲染成图片分块传回来，样式是固定的，换主题就要重新请求新图片。TerraInk 用的是矢量瓦片，服务端传回的是原始地理数据（道路、建筑、水体的坐标和属性），渲染完全在浏览器里由 MapLibre GL 完成。

这意味着同一份数据，换一套样式配置，地图立刻以新的颜色重新绘制，不需要重新请求数据。你在调色板里改一个颜色值，地图实时更新，背后只是样式配置在变，数据没动。

MapLibre 的图层样式系统

MapLibre GL 用一套 JSON 格式的样式规范描述地图的视觉表现，每个地理要素类型（道路、建筑、水体、公园）对应一个独立的图层，每个图层有自己的 paint 属性（颜色、透明度、线宽等）。

TerraInk 的"主题"本质上就是一套预设好的 MapLibre 样式配置，切换主题等于替换整个样式对象，图层开关对应把某个图层的 visibility 设为 none：

{
  "layers": [
    {
      "id": "water",
      "type": "fill",
      "paint": { "fill-color": "#a8c8e8" }
    },
    {
      "id": "park",
      "type": "fill",
      "paint": { "fill-color": "#c8e6c9" }
    }
  ]
}

PDF 导出：从 WebGL canvas 到矢量文件

地图渲染在 WebGL canvas 上，导出时借助 maplibre-gl-export 插件，把当前视口的地图内容连同海报布局（标题、坐标文字等）合并输出为 PDF。PDF 是矢量格式，无论放大多少倍打印都不会模糊。

数据来源

地图数据来自 OpenStreetMap，通过 OpenFreeMap 提供的免费矢量瓦片服务分发。位置搜索使用 Nominatim，这是 OpenStreetMap 官方的地理编码服务，支持全球城市和地点的名称查询。整条数据链路全部基于开源服务，不依赖任何付费 API。

本地部署

如果想自己部署一份，项目支持本地开发和 Docker 两种方式。

本地开发需要先安装 Bun：

bun install
bun run dev

Docker 部署：

docker compose up -d --build

项目用 React + TypeScript + Vite 构建，地图渲染基于 MapLibre，数据来自 OpenStreetMap 和 OpenFreeMap 矢量瓦片。最近经历了一次从 JS 到 TS 的完整重写，代码结构采用六边形架构（Hexagonal Architecture），模块拆分比较清晰。

写在最后

TerraInk 的定位是很清晰的一个小工具：把"生成好看的城市地图海报"这件事做到开箱即用。对于想做礼物、装饰画，或者需要在设计项目里用到地图元素的人，它省去了在 QGIS 或 Figma 里手工处理地图数据的时间。

项目仍在活跃开发中，功能还在持续更新，README 里也明确标注了欢迎贡献。目前是完全免费使用，导出没有水印限制。

GitHub 地址：https://github.com/yousifamanuel/terraink (opens in a new tab)