Repolode
dimartarmizi

dimartarmizi/map-to-poster

一款纯浏览器端的网页应用,可将任意地点生成可定制主题与排版、支持高分辨率导出的地图海报。

可替代:Positive Grid PosterMapiful

Star
1,097
Fork
168
未关闭 Issue
5
最近提交
5个月前

这是什么?

MapToPoster JS 可以搜索全球任意地点,并将其生成为适合打印的地图海报。地图底图分两类:一类基于 Leaflet 的栅格瓦片主题,如 Minimal White、Midnight Dark、Satellite View;另一类基于 MapLibre GL 的矢量艺术主题,如 Arctic Frost、Blueprint Classic 等。

编辑器不仅支持配色,还能调整排版。用户可以添加并拖动标记点,使用 OSRM 规划路线,添加 Mat/Passepartout 衬边框,并切换国家名、坐标和地图标签的显示。城市标签可拖动,设置通过 LocalStorage 保存。

导出为 PNG,分辨率可自定义,最高可达 50,000 像素。所有渲染均在浏览器中完成,位置数据不会上传到服务器。项目基于 Vite 与 Tailwind CSS 构建,并提供 Docker 配置,用 Nginx 托管静态文件。

核心功能

  • 01通过 Nominatim 搜索全球任意地点。
  • 02在 Leaflet 栅格主题与 MapLibre GL 矢量艺术主题之间切换。
  • 03添加、拖动并设置多个标记点样式。
  • 04基于 OSRM 规划并绘制旅行路线。
  • 05添加可调宽度、边框和透明度的 Mat 衬边框。
  • 06导出最高 50,000 像素的 PNG 文件。
  • 07完全在浏览器中运行,设置保存在 LocalStorage。

适用场景

  • 制作家乡、城市或旅行路线的地图海报作为墙面装饰。
  • 为婚礼、纪念日或搬家制作个性化地图礼物。
  • 通过自托管的静态站点部署,生成大幅面打印用图。

快速上手

  1. 1

    克隆仓库

    git clone https://github.com/dimartarmizi/map-to-poster.git
  2. 2

    进入项目文件夹

    cd map-to-poster
  3. 3

    安装依赖

    npm install
  4. 4

    启动开发服务器(访问 http://localhost:5173)

    npm run dev

使用前须知

  • 本地运行需要 Node.js 18.0.0 或更高版本。
  • 地图图块和搜索依赖 Nominatim、OSRM、CartoDB 等第三方服务。

标签

常见问题

map-to-poster 是什么?
一款纯浏览器端的网页应用,可将任意地点生成可定制主题与排版、支持高分辨率导出的地图海报。 MapToPoster JS 可以搜索全球任意地点,并将其生成为适合打印的地图海报。地图底图分两类:一类基于 Leaflet 的栅格瓦片主题,如 Minimal White、Midnight Dark、Satellite View;另一类基于 MapLibre GL 的矢量艺术主题,如 Arctic Frost、Blueprint Classic 等。
map-to-poster 可以免费使用吗?用的什么许可证?
map-to-poster 以 MIT 许可证开源。用于商业产品前,请先确认许可证条款。
map-to-poster 还在维护吗?
半年内有更新。map-to-poster 最近一次提交是在 2026年6月6日。
map-to-poster 适合用来做什么?
制作家乡、城市或旅行路线的地图海报作为墙面装饰。 为婚礼、纪念日或搬家制作个性化地图礼物。 通过自托管的静态站点部署,生成大幅面打印用图。
map-to-poster 怎么安装和运行?
克隆仓库: git clone https://github.com/dimartarmizi/map-to-poster.git 进入项目文件夹: cd map-to-poster 安装依赖: npm install 启动开发服务器(访问 http://localhost:5173): npm run dev
在哪里获取 map-to-poster?
源代码和安装说明在 GitHub 上:https://github.com/dimartarmizi/map-to-poster

概要由 AI 根据项目 README 生成;GitHub 数据每日更新。

相关项目