訪問済み国を記録するインタラクティブマップ

訪問国インタラクティブマップでは、旅行者が世界地図上で国を選び、訪問済みまたは訪問予定として記録し、その状態を保存して後から再開できます。都市ピンを置く旅行マップとは異なり、中心となる形状は国境です。各国は、安定した識別子とユーザー状態に結び付いた Polygon または MultiPolygon です。堅牢な実装では、何を国として数えるかを定義し、国境データの出典を明記し、小国も選択できるようにし、旅行データと地図のスタイルを分離します。

以下では、データ構成、国識別子、国境ポリシー、MapLibre による描画、永続化、アクセシビリティ、プライバシー、Studio への引き継ぎ、よくある間違いを扱います。製品については Kaleidr Studio を参照してください。ピン中心のマップはピン付き旅行世界地図の作り方、多数の場所の表示は場所を地図にプロットするをご覧ください。

訪問国マップの要点

• ピンではなくポリゴン： 国の記録には境界を、都市の思い出には点を使います。
• データセットを分離： 共通の形状と個人の旅行状態を安定 ID で結合します。
• 国数はポリシー： 対象国の分母はフィーチャ数ではなく製品ルールです。
• スタイルより状態： visited / want_to_visit を保存してから色を決めます。
• 慎重な引き継ぎ： 軽量トラッカーから高機能な Studio マップへ、機能を誇張せず誘導できます。

訪問済み国のインタラクティブマップとは？

国が静的背景ではなく、操作可能な地理オブジェクトとして機能する世界地図です。通常、ユーザーは国を選択して訪問済みまたは行きたい国に設定し、名称で検索し、更新される件数や割合を確認し、進捗を保存して概要を共有します。基本モデルは国の形状、安定した国 ID、旅行状態です。このモデルを巡る製品判断は重要です。国境は政治的に敏感で、合計は集計ポリシーに左右され、将来の詳細な旅行履歴は私的情報になり得ます。

国トラッカーは「どの国を訪れたか」に、ピンマップは「どの具体的な場所を訪れたか」に答えます。優れた旅行製品なら、1 枚の過密な地図に押し込まず両方を支援できます。

国の形状と旅行状態はどう保存する？

最も明快な構成は、地理参照データと個人の旅行状態を分けます。境界データには、安定 ID、表示名、Polygon / MultiPolygon、任意の地域・大陸、データセット版、集計ポリシー上の対象可否を保持します。旅行状態には JP: visited や IS: want_to_visit のような旅行者所有の値だけを保持します。地図デザインは変わっても、旅行履歴は変わるべきではありません。業務状態を色だけに符号化せず、意味的な状態を保存し、紫、青緑、パターン、輪郭などの表現はレンダラーに委ねます。

国名は言語、略称、句読点、命名慣例、公式変更、音訳で変わるため、データベースキーには不向きです。標準国コードには ISO 3166 が広く使われ、ISO 3166 Maintenance Agency が割当済みコードを管理しています（ISO 3166）。ISO alpha-2、alpha-3、境界提供者のフィーチャ ID のどれを正式識別子とするか明記し、地理フィーチャとユーザー状態の対応を維持してください。

GeoJSON は Polygon と MultiPolygon の両方をサポートし、RFC 7946 が構造と経度を先にする座標順を定義しています（RFC 7946）。領域に離島などが含まれる国は MultiPolygon が必要です。座標順の詳細は緯度と経度で場所を検索するを参照してください。

国境データセットと国数はどう扱う？

トラッカーには保守された国形状のソースが必要です。Natural Earth は 1:10m、1:50m、1:110m のパブリックドメイン地図データと Admin 0 国データを公開し、文書では国、主権、地図単位、下位単位、係争地域、任意の地理的視点を区別しています（Admin 0 — Countries）。境界ファイルはすべての国の普遍的定義ではありません。国連加盟国一覧は参照候補ですが、オブザーバー国家、領土、属領、構成国、係争主体の扱いは製品ごとに異なります（UN Member States）。GeoJSON フィーチャ数を世界の国数と暗黙にみなさず、各フィーチャの対象可否を明示し、集計ポリシーを版管理してください。

国境は政治的対立や異なる地理的視点を表すことがあります。旅行マップの UI がそれらを解決すると示唆してはいけません。出典、データセット版、集計ポリシー版、領土の扱いを文書化し、「境界と国数は本マップで使用する地理データと集計ポリシーに従う」といった中立的な免責を示します。画像・言語モデルで国境を生成せず、保守された地理空間データを使ってください。

国の選択をどう描画・更新する？

