From 388abeebad24e4292bde25487938bcd8d9414c5f Mon Sep 17 00:00:00 2001 From: Ruk Doe Date: Sun, 15 Nov 2026 00:20:42 +0900 Subject: [PATCH 1/2] =?UTF-8?q?=E5=9C=B0=E5=9B=B3:=20=E9=81=93=E8=B7=AF?= =?UTF-8?q?=E3=83=BB=E5=9C=B0=E5=90=8D=E3=83=BB=E6=96=BD=E8=A8=AD=E3=81=AE?= =?UTF-8?q?=E8=A8=98=E5=8F=B7=E3=80=81=E6=8C=87=E5=AE=9A=E7=B7=8A=E6=80=A5?= =?UTF-8?q?=E9=81=BF=E9=9B=A3=E5=A0=B4=E6=89=80=E3=83=BB=E6=8C=87=E5=AE=9A?= =?UTF-8?q?=E9=81=BF=E9=9B=A3=E6=89=80=E3=80=81=E3=83=8F=E3=82=B6=E3=83=BC?= =?UTF-8?q?=E3=83=89=E3=83=9E=E3=83=83=E3=83=97=E3=82=92=E9=87=8D=E3=81=AD?= =?UTF-8?q?=E3=82=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 地理院地図Vector の PMTiles を pmtiles で読み、道路を写真の上で読める線で、注記を国土地理院のスタイルの層で描く。字体は外から読まず端末で描き、スプライトは自分で配る - 指定緊急避難場所・指定避難所を、ズーム 14 から見ている範囲だけ読み、押すと対応する災害を出す - ハザードマップをなし・洪水・土砂災害・津波から 1 つ選び、公式の凡例を出す - 各情報源の条件を確かめて docs/map.md に書いた。ui.md・design.md・出典も直した Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01T8TqVdo6LUrWKdVQgbScVU --- bun.lock | 5 + bunfig.toml | 2 + docs/design.md | 5 +- docs/map.md | 61 +++-- docs/ui.md | 4 +- package.json | 1 + src/lib/components/QuakeMap.svelte | 327 +++++++++++++++++++++++-- src/lib/map/style.ts | 368 ++++++++++++++++++++++++++++- src/lib/notice.ts | 3 +- static/map/gsi/anno.json | 1 + static/map/gsi/sprite/std.json | 122 ++++++++++ static/map/gsi/sprite/std.png | Bin 0 -> 109290 bytes static/map/gsi/sprite/std@2x.json | 122 ++++++++++ static/map/gsi/sprite/std@2x.png | Bin 0 -> 109290 bytes tests/map-style.test.ts | 51 +++- tools/gsi/build.ts | 54 +++++ 16 files changed, 1084 insertions(+), 42 deletions(-) create mode 100644 static/map/gsi/anno.json create mode 100644 static/map/gsi/sprite/std.json create mode 100644 static/map/gsi/sprite/std.png create mode 100644 static/map/gsi/sprite/std@2x.json create mode 100644 static/map/gsi/sprite/std@2x.png create mode 100644 tools/gsi/build.ts diff --git a/bun.lock b/bun.lock index cffb9b7..23ea4ce 100644 --- a/bun.lock +++ b/bun.lock @@ -15,6 +15,7 @@ "@typescript/native": "npm:typescript@7", "maplibre-gl": "^6.18.0", "oxlint": "^1.93.0", + "pmtiles": "^4.5.0", "svelte": "^5.57.3", "svelte-check": "^4.7.8", "typescript": "~6.0.3", @@ -246,6 +247,8 @@ "fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="], + "fflate": ["fflate@0.8.3", "", {}, "sha512-tbZNuJrLwGUp3zshBtdy4W+ORxZuIh8a5ilyIEQDC5rY1f3U20JMry0Ll3WBzU58EZKsEuJFXhb5gwv8CsPvgA=="], + "fsevents": ["fsevents@2.3.3", "", { "os": "darwin", "hasInstallScript": true }, "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw=="], "gl-matrix": ["gl-matrix@3.4.4", "", {}, "sha512-latSnyDNt/8zYUB6VIJ6PCh2jBjJX6gnDsoCZ7LyW7GkqrD51EWwa9qCoGixj8YqBtETQK/xY7OmpTF8xz1DdQ=="], @@ -318,6 +321,8 @@ "pkg-types": ["pkg-types@2.4.0", "", { "dependencies": { "confbox": "^0.3.1", "exsolve": "^1.1.3", "pathe": "^2.0.3" } }, "sha512-07Fys7iVx0X6TcviMOgogM1Lk33ZyqOezMnU79S+kffWqwolG/5W9V8EgQSeYCIfFTYVgssRbnH630Oa2+soBA=="], + "pmtiles": ["pmtiles@4.5.0", "", { "dependencies": { "fflate": "^0.8.2" } }, "sha512-CBeD4SoUluFziGdy/8k7FOjQxQy486n+929W/tWophauvMICpkZ26vGBWhDt/6b1FZQWNaf4jFdT/5+q0Wii5w=="], + "postcss": ["postcss@8.5.32", "", { "dependencies": { "nanoid": "^3.3.20", "picocolors": "^1.1.1", "source-map-js": "^1.2.2" } }, "sha512-LJlKCCAUFKOuZxipUdYw1NzIITEsPcgyOG9LkvRJvuKj/bRzbuRY0ARXvL0pWGpsZvn8jku+LMep2eU0seHp8g=="], "potpack": ["potpack@2.1.0", "", {}, "sha512-pcaShQc1Shq0y+E7GqJqvZj8DTthWV1KeHGdi0Z6IAin2Oi3JnLCOfwnCo84qc+HAp52wT9nK9H7FAJp5a44GQ=="], diff --git a/bunfig.toml b/bunfig.toml index cf708b7..c92929e 100644 --- a/bunfig.toml +++ b/bunfig.toml @@ -8,4 +8,6 @@ ignorePatterns = [ "tests/fixtures/**", # 気象庁の GIS データから tools/areas/build.sh で作るもの "static/areas/**", + # 国土地理院のスタイルとスプライトから tools/gsi/build.ts で作るもの + "static/map/gsi/**", ] diff --git a/docs/design.md b/docs/design.md index 46b6a4c..8c87d97 100644 --- a/docs/design.md +++ b/docs/design.md @@ -493,7 +493,7 @@ VOICEVOX が止まっている・つながらないときは、画面が端末 Leaflet の 1.9 は 3 年近く出ておらず、2.0 はまだ beta。 - **下地は国土地理院のシームレス空中写真** (持ち主の決定、2026-11-13)。その上に、気象庁の[予報区等 GIS データ](https://www.data.jma.go.jp/developer/gis.html) (地震情報の細分区域・津波予報区、シェープファイル、JGD2011) をコンテナの中で簡略化した GeoJSON (`tools/areas/build.sh` → `static/areas/`) と、震源・震度のラベル・緊急地震速報の印を重ねる。層はいつも全部出す (持ち主の決定、2026-11-14。切り替えは置かない)。いまの大きさなら PMTiles は要らない。 -- 淡色地図 (地名) の下地はやめた (2026-11-14)。地名・道路は写真の上に重ねる形で足す予定。層ごとのデータ・出典と描き方の決まりは [map.md](map.md)。 +- 淡色地図 (地名) の下地はやめ (2026-11-14)、道路・地名・施設の記号は地理院地図Vector (国土地理院最適化ベクトルタイルの PMTiles) を写真の上に重ねる。字体は外から読まず、端末の字体で描く。ハザードマップ (重ねるハザードマップのラスタータイル) は 1 つだけ選んで重ね、指定緊急避難場所・指定避難所は寄せたときだけ出す。層ごとのデータ・出典と描き方の決まりは [map.md](map.md)。 - **震度の色** (気象庁「気象庁ホームページにおける気象情報の配色に関する設定指針」表 2-2、令和 2 年 7 月): | 震度 | 7 | 6強 | 6弱 | 5強 | 5弱 | 4 | 3 | 2 | 1 | @@ -548,7 +548,8 @@ Leaflet の 1.9 は 3 年近く出ておらず、2.0 はまだ beta。 - **震度・津波の区分・火山の警戒の段・気象警報・注意報の段は、気象庁の配色の指針の色で塗ったラベルにする** (4 章の色と、指針の表 1-2 の噴火警報・予報の色、表 1-1 の警戒レベルの色。`Intensity.svelte`・`Grade.svelte`・`VolcanoLevel.svelte`・`WarningLevel.svelte`)。denpa の「状態の色は状態だけ」とは別の、色そのものが意味を持つもの (denpa のリモコンの色のキーと同じ扱い)。 色だけに頼らず、ラベルにはいつも「5弱」「津波警報」と字で書く。選んでいる印・オン・状態にはこの色を使わない -- **地図は操作の層ではなく中身** (地図の上に操作は重ねない)。層はいつも全部出し、切り替えは置かない (色の意味は「出典と注意」の「地図の見方」)。地図の上にあるのは MapLibre の出典の (i) と、震度のラベル・震央の × と、現在地のボタンだけ。出典の (i) は畳んでおき、同じ出典は注意文の下にいつも出す +- **地図は操作の層ではなく中身** (地図の上に操作は重ねない)。層はいつも全部出し、切り替えは置かない (色の意味は「出典と注意」の「地図の見方」)。地図の上にあるのは MapLibre の出典の (i) と、震度のラベル・震央の × と、ハザードマップの選択と、現在地のボタンだけ。出典の (i) は畳んでおき、同じ出典は注意文の下にいつも出す + - 例外: ハザードマップの選択 (左上のカプセル)。持ち主の決定 (2026-11-14) で、層の切り替えを置かない中で、色がぶつかるハザードマップだけは 1 つを選ぶ。地図に重なるので操作の層に乗せ、選んでいる間はメニューを開くボタンと同じ短い下線 (`data-on`)。選択肢はメニューの左の縦線。選んだものの公式の凡例 (画像) をその下にメニューと同じ面で出す (凡例の画像は白い地なので、暗いテーマでも白い台に載せる) - 例外: 現在地のボタン (右上の丸) は、地図で自分のいる所を探す操作なので地図の上に置く。地図 (動く中身) に重なるので操作の層 (面と影) に乗せ、オンは並びの外の切り替えと同じく主の色のアイコンと短い下線。押している間だけ `watchPosition` で追い、白い縁の青い点と誤差の円を描く。初めて取れたときだけそこへ寄せる (追う間に勝手に動かさない)。**緯度・経度は端末の中で描くだけで、サーバーには送らない**。許可されなかったときは追うのをやめ、ボタンの下に「位置の利用が許可されていません。…」と出す - 広い形は地図の箱を件の面と同じ角 (`--so-item-radius`) で切る。スマホの形は画面いっぱいで角を付けない - **広い形の列は右の 1 本 (一覧か詳しい内容) だけにし、残りの幅を地図に回す。** denpa の観る画面 (映像と右の列) と同じく、主の中身 (地図) を左に、添える列を右に置く (denpa の左はナビゲーションの場所)。地図が主なので、ずっと見ていなくてよいもの (カレンダー・状態) は列に並べず、押したときだけ出すメニューに畳む。 diff --git a/docs/map.md b/docs/map.md index 1be8904..776a1f2 100644 --- a/docs/map.md +++ b/docs/map.md @@ -1,27 +1,31 @@ # 地図の層と出典 地図 (1 つの画面の左の広い所。スマホの形は「地図」のタブ。[docs/ui.md](ui.md)) は MapLibre GL JS で描く (選んだ理由は docs/design.md の 4 章)。 -下地は国土地理院のシームレス空中写真で、その上に付加情報の層を重ねる。**層はいつも全部出し、オン・オフは置かない** (持ち主の決定、2026-11-14)。 +下地は国土地理院のシームレス空中写真で、その上に道路・地名・施設の記号 (地理院地図Vector) と付加情報の層を重ねる。**層はいつも全部出し、オン・オフは置かない** (持ち主の決定、2026-11-14)。例外はハザードマップで、色がぶつかるので、なし・洪水・土砂災害・津波から 1 つだけを選ぶ (既定はなし)。 色の意味は「出典と注意」の窓の「地図の見方」に書く (`#lib/map/style.ts` の `MAP_LEGEND`)。前に層のオン・オフを覚えていた localStorage の `sonae.map.layers` は読まず、開いたときに消す。 機能は Zero Quake の「付加情報を重ねて切り替えられる」ことだけを参考にした。コードは読んでいない。 ## 層と、そのデータの出典・ライセンス -| 層 | データ | 出典・ライセンス | -| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| 下地 (いつも) | 地理院タイル「写真」 `https://cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.jpg` (ズーム 2〜18) | 国土地理院コンテンツ利用規約。申請は要らず、出典「国土地理院」と[地理院タイル一覧](https://maps.gsi.go.jp/development/ichiran.html)へのリンクを示す。ズーム 2〜8 は世界衛星モザイク、9〜13 は全国ランドサットモザイク、14〜18 はシームレス空中写真なので、一覧の備考どおり Landsat8・GEBCO・NASA LP DAAC/USGS EROS・GRUS (© Axelspace) の出典も出す | -| 各地の震度 | 気象庁の地震情報 (XML) の地域ごとの震度で、地震情報／細分区域の面を塗る。地域の上に震度のラベル | 面: 気象庁 [予報区等 GIS データ](https://www.data.jma.go.jp/developer/gis.html) 「地震情報／細分区域」(2024-05-20) を簡略化。気象庁ホームページの利用規約 (公共データ利用規約 第 1.0 版、CC BY 4.0 と互換)。色は気象庁の配色の指針 | -| 震源 | 地震情報の震源 (新しい 50 件の点。色は深さ、大きさは M、新しいものほど上)。選んだ地震は × の印 | 気象庁 防災情報 XML・P2P地震情報 | -| 津波の警報・注意報 | いま出ている津波の区分で、津波予報区の線を塗る (大津波警報は太さ 2 倍) | 線: 気象庁 予報区等 GIS データ「津波予報区」(2024-05-20) を簡略化。利用規約は同じ | -| 長周期地震動階級 | 地図に出している地震の、長周期地震動に関する観測情報 (VXSE62) の地域ごとの階級で、細分区域を階級の色の太い枠で囲む (階級 1 以上)。色の決め方は docs/design.md の 2.7 | 気象庁 防災情報 XML。区域の面は上の細分区域 | -| 緊急地震速報 | 出ている緊急地震速報の震央 (×) と、警報が出た地域 (細分区域の面を赤く)。**予想震度は出さない** | 中身は Wolfx Project・P2P地震情報 (どちらも非公式で無保証)。面は上の細分区域 | -| 気象警報・注意報 | いま出ている気象警報・注意報のいちばん高い段で、市町村等の面を塗る (透明度 0.6、震度の面の下)。色は配色の指針 表 1-1 (docs/design.md の 4 章) | 中身: 気象庁 防災情報 XML (VPWW55〜61)。面: 気象庁 予報区等 GIS データ「市町村等（気象警報等）」(2026-02-26。令和 8 年 5 月下旬からの区域) を簡略化。利用規約は同じ | -| 海外の地震 | 海外の地震の新しい 50 件の点 (白い縁の丸。色は深さ、大きさは M)。選んだ海外の地震は × の印で、地図を引いて (ズーム 4) そこへ寄せる | USGS の GeoJSON フィード (「Credit: U.S. Geological Survey」、U.S. Public Domain)・EMSC の WebSocket (「Credit: EMSC-CSEM SeismicPortal」、CC BY 4.0)・GeoNet (謝辞の文、CC BY 3.0 NZ)・中央氣象署 (政府資料開放授權條款 第 1 版) | -| 火山 | 受けた噴火警報・予報で警戒の段が 2 以上の火山と、選んだ火山の情報の火山を三角の印で置く。色は警戒の段 (気象庁の配色の指針 表 1-2)、中に段の数字。選んだ火山は大きく出し、そこへ寄せる | 中身: 気象庁 防災情報 XML (VFVO50・56)。位置は電文の位置、噴火速報のように位置の無いものは気象庁ホームページの活火山の一覧 (`https://www.jma.go.jp/bosai/volcano/const/volcano_list.json`) を `tools/volcanoes/build.sh` で `static/areas/volcano-points.json` にしたもの。どちらも気象庁ホームページの利用規約。一覧の JSON はホームページの表示用で、形が変わったら作り直す | -| 区域の境界 | 地震情報／細分区域の境界線 | 気象庁 予報区等 GIS データ | -| 現在地 | 右上のボタンを押している間だけ、ブラウザの `navigator.geolocation.watchPosition` の位置に白い縁の青い点と、誤差 (`accuracy`、メートル) の円を描く。初めて取れたときだけ寄せる | 端末の位置。サーバーには送らない (描くのは端末の中だけ) | -| 活断層 | 地理院タイル「活断層図（都市圏活断層図）」 `https://cyberjapandata.gsi.go.jp/xyz/afm/{z}/{x}/{y}.png` (ズーム 11〜16) | 国土地理院コンテンツ利用規約。出典「国土地理院 (都市圏活断層図)」。引用するときは調査者名を書く (一覧の備考)。大きく寄せたときだけ出る | +| 層 | データ | 出典・ライセンス | +| ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| 下地 (いつも) | 地理院タイル「写真」 `https://cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.jpg` (ズーム 2〜18) | 国土地理院コンテンツ利用規約。申請は要らず、出典「国土地理院」と[地理院タイル一覧](https://maps.gsi.go.jp/development/ichiran.html)へのリンクを示す。ズーム 2〜8 は世界衛星モザイク、9〜13 は全国ランドサットモザイク、14〜18 はシームレス空中写真なので、一覧の備考どおり Landsat8・GEBCO・NASA LP DAAC/USGS EROS・GRUS (© Axelspace) の出典も出す | +| 各地の震度 | 気象庁の地震情報 (XML) の地域ごとの震度で、地震情報／細分区域の面を塗る。地域の上に震度のラベル | 面: 気象庁 [予報区等 GIS データ](https://www.data.jma.go.jp/developer/gis.html) 「地震情報／細分区域」(2024-05-20) を簡略化。気象庁ホームページの利用規約 (公共データ利用規約 第 1.0 版、CC BY 4.0 と互換)。色は気象庁の配色の指針 | +| 震源 | 地震情報の震源 (新しい 50 件の点。色は深さ、大きさは M、新しいものほど上)。選んだ地震は × の印 | 気象庁 防災情報 XML・P2P地震情報 | +| 津波の警報・注意報 | いま出ている津波の区分で、津波予報区の線を塗る (大津波警報は太さ 2 倍) | 線: 気象庁 予報区等 GIS データ「津波予報区」(2024-05-20) を簡略化。利用規約は同じ | +| 長周期地震動階級 | 地図に出している地震の、長周期地震動に関する観測情報 (VXSE62) の地域ごとの階級で、細分区域を階級の色の太い枠で囲む (階級 1 以上)。色の決め方は docs/design.md の 2.7 | 気象庁 防災情報 XML。区域の面は上の細分区域 | +| 緊急地震速報 | 出ている緊急地震速報の震央 (×) と、警報が出た地域 (細分区域の面を赤く)。**予想震度は出さない** | 中身は Wolfx Project・P2P地震情報 (どちらも非公式で無保証)。面は上の細分区域 | +| 気象警報・注意報 | いま出ている気象警報・注意報のいちばん高い段で、市町村等の面を塗る (透明度 0.6、震度の面の下)。色は配色の指針 表 1-1 (docs/design.md の 4 章) | 中身: 気象庁 防災情報 XML (VPWW55〜61)。面: 気象庁 予報区等 GIS データ「市町村等（気象警報等）」(2026-02-26。令和 8 年 5 月下旬からの区域) を簡略化。利用規約は同じ | +| 海外の地震 | 海外の地震の新しい 50 件の点 (白い縁の丸。色は深さ、大きさは M)。選んだ海外の地震は × の印で、地図を引いて (ズーム 4) そこへ寄せる | USGS の GeoJSON フィード (「Credit: U.S. Geological Survey」、U.S. Public Domain)・EMSC の WebSocket (「Credit: EMSC-CSEM SeismicPortal」、CC BY 4.0)・GeoNet (謝辞の文、CC BY 3.0 NZ)・中央氣象署 (政府資料開放授權條款 第 1 版) | +| 火山 | 受けた噴火警報・予報で警戒の段が 2 以上の火山と、選んだ火山の情報の火山を三角の印で置く。色は警戒の段 (気象庁の配色の指針 表 1-2)、中に段の数字。選んだ火山は大きく出し、そこへ寄せる | 中身: 気象庁 防災情報 XML (VFVO50・56)。位置は電文の位置、噴火速報のように位置の無いものは気象庁ホームページの活火山の一覧 (`https://www.jma.go.jp/bosai/volcano/const/volcano_list.json`) を `tools/volcanoes/build.sh` で `static/areas/volcano-points.json` にしたもの。どちらも気象庁ホームページの利用規約。一覧の JSON はホームページの表示用で、形が変わったら作り直す | +| 区域の境界 | 地震情報／細分区域の境界線 | 気象庁 予報区等 GIS データ | +| 現在地 | 右上のボタンを押している間だけ、ブラウザの `navigator.geolocation.watchPosition` の位置に白い縁の青い点と、誤差 (`accuracy`、メートル) の円を描く。初めて取れたときだけ寄せる | 端末の位置。サーバーには送らない (描くのは端末の中だけ) | +| 活断層 | 地理院タイル「活断層図（都市圏活断層図）」 `https://cyberjapandata.gsi.go.jp/xyz/afm/{z}/{x}/{y}.png` (ズーム 11〜16) | 国土地理院コンテンツ利用規約。出典「国土地理院 (都市圏活断層図)」。引用するときは調査者名を書く (一覧の備考)。大きく寄せたときだけ出る | +| 道路 | 地理院地図Vector (国土地理院最適化ベクトルタイル) の道路中心線 (`RdCL`)。高速道路 (ズーム 6 から)・国道 (7)・都道府県道 (10)・ほかの道 (13) を、黒い縁取りの上に明るい線で引く (`roadLayers`) | 下の「地理院地図Vector」 | +| 地名と施設の記号 | 地理院地図Vector の注記 (`Anno`)。国土地理院のスタイル `std.json` の注記の層 9 つを `tools/gsi/build.ts` で取り出し、字を白・縁を黒く太くし、字体を端末の字体に替えたもの (`static/map/gsi/anno.json`)。記号は同じリポジトリのスプライトを自分で配る (`static/map/gsi/sprite/`) | 下の「地理院地図Vector」 | +| 指定緊急避難場所・指定避難所 | 地理院タイルの GeoJSON。指定緊急避難場所は災害ごとの `skhb01`〜`skhb08` (洪水・崖崩れ等・高潮・地震・津波・大規模な火事・内水氾濫・火山現象)、指定避難所は `sih`。タイルはズーム 10 だけなので、ズーム 14 から見ている範囲のタイル (4 つまで) を読み、同じ施設を 1 つにまとめて緑の「避」の印で置く。押すと名前・住所・対応する災害と、指定避難所かどうかを出す | 国土地理院コンテンツ利用規約と「ご利用上の注意」。出典「国土地理院」。最新でないことや載っていない施設があるので、吹き出しと「地図の見方」に「市町村の情報で確かめてください」と書く。「指定緊急避難場所」(逃げる場所。災害ごと) と「指定避難所」(暮らす場所) は分けて書く | +| ハザードマップ | 重ねるハザードマップのラスタータイル (`https://disaportaldata.gsi.go.jp/raster/<層>/{z}/{x}/{y}.png`、ズーム 2〜17)。洪水浸水想定区域 (想定最大規模) `01_flood_l2_shinsuishin_data`・土砂災害警戒区域 `05_dosekiryukeikaikuiki`・`05_kyukeishakeikaikuiki`・`05_jisuberikeikaikuiki`・津波浸水想定 `04_tsunami_newlegend_data`。地図の左上の「ハザードマップ」で、なし・洪水・土砂災害・津波から 1 つだけ選ぶ (色がぶつかるので重ねない。既定はなし、端末に覚える `sonae.map.hazard`)。選んだものの公式の凡例の画像 (`https://disaportal.gsi.go.jp/hazardmap/copyright/img/`) をその下に出す | [ハザードマップポータルサイトのオープンデータ](https://disaportal.gsi.go.jp/hazardmap/copyright/opendata.html): URL からそのまま読んでアプリで使ってよく (商用・非商用とも)、申請の記載は無い。出典「ハザードマップポータルサイト」。国が作ったように見せない。土砂災害警戒区域は国土数値情報の利用規約と都道府県の条件にも従う (県ごとの条件は確かめていない)。洪水・津波は載っていない県・川があるので、凡例の下に「色が無くても安全とは限りません」と書く | 細分区域と津波予報区の GeoJSON は `tools/areas/build.sh` で作り、`static/areas/` に置く (mapshaper で簡略化。 細分区域 約 1.7MB・gzip 約 220KB、津波予報区 約 560KB・gzip 約 86KB)。気象庁の GIS データの更新 (年に 1〜2 回) を @@ -38,14 +42,29 @@ sonae の画面には気象庁の GIS データの出典を出す。 - 地震情報／細分区域はコード表に対応が無いので、市町村等の面の中の 1 点がどの細分区域の面に入るかで決める - GIS データのコードの無い面 (北方領土と、境界の決まっていない土地の 16 件) は除く +## 地理院地図Vector と字体 + +確かめた日: 2026-11-14 (国土地理院の公式のページと、配信の応答で)。 + +- **配信:** `https://cyberjapandata.gsi.go.jp/xyz/optimal_bvmap-v1/optimal_bvmap-v1.pmtiles` (PMTiles の 1 ファイル、約 16.9 GB、ズーム 4〜16)。範囲 (Range) を指定して要るタイルだけを読み、CORS は `*`。`pmtiles` (Protomaps、BSD-3-Clause) で MapLibre に読ませる。 + 前の `{z}/{x}/{y}.pbf` も応答するが、データは 2023-10 で止まり、README に「公開を停止する予定」とあるので使わない +- **位置づけ:** 試験公開 (2022-09 から「公開終了まで」)。URL や属性が変わることがあると書かれている。変わったら `GSI_VECTOR_URL` と `tools/gsi/build.ts` を直す +- **条件:** [README](https://github.com/gsi-cyberjapan/optimal_bvmap) は国土地理院コンテンツ利用規約 (公共データ利用規約 第 1.0 版) で使えるとしている。基本測量成果ではないので測量法の申請は要らない。出典は「国土地理院最適化ベクトルタイル」と書き、加工したことも書く。 + リポジトリに LICENSE のファイルは無い (GitHub のライセンス表示も無い)。スタイルとスプライトもこの README の条件で使えると読んだ +- **読む量:** ベクトルのタイルは 1 枚 20〜110 KB。層ごとの最小のズームより引いているときは読まない (日本全体を見ているときは読まない)。PMTiles の目次は初めに 16 KB と、要る所のディレクトリを読む +- **字体 (glyphs) は読まない。** MapLibre 6 は、スタイルに `glyphs` の URL が無いと、字を端末の字体でその場で描く (TinySDF)。漢字・かなはもともと端末で描いている。そのため PBF の字体を作って配る必要もなく、外から字体を読むことも無い。 + 字体の名前は `"Noto Sans JP", sans-serif` で、入っていない端末は端末の既定のゴシックで描く。持ち主の頼みは「Noto Sans JP から PBF を作って自分で配る」だったが、字体を 1 つも読まずに済むこの形にした (束も 0 KB) +- **記号 (スプライト):** 国土地理院のスタイルのスプライト (`sprite/std`、約 110 KB) を `tools/gsi/build.ts` で写して自分で配る +- **写真の上で読む:** 地名は白い字に黒い縁 (幅 1.6)、道路は黒い縁取りの上に明るい線。国土地理院のスタイルの道路の色 (地図の地に合わせた色) は写真の上で沈むので使わない + ## 入れなかったもの -| もの | 理由 | -| ------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| プレート境界 | 国土地理院の地理院タイルの一覧にも、気象庁の GIS データにも無い。ほかの機関のデータ (研究用の境界の線) は利用条件をそれぞれ確かめる必要があり、公式のデータに絞る方針から外した | -| 観測点ごとの震度の点 | 震度観測点の緯度・経度を、気象庁が機械で読める形で出していない。地域 (細分区域) ごとの震度で塗る | -| 地図の字 (ベクトルの注記) | 字を描く字体 (glyphs) を外から読むのを避けたい。淡色地図の下地もやめたので、いまは地名を出していない (足すときは字体を自分で持つ)。震度のラベルは DOM の印で置く | -| PMTiles | いまの区域の GeoJSON は小さく、そのまま読める。区域を細かくする (市町村など) ときに考える | +| もの | 理由 | +| ---------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| プレート境界 | 国土地理院の地理院タイルの一覧にも、気象庁の GIS データにも無い。ほかの機関のデータ (研究用の境界の線) は利用条件をそれぞれ確かめる必要があり、公式のデータに絞る方針から外した | +| 観測点ごとの震度の点 | 震度観測点の緯度・経度を、気象庁が機械で読める形で出していない。地域 (細分区域) ごとの震度で塗る | +| PMTiles (自分で作る) | 気象庁の区域の GeoJSON は小さく、そのまま読める。地理院地図Vector は国土地理院が配る PMTiles をそのまま読む | +| 指定避難所・避難場所の全国のデータを自分で配る | 全国で数十万件あり、画面の束に入れるには大きい。ズーム 14 から見ている所のタイルだけを国土地理院から読む | ## 描き方の決まり (docs/design.md の 6 章) diff --git a/docs/ui.md b/docs/ui.md index 917f3b9..3d92abb 100644 --- a/docs/ui.md +++ b/docs/ui.md @@ -30,7 +30,9 @@ sonae の画面は 1 つです (`src/routes/+page.svelte`)。地図が主で、 - 列の上 (巻かずに残る) に、種類のチップ (入りきらなければ折り返す) と、右端のカレンダーのボタンがあります。 カレンダーはメニューで開き、行のある日を押すとその日の見出しへ送って閉じます - 地図の右上に現在地のボタンがあります (スマホの形も)。押すと端末の位置を追い、白い縁の青い点と位置の誤差の円を出し、初めて取れたときだけそこへ寄せます。もう一度押すとやめます。位置はサーバーに送りません。許可されていないときは、ボタンの下にそう出します -- 地図の層はいつも全部出していて、切り替えはありません。色の意味は「出典と注意」の「地図の見方」にあります ([map.md](map.md)) +- 地図の左上に「ハザードマップ: なし」の選択があります (スマホの形も)。なし・洪水・土砂災害・津波から 1 つを選ぶと、そのハザードマップを写真の上に重ね、その下に公式の凡例を出します。選んだものは端末に覚えます +- 写真の上に道路・地名・施設の記号を重ね、大きく寄せると指定緊急避難場所・指定避難所の印が出ます。印を押すと、名前・住所・対応する災害を吹き出しで出します +- 地図の層はいつも全部出していて、切り替えはありません (ハザードマップだけは色がぶつかるので 1 つを選ぶ)。色の意味は「出典と注意」の「地図の見方」にあります ([map.md](map.md)) ## スマホの形 (1000px 未満) diff --git a/package.json b/package.json index 2b29ca4..038dbb1 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@typescript/native": "npm:typescript@7", "maplibre-gl": "^6.18.0", "oxlint": "^1.93.0", + "pmtiles": "^4.5.0", "svelte": "^5.57.3", "svelte-check": "^4.7.8", "typescript": "~6.0.3", diff --git a/src/lib/components/QuakeMap.svelte b/src/lib/components/QuakeMap.svelte index 5f465d3..4c50be1 100644 --- a/src/lib/components/QuakeMap.svelte +++ b/src/lib/components/QuakeMap.svelte @@ -1,13 +1,15 @@