GSI Vector Tile MCP App
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@GSI Vector Tile MCP Appshow me a map of Tokyo"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
GSI Vector Tile MCP App
国土地理院の地理院地図Vectorを表示するMCP App。ElysiaJS + Bun で構築。
チャット内にインタラクティブな地図UIが埋め込まれ、地理院タイルの閲覧・住所検索・タイル情報取得ができます。
Quick Start
# bunx で直接起動(npm公開後)
bunx elysiajs-gsi-gov
# または clone して起動
git clone https://github.com/dj-oyu/elysiajs-gsi-gov.git
cd elysiajs-gsi-gov
bun install
bun run startサーバーは http://localhost:3001/mcp でMCPエンドポイントを公開します。
Related MCP server: Interactive Map MCP Server
Usage
# UI をビルドしてサーバー起動
bun run start
# 開発モード(UI + サーバーのホットリロード)
bun run dev
# stdio モード(Claude Desktop / Claude Code から直接接続)
bun run serve:stdio
# ビルドのみ(UI + サーバーを dist/ にバンドル)
bun run build:all
# テスト実行
bun testClaude Desktop / Claude Code から使う
Streamable HTTP(リモート接続)
# サーバーを起動
bun run startClaude の Settings > Connectors > Add custom connector で http://localhost:3001/mcp を追加。
stdio(直接接続)
claude_desktop_config.json に追加:
{
"mcpServers": {
"gsi-map": {
"command": "bun",
"args": ["run", "serve:stdio"],
"cwd": "/path/to/elysiajs-gsi-gov"
}
}
}または、ビルド済みバイナリを使う場合:
{
"mcpServers": {
"gsi-map": {
"command": "bun",
"args": ["/path/to/elysiajs-gsi-gov/dist/index.js", "--stdio"]
}
}
}MCP Tools
Tool | Type | Description |
| App (UI付き) | 地理院地図をインタラクティブに表示。レイヤー切替・ズーム・パン操作が可能 |
| Text | GSI住所検索APIで日本国内の住所・地名を検索 |
| Text | 緯度経度からタイル座標(z/x/y)と全レイヤーのURLを取得 |
show-gsi-map のパラメータ
Parameter | Type | Default | Description |
| number | 35.6812 | 中心緯度 |
| number | 139.7671 | 中心経度 |
| number | 13 | ズームレベル (2-18) |
| string | "std" |
|
| string | - | 地図上に表示するラベル |
GSI Tile Layers
Key | Name | Format | Zoom |
| 標準地図 | PNG | 2-18 |
| 淡色地図 | PNG | 2-18 |
| 全国最新写真 | JPG | 2-18 |
| 最適化ベクトルタイル | PBF | 4-17 |
| 白地図 | PNG | 2-14 |
タイルURL形式: https://cyberjapandata.gsi.go.jp/xyz/{layer_id}/{z}/{x}/{y}.{format}
Architecture
├── index.ts # ElysiaJS HTTP エントリポイント
├── server.ts # MCP Server(ツール・リソース登録)
├── mcp-app.html # 地図UI ソース
├── src/mcp-app.ts # 地図UI ロジック(Leaflet + GSIタイル)
├── vite.config.ts # Vite で UI を単一HTMLにバンドル
├── dist/
│ ├── index.js # バンドル済みサーバー (bun build)
│ └── mcp-app.html # バンドル済みUI (vite-plugin-singlefile)
├── server.test.ts # ユニットテスト (19 tests)
└── index.test.ts # インテグレーションテスト (7 tests)処理の流れ
LLMが
show-gsi-mapツールを呼び出すサーバーがツール結果 +
ui://gsi-map/mcp-app.htmlリソースを返すホスト(Claude等)がHTMLをsandboxed iframeで表示
UIはLeafletで地理院タイルを描画し、
Appクラスでホストと双方向通信ユーザーが地図を操作すると
updateModelContext()でLLMに現在地を通知
Scripts
Command | Description |
| UIビルド + サーバー起動 |
| 開発モード(ホットリロード) |
| UIのみビルド(Vite → dist/mcp-app.html) |
| UI + サーバーをバンドル(dist/) |
| サーバー起動(watchモード) |
| stdioモードで起動 |
| テスト実行(26 tests) |
Tech Stack
Bun - Runtime & package manager
ElysiaJS - Web framework
MCP SDK - Model Context Protocol
MCP Apps - Interactive UI extension
Leaflet - Map library
Vite + vite-plugin-singlefile - UI bundler
国土地理院タイル - Map data source
License
MIT
This server cannot be installed
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Latest Blog Posts
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/dj-oyu/elysiajs-gsi-gov'
If you have feedback or need assistance with the MCP directory API, please join our Discord server