mcpField
M
mapstage

mapstage

github.com/hopechen067设计与 UI49547 次安装3 天前更新
代码仓库

关于 mapstage

mapstage 技能指导 Agent 使用 MapStage 调整地图场景，并将调试结果迁移到生产渲染环境。涵盖投影、地形、配色、城市层级与 JSON 导出。

主要功能

  1. 01调整地图与地球投影
  2. 02切换卫星图与地形渲染
  3. 03隔离区域并调整 CSS 配色
  4. 04设置城市与聚落层级
  5. 05导出并迁移版本 3 JSON

适用场景

  1. 01为应用调试地图场景外观
  2. 02锁定镜头和样式后导出预设
  3. 03在生产渲染中复用调试配置

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/hopechen067/mapstage --skill mapstage

安装后在 Claude Code 中输入/mapstage确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

agents/
openai.yaml
references/
city-tier-schema.md
tested-config.md
tuner-workflow.md
water-overlay.md
参数列表说明.md
schemas/
map-preset.schema.json
sample-sites.schema.json
tuner/
.nojekyll
index.html
map-tiles.config.example.js
map-tiles.config.js
preset-antique-default.json
README.md
vector-layers.html
tuner/assets/
han-city-3d.js
isolate-workbench.js
map-fx.js
polar-ice.geojson
region-isolate.js
sample-sites.json
site-nav.js
terrain-island.js
vector-paint.js
water-pack.json
tuner/presets/
antique-default.json
tuner/scripts/
patch-china-boundaries.mjs
patch-maritime-islands.mjs
patch-zangnan-region.py
tuner/vendor/
maplibre-contour.min.js

详细介绍

MapStage

在构建或调整 MapStage 场景时使用此技能：地图／地球投影、卫星图、分层设色地形、Mapterhorn 地形、区域隔离、CSS 色彩分级和 JSON 导出。

使用时机

  • 需要实时调整 MapStage（地图与地球投影、卫星图与地形、区域隔离）。
  • 需要锁定绘制样式／CSS／相机，然后将 JSON 导出到其他宿主。
  • 需要分级聚落（capital／large／medium／small／pass／station／ordos）。

不要将调节器页面用作最终渲染宿主。

模式

模式用途
生产环境图层栈在应用中嵌入 MapStage：可选卫星图／栅格图层 + Mapterhorn DEM（encoding: 'terrarium'）+ 山体阴影 + OpenFreeMap 矢量水体 + CSS 滤镜 + 城市拉伸。根据导出的 JSON 驱动视觉效果。
调节器tuner/ 下的 HTTP 页面（或公开演示页），用于滑块调节、投影、区域隔离、预设加载／导出。

工作流

  1. 打开调节器：访问公开演示页 https://hopechen067.github.io/MapStage/，**或**运行 cd tuner && python -m http.server，然后打开终端中显示的本地 URL。
  2. 瓦片：默认启用 EOX Sentinel-2 cloudless + Mapterhorn（tuner/map-tiles.config.js）。可通过被 git 忽略的 map-tiles.config.local.js 覆盖。
  3. 应用默认预设 tuner/preset-antique-default.json（与 tuner/presets/antique-default.json 相同）。架构版本为 3。
  4. 调整投影／卫星图／地形／区域隔离／CSS／城市，直到视觉效果定型。
  5. 导出 JSON（复制或下载）。确认包含 version: 3，以及 ui.projection、ui.showSatellite、ui.showRelief、ui.showCssFilter、isolate。
  6. 将这些字段迁移到生产环境的 MapStage 场景中（参见参考资料）。
  7. 在生产环境中：使用 jumpTo 设置相机；等待 idle；也可预先缓存瓦片。录制帧时避免使用 easeTo／flyTo。
  8. 始终使用 encoding: 'terrarium' 设置 DEM。编码错误会导致山体阴影／地形异常。
  9. 最终帧应从生产环境宿主渲染，而非从调节器 UI 渲染。

硬性规则

  • 不打包瓦片——MapStage 仅在运行时从已配置的 URL 获取 DEM 和底图。
  • 仅使用获准使用的底图端点——默认使用公开演示瓦片（EOX）；需要时通过配置替换。
  • 地形数据源必须设置 encoding: 'terrarium'。
  • 录制的生产环境流程中不得使用 easeTo／flyTo；优先使用 jumpTo + idle。
  • 不要在调节器上托管最终渲染内容。
  • 公开调节器中的水体使用 OpenFreeMap／OpenMapTiles 矢量图层（water／waterway）。导出结果中的 ui.showWater 始终为 false（旧版 GeoJSON 叠加层已关闭）。不要期待或提交 tuner/assets/water-data.js。

仓库与技能

对这个 GitHub 仓库执行 git clone 会拉取整个项目。Agent 技能仅包含 mapstage/。使用 npx skills add hopechen067/MapStage --skill mapstage -g 或 gh skill install hopechen067/MapStage mapstage --scope user 安装该文件夹；也可以将其复制到宿主的技能目录并重新加载。Agent 不会从克隆的仓库中自动发现 mapstage/SKILL.md。

参考资料

Agents

显示名称／默认提示词请参见 agents/openai.yaml。

评论

支持 Markdown