背景地図を変更する

更新日2026年7月30日

このガイドを終えると、プラグインから背景地図（地球上に表示されるベース画像）を変更できるようになります。このガイドは、reearth.yml と拡張ファイルの基本的な構造を把握していることを前提としています。

背景地図を変更するには、tiles 配列を指定して reearth.viewer.overrideProperty を呼び出します。各エントリがひとつのタイルソースを表します。Re:Earth Visualizer にはいくつかの組み込み背景地図が用意されており、名前で選択できます。また、URL を指定してカスタムのタイルサーバーを使うこともできます。

サンプルコード

この例では、背景地図を国土地理院標準地図に切り替えます。

reearth.yml

id: basemap-plugin
name: Basemap Plugin
version: 1.0.0
extensions:
  - id: basemap-demo
    type: widget
    name: Basemap Demo

basemap-demo.js

reearth.viewer.overrideProperty({
  tiles: [
    {
      id: "gsi",
      type: "japan_gsi_standard",
    },
  ],
});

結果

ウィジェットがロードされると、地球のベース画像が国土地理院標準地図に切り替わります。

Re Visualizer に表示された国土地理院標準地図の背景地図

仕組み

reearth.viewer.overrideProperty は実行時にビューアのプロパティを設定します。背景地図を変更するには tiles 配列を渡します。指定した画像が現在の背景地図と置き換わります。各タイルエントリには id（任意の一意な識別子）と、組み込みの type またはカスタムの url が必要です。

組み込み背景地図を使う

Re:Earth Visualizer の組み込み背景地図を使うには、type に背景地図の名前を設定します。URL は不要で、各組み込み背景地図はタイルの読み込み先を既に知っています。

タイプ	背景地図	Cesium Ion トークンが必要
`open_street_map`	OpenStreetMap	いいえ
`japan_gsi_standard`	国土地理院標準地図	いいえ
`carto_light`	CARTO ライト	いいえ
`default`	Cesium Ion デフォルト画像	はい
`default_road`	Cesium Ion ロードマップ	はい
`default_label`	Cesium Ion ラベル付き画像	はい
`black_marble`	夜の地球	はい

「はい」と表示されている背景地図は Cesium Ion から画像を読み込むため、シーンに Cesium Ion のアクセストークンが設定されている場合のみ使用できます。

カスタム背景地図を使う

上記のリストにないタイルサーバーを使う場合は、標準の {z}/{x}/{y} テンプレート形式で url を指定します。

reearth.viewer.overrideProperty({
  tiles: [
    {
      id: "custom",
      url: "https://example.com/tiles/{z}/{x}/{y}.png",
    },
  ],
});

次のステップ

reearth.viewer API リファレンス: overrideProperty とその他のビューアメソッド