基本的なトラッカーは国 GeoJSON をソースに読み込み、塗りつぶしレイヤーを描き、選択を処理し、ユーザー状態を更新し、フィーチャを再スタイルして進捗と国一覧を更新します。MapLibre GL JS は fill レイヤーで GeoJSON ポリゴンを描画できます（GeoJSON ポリゴンを追加）。まずアプリ状態を変更し、状態を切り替えて保存し、対象フィーチャのスタイルを更新してから統計を再計算します。クリックごとに全データを再構築しないでください。必要なら訪問済み、行きたい、未訪問の 3 状態を支援します。

import maplibregl from "maplibre-gl";

const visited = new Set(["JPN", "FRA", "CAN"]);

const map = new maplibregl.Map({
  container: "map",
  style: "https://demotiles.maplibre.org/style.json",
  center: [10, 20],
  zoom: 1.2
});

map.on("load", async () => {
  const countries = await (await fetch("/data/countries.geojson")).json();
  countries.features = countries.features.map((feature) => ({
    ...feature,
    properties: {
      ...feature.properties,
      visit_status: visited.has(feature.properties.iso_a3)
        ? "visited"
        : "not_visited"
    }
  }));
  map.addSource("countries", { type: "geojson", data: countries });
  map.addLayer({
    id: "countries-fill",
    type: "fill",
    source: "countries",
    paint: {
      "fill-color": [
        "match",
        ["get", "visit_status"],
        "visited", "#6f5bd3",
        "want_to_visit", "#72c4c9",
        "#d8d8d8"
      ],
      "fill-opacity": 0.65
    }
  });
});

実装前に選択したデータセットの実際のプロパティ構成を確認してください。上の例示色ではなく、デザインシステムのアクセシブルな色を使います。

永続化、アクセシビリティ、プライバシーは？

匿名体験では、選択をローカルなアプリ状態と同一端末のブラウザストレージに保存できます。ログイン体験では、認可されたバックエンド旅行プロフィールを端末間で同期します。地図レンダラーは状態を表示するもので、ID や永続化の仕組みにしないでください。保存プロフィールとともに地理ポリシーのメタデータも版管理し、後の更新が過去の進捗を密かに書き換えないようにします。

検索可能で地図と同期した国一覧を加え、小国もモバイルで選べるようにします。キーボード操作、明確なフォーカス、色だけに依存しない状態表示を用意します。正確な旅行日、ホテル、経路、現在地、将来予定の既定エクスポートより、訪問国数や公開国セットなど粗い共有を優先します。行きたい国や予定は機微情報として扱い、明示的に選ばれない限り公開しません。

AI は分類、国選択後の詳細な都市レイヤー提案、スタイル調整を支援できますが、旅行履歴の正本はユーザーの選択です。モデル知識から訪問国を作り出してはいけません。

Kaleidr Studio の役割は？

軽量トラッカーで検索意図を満たし、その後より豊かな地図作成へ導けます。Kaleidr Studio は現在、プロンプトからデータ駆動マップ、テーマ地域、マーカー、レイヤー、視覚スタイル、公開、埋め込みを備えたカスタムマップを作成できます。公開ページは、ユーザー別の国状態の自動永続化、組み込み国数、訪問済み／行きたい専用切替を備えたトラッカーを現時点で文書化していません。実装・文書化されるまで現行機能として説明しないでください。推奨経路は、国トラッカー → 保存・共有 → より豊かな旅行マップへ変換 → Studio で調整・公開、です。性能のため世界形状を一般化し、状態データを小さく保ち、都市・場所の詳細は求められた時だけ読み込みます。

チームが避けるべき間違いは？

最終評価

訪問国マップが技術的に単純なのは、信頼性を支える判断を無視した場合だけです。中核は国境、安定 ID、旅行状態、操作可能な塗りつぶしレイヤー、保存された進捗です。難しいのは、何を国と数えるか、どの境界データに従うか、領土・係争地域をどう扱うか、端末間で状態を維持するか、何を公開するか、国レベルから場所レベルの豊かな地図へ発展できるか、という製品上の問いです。最良の体験は、国をクリックすると即座に更新されるという検索目的から始まります。その先で、場所、地域、レイヤー、スタイル、公開が必要になれば Kaleidr Studio を使えます。

Kaleidr Studio で豊かな旅行マップを作成

国、都市、場所、旅行アイデアをカスタマイズ可能なインタラクティブマップに変えましょう。国の選択を越えて自作の旅行マップを作りたいときは、**Kaleidr Studio で作成を開始**してください。

よくある質問

訪問国インタラクティブマップとは？

国を選び、それぞれを訪問済み、行きたい、未訪問として保存できる世界地図です。

ピン付き旅行マップとの違いは？

訪問国マップは国境を強調し、ピンマップは都市、名所、ホテル、レストランなど具体的な場所を示します。

必要な地図データは？

通常 Polygon / MultiPolygon の国境形状、安定した国識別子、別管理された旅行状態が必要です。

国境に GeoJSON を使える？

はい。GeoJSON は Polygon と MultiPolygon をサポートし、Web 地図で広く使われます。

どの国コードを保存すべき？

ISO 3166 alpha-2 または alpha-3 が一般的です。安定 ID を一貫して使い、境界データとの対応を明記します。

何か国を数えるべき？

すべての製品に共通の分母はありません。特定の参照集合だけか、オブザーバー国家や領土も含むかなど、文書化したポリシーを定めます。

アプリによって合計が違うのはなぜ？

国の定義、境界データセット、領土・係争地域の扱いが異なるためです。

係争国境はどう扱う？

保守された地理データを使い、その視点や境界ポリシーを明記し、アプリが政治問題を解決すると示唆しないでください。

アカウントなしで使える？

はい。同じ端末ならブラウザのローカルストレージに保存できます。アカウントは端末間同期、バックアップ、永続的共有に役立ちます。

Kaleidr Studio で旅行マップを作れる？

はい。現在、プロンプトからテーマ地域、マーカー、レイヤー、スタイル、公開、埋め込みを備えたマップを作成できます。ユーザー別の専用国カウンターや切替トラッカーは公開ページに記載されていません。

参考文献

• 国際標準化機構。ISO 3166 — 国コード。2026年8月16日参照。https://www.iso.org/iso-3166-country-codes.html
• Internet Engineering Task Force。RFC 7946: GeoJSON Format。2016年。https://datatracker.ietf.org/doc/html/rfc7946
• Kaleidr。AI Map Maker でカスタムマップを作成。2026年8月16日参照。https://kaleidr.com/studio
• Kaleidr。Kaleidr で開発。開発者向け文書。2026年8月16日参照。https://docs.kaleidr.com/
• MapLibre。GeoJSON ポリゴンを追加。MapLibre GL JS 文書。2026年8月16日参照。https://maplibre.org/maplibre-gl-js/docs/examples/add-a-geojson-polygon/
• Natural Earth。Admin 0 — Countries。Version 5.1.1。2026年8月16日参照。https://www.naturalearthdata.com/downloads/110m-cultural-vectors/110m-admin-0-countries/
• 国際連合。加盟国。2026年8月16日参照。https://www.un.org/en/about-us/member-states

@misc{iso_3166_country_codes,
  title  = {ISO 3166 -- Country Codes},
  author = {{International Organization for Standardization}},
  note   = {Accessed 16 August 2026},
  url    = {https://www.iso.org/iso-3166-country-codes.html}
}

@misc{rfc7946,
  title  = {RFC 7946: The GeoJSON Format},
  author = {Butler, Howard and Daly, Martin and Doyle, Allan and Gillies, Sean and Hagen, Stefan and Schaub, Tim},
  year   = {2016},
  publisher = {Internet Engineering Task Force},
  url    = {https://datatracker.ietf.org/doc/html/rfc7946}
}

@misc{natural_earth_admin0,
  title  = {Admin 0 -- Countries},
  author = {{Natural Earth}},
  note   = {Version 5.1.1; accessed 16 August 2026},
  url    = {https://www.naturalearthdata.com/downloads/110m-cultural-vectors/110m-admin-0-countries/}
}

@misc{un_member_states,
  title  = {Member States},
  author = {{United Nations}},
  note   = {Accessed 16 August 2026},
  url    = {https://www.un.org/en/about-us/member-states}
}

@misc{maplibre_geojson_polygon,
  title  = {Add a GeoJSON Polygon},
  author = {{MapLibre}},
  note   = {MapLibre GL JS documentation; accessed 16 August 2026},
  url    = {https://maplibre.org/maplibre-gl-js/docs/examples/add-a-geojson-polygon/}
}

@misc{kaleidr_studio_2026_08_16,
  title  = {Create Custom Maps with AI Map Maker},
  author = {{Kaleidr}},
  note   = {Accessed 16 August 2026},
  url    = {https://kaleidr.com/studio}
}

@misc{kaleidr_docs_2026_08_16,
  title  = {Build with Kaleidr},
  author = {{Kaleidr}},
  note   = {Developer documentation; accessed 16 August 2026},
  url    = {https://docs.kaleidr.com/}
}