Skip to content
← 返回 Research
← 返回 Research

Protomaps

开源地图系统研究 —— PMTiles 单文件瓦片格式、工具链、上海地区底图自建项目与 MapLibre 集成。

Sub Topics

阅读顺序 主题 描述
1 PMTiles 格式与工具链 格式原理（HTTP Range Requests、文件结构、去重）与工具链（pmtiles CLI / Tippecanoe / Planetiler）
2 上海地区底图项目 动手实践 —— 从全球底图远程裁剪上海、本地验证、部署
3 自制 PMTiles 地图 最简单例子：GeoJSON → Tippecanoe → .pmtiles → MapLibre 渲染
4 MapLibre 集成 pmtiles 协议注册、@protomaps/basemaps 完整样式、中文标签

推荐阅读顺序

  1. 理解 PMTiles 格式与工具链 → PMTiles 格式与工具链：格式原理（单文件 + Range 读取）、pmtiles CLI / Tippecanoe / Planetiler 安装
  2. 动手实践上海底图 → 上海地区底图项目：找到构建 → extract 裁剪 → 预览（pmtiles.io）→ 验证 → 本地查看（test-map.html）→ 部署（R2 / S3）
  3. 自制 PMTiles 地图 → 自制 PMTiles 地图：自己的 GeoJSON → Tippecanoe → .pmtiles → MapLibre 渲染（进阶）

MapLibre 深入集成（React 组件、样式切换、性能优化）另见 MapLibre 集成。

相关笔记

Backlinks (2) 
flowchart LR
  n0["AI"]
  n1["Database"]
  n2["Dev Tools"]
  n3["Emoji"]
  n4["Frontend"]
  n5["Game Dev"]
  n6["Collection"]
  n7["Languages"]
  n8["Maps"]
  n9["Media"]
  n10["Monitor"]
  n11["Study Materials"]
  n12["Plans"]
  n13["Storage"]
  n14["Film & TV"]
  n15["Bitcask 存储模型（日志结构哈希表）"]
  n16["KV 数据库对比"]
  n17["KV 数据库"]
  n18["对象存储基本用法（Bucket / Object / 常用操作）"]
  n19["对象存储数据迁移（R2 → MinIO / 跨厂商搬迁）"]
  n20["Object Storage"]
  n21["挂载 Bucket 为本地文件系统（FUSE Mount）"]
  n22["对象存储签名 URL（Signed URL）原理与实战"]
  n23["对象存储供应商对比（S3 / R2 / OSS / Supabase / MinIO）"]
  n24["Prototypes"]
  n25["Research"]
  n26["Better Auth 源码阅读指南"]
  n27["DuckDB 环境与基本使用"]
  n28["DuckDB 实战研究"]
  n29["DuckDB 模拟数据"]
  n30["PostgreSQL 数据用 DuckDB 加速查询"]
  n31["Hollow Knight 英语主题"]
  n32["英语学习 Dashboard"]
  n33["English Scraps Archive"]
  n34["English Scraps 使用指南"]
  n35["Jellyfin 源码阅读指南"]
  n36["Lux 资料整理"]
  n37["Nest Commander 学习资料"]
  n38["NestJS 源码阅读指南"]
  n39["Protomaps 自建底图研究"]
  n40["自制 PMTiles 地图（最简单例子）"]
  n41["MapLibre 集成 Protomaps"]
  n42["PMTiles 格式与工具链"]
  n43["上海地区底图项目"]
  n44["Redash 源码阅读指南"]
  n45["shadcn/ui 进阶使用"]
  n46["shadcn/ui 组件添加与基本使用"]
  n47["shadcn/ui 实用研究（从环境到基本使用）"]
  n48["shadcn/ui 环境与初始化"]
  n49["TRIP 项目核心原理与代码阅读指南"]
  n1 --> n28
  n1 --> n30
  n4 --> n47
  n6 --> n0
  n6 --> n1
  n6 --> n2
  n6 --> n3
  n6 --> n4
  n6 --> n5
  n6 --> n7
  n6 --> n8
  n6 --> n9
  n6 --> n10
  n6 --> n11
  n6 --> n12
  n6 --> n13
  n6 --> n25
  n9 --> n14
  n16 --> n15
  n17 --> n15
  n17 --> n16
  n18 --> n19
  n18 --> n22
  n18 --> n23
  n18 --> n24
  n19 --> n18
  n19 --> n21
  n19 --> n22
  n19 --> n23
  n20 --> n18
  n20 --> n19
  n20 --> n21
  n20 --> n22
  n20 --> n23
  n21 --> n18
  n21 --> n22
  n21 --> n23
  n22 --> n24
  n23 --> n18
  n23 --> n19
  n23 --> n22
  n23 --> n24
  n24 --> n15
  n24 --> n18
  n24 --> n21
  n24 --> n22
  n24 --> n23
  n24 --> n39
  n25 --> n26
  n25 --> n28
  n25 --> n32
  n25 --> n35
  n25 --> n36
  n25 --> n37
  n25 --> n38
  n25 --> n39
  n25 --> n44
  n25 --> n47
  n25 --> n49
  n27 --> n29
  n28 --> n1
  n28 --> n25
  n28 --> n27
  n28 --> n29
  n28 --> n30
  n29 --> n27
  n29 --> n30
  n30 --> n28
  n30 --> n29
  n31 --> n34
  n32 --> n31
  n32 --> n33
  n32 --> n34
  n34 --> n32
  n34 --> n33
  n39 --> n8
  n39 --> n40
  n39 --> n41
  n39 --> n42
  n39 --> n43
  n40 --> n42
  n41 --> n24
  n41 --> n43
  n42 --> n40
  n42 --> n43
  n43 --> n41
  n43 --> n42
  n45 --> n46
  n46 --> n45
  n46 --> n48
  n47 --> n4
  n47 --> n25
  n47 --> n45
  n47 --> n46
  n47 --> n48
  n48 --> n46
  click n0 "../../../collection/ai/" "AI"
  click n1 "../../../collection/database/" "Database"
  click n2 "../../../collection/dev-tools/" "Dev Tools"
  click n3 "../../../collection/emoji/" "Emoji"
  click n4 "../../../collection/frontend/" "Frontend"
  click n5 "../../../collection/game-dev/" "Game Dev"
  click n6 "../../../collection/" "Collection"
  click n7 "../../../collection/languages/" "Languages"
  click n8 "../../../collection/maps/" "Maps"
  click n9 "../../../collection/media/" "Media"
  click n10 "../../../collection/monitor/" "Monitor"
  click n11 "../../../collection/reading/" "Study Materials"
  click n12 "../../../collection/scraps/plans/" "Plans"
  click n13 "../../../collection/storage/" "Storage"
  click n14 "../../../film-tv/" "Film & TV"
  click n15 "../../../knowledge/database/kv/bitcask/" "Bitcask 存储模型（日志结构哈希表）"
  click n16 "../../../knowledge/database/kv/comparison/" "KV 数据库对比"
  click n17 "../../../knowledge/database/kv/" "KV 数据库"
  click n18 "../../../knowledge/infrastructure/cloud/object-storage/basic-usage/" "对象存储基本用法（Bucket / Object / 常用操作）"
  click n19 "../../../knowledge/infrastructure/cloud/object-storage/data-migration/" "对象存储数据迁移（R2 → MinIO / 跨厂商搬迁）"
  click n20 "../../../knowledge/infrastructure/cloud/object-storage/" "Object Storage"
  click n21 "../../../knowledge/infrastructure/cloud/object-storage/mount-bucket/" "挂载 Bucket 为本地文件系统（FUSE Mount）"
  click n22 "../../../knowledge/infrastructure/cloud/object-storage/signed-url/" "对象存储签名 URL（Signed URL）原理与实战"
  click n23 "../../../knowledge/infrastructure/cloud/object-storage/vendors-comparison/" "对象存储供应商对比（S3 / R2 / OSS / Supabase / MinIO）"
  click n24 "../../../prototypes/" "Prototypes"
  click n25 "../../" "Research"
  click n26 "../better-auth/" "Better Auth 源码阅读指南"
  click n27 "../duckdb/basic-usage/" "DuckDB 环境与基本使用"
  click n28 "../duckdb/" "DuckDB 实战研究"
  click n29 "../duckdb/mock-data/" "DuckDB 模拟数据"
  click n30 "../duckdb/postgresql-acceleration/" "PostgreSQL 数据用 DuckDB 加速查询"
  click n31 "../english/hollow-knight/" "Hollow Knight 英语主题"
  click n32 "../english/" "英语学习 Dashboard"
  click n33 "../english/scraps/archive/" "English Scraps Archive"
  click n34 "../english/scraps/" "English Scraps 使用指南"
  click n35 "../jellyfin/" "Jellyfin 源码阅读指南"
  click n36 "../lux/" "Lux 资料整理"
  click n37 "../nest-commander/" "Nest Commander 学习资料"
  click n38 "../nestjs/" "NestJS 源码阅读指南"
  click n39 "./" "Protomaps 自建底图研究"
  click n40 "make-own-map/" "自制 PMTiles 地图（最简单例子）"
  click n41 "maplibre/" "MapLibre 集成 Protomaps"
  click n42 "pmtiles/" "PMTiles 格式与工具链"
  click n43 "shanghai-map/" "上海地区底图项目"
  click n44 "../redash/" "Redash 源码阅读指南"
  click n45 "../shadcn-ui/advanced/" "shadcn/ui 进阶使用"
  click n46 "../shadcn-ui/components/" "shadcn/ui 组件添加与基本使用"
  click n47 "../shadcn-ui/" "shadcn/ui 实用研究（从环境到基本使用）"
  click n48 "../shadcn-ui/setup/" "shadcn/ui 环境与初始化"
  click n49 "../trip/" "TRIP 项目核心原理与代码阅读指南"
Links (5)