Home

JAXA Earth API for JavaScript

JAXA Earth API for JavaScript のAPIドキュメントです。 このAPIを利用すると、衛星画像を容易にブラウザ上に表示したり、衛星データを利用したウェブアプリを開発したりすることが可能です。

JAXA Earth API の概要についてはこちら、各種サンプルコードはこちらをご参照ください。

概要

JAXA Earth API では、地球観測衛星が観測した様々なデータセットを利用できます。 地形や地表面温度、海面水温などのデータセットがあります。 利用できるデータセットの詳細については、こちらをご参照ください。

JAXA Earth APIでは、それらの月別統計値なども予め計算したデータセットとして用意しています。 統計期間が異なる場合には、それぞれIDが異なる別のデータセットとして管理されています。

JAXA Earth API for JavaScript では、それらの各データセットに対応するものをImageCollectionオブジェクトと呼んでいます。 ImageCollectionオブジェクトの中には、観測日時(時刻ID(Tid))が異なるImageオブジェクトが複数格納されています。 各観測日時のデータが複数の値(バンド)を持つ場合もあります。 ImageCollectionオブジェクトに対して、観測日時とバンドを指定することで、Imageオブジェクトを取得します。

Imageオブジェクトに対しては、データを取得したい緯度経度範囲、出力する画像のサイズ（ピクセル数）、カラーマップを指定することで、必要な範囲のデータを必要な解像度で取得します。 データの読み込みが完了した後に、canvas要素(HTMLCanvasElement)やDataURLの画像としてブラウザ上に表示させたり、数値配列を操作して統計処理したり、カラーマップを切り替えたりすることが可能です。

必要な範囲のデータを必要な解像度で取り扱う仕組みになっているため、ブラウザ上で動作するJavaScriptであってもデータを取り扱うことが可能となっていることが特徴です。

使用方法

JAXA Earth API for JavaScript は、ES Module (ESM) 形式及び Universal Module Definition (UMD) 形式に対応しています。開発方法に応じてどちらかをご利用ください。

ESM 形式の場合

次のリンク先からモジュールのファイルをダウンロードしてください。

https://data.earth.jaxa.jp/api/javascript/v1.2.3/jaxa.earth.esm.js

次の通りHTMLファイルを作成します。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>esm</title>
</head>
<body>
	<script type="module"> //ESM形式の場合はtype="module"の記載が必須です。

		//モジュールのファイルを読み込みます。
		//HTMLファイルとjaxa.earth.esm.jsのファイルは同一フォルダにある想定です。
		import * as je from "./jaxa.earth.esm.js";

		//全てのクラスやメソッドはjeオブジェクトを使ってアクセスします。
		console.log(je);
		
		//ここにコードを記載します。
		
	</script>
</body>
</html>

ウェブサーバーを起動し、このHTMLにアクセスしてください。ESM形式のJavaScriptを実行するためにはウェブサーバーが必要です。HTMLファイルをダブルクリックで開いても動作しません。端末ローカルで実行する際はVSCodeのLive Server等をご利用ください。

UMD 形式の場合

次のリンク先からモジュールのファイルをダウンロードしてください。

https://data.earth.jaxa.jp/api/javascript/v1.2.3/jaxa.earth.umd.js

次の通りHTMLファイルを作成します。

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>umd</title>

	<!-- モジュールのファイルを読み込みます。-->
	<!-- HTMLファイルとjaxa.earth.umd.jsのファイルは同一フォルダにある想定です。-->
	<script src="./jaxa.earth.umd.js"></script>
</head>
<body>
	<script>
		//全てのクラスやメソッドはグローバルオブジェクトに定義されたjeを使ってアクセスします。
		console.log(je);

		//UMD形式ではトップレベルawaitはサポートされていません。
		//トップレベルawaitを模擬するために、非同期の即時実行関数式内に記述します。
		(async function(){
		
			//ここにコードを記載します。

		})();
	</script>
</body>
</html>

ブラウザでこのHTMLを開きます。UMD形式のJavaScriptを実行するためにはウェブサーバーは不要です。ダブルクリックで開いても動作します。

コードの例（ESM形式、UMD形式とも共通）

「//ここにコードを記載します。」の部分に記載するコードの例は次の通りです。 利用できるデータセットの詳細については、こちらをご参照ください。

const image = await je.getImage({
	//利用するデータセットのcollection.jsonのURLを記載します。
	collection: "https://s3.ap-northeast-1.wasabisys.com/je-pds/cog/v1/JAXA.EORC_ALOS.PRISM_AW3D30.v3.2_global/collection.json",

	//利用するデータセットのバンドを指定します。
	band: "DSM",

	//データを取得する緯度経度範囲を記載します。
	//[最小経度(西), 最小緯度(南), 最大経度(東), 最大緯度(北)]
	bbox: [-180, -90, 180, 90],

	//データを取得する画像のサイズをピクセル数で記載します。
	width: 1000,
	height: 500,

	//可視化用のカラーマップを指定します。
	colorMap: {
		//最小値
		min: 0,
		//最大値
		max: 6000,
		//最小値～最大値をjet（青～緑～黄～赤の虹色）で塗りつぶします。
		colors: "jet"
	}
});

//可視化した結果をHTMLCanvasElementとして取得し、HTML上に追加します。
document.body.appendChild(image.getCanvas());

実行結果の例はこちらへ

その他のサンプルコード

こちらのページに様々なサンプルコードを掲載しています。

時刻の考え方

JAXA Earth API では各データセットの時刻は世界時(UTC)で定義されています。JavaScriptのDateオブジェクトについては、通常は端末のローカル時刻に従って生成されるため、 JAXA Earth API for JavaScript で時刻を指定する際は、必ずUTCで指定するようにする必要があります。UTCで時刻を指定するには、Date.UTC()を使用します。

また、JavaScriptのDateオブジェクトについては、月を0～11で指定する必要があることにも注意が必要です。

// 2025/02/03 04:00:00 (UTC)を指定する場合
const date = new Date(Date.UTC(2025, 2 - 1, 3, 4, 0, 0));

ピクセルと緯度経度の考え方

JAXA Earth API ではピクセルの位置の定義で「Pixel is Area」を採用しています。 ピクセルの番号は、ピクセルの左上の位置で定義されています。 ピクセルは左上から右上へとi方向、上から下へとj方向に順番に並んでいます。

また、緯度経度は、北極や南極のデータセットを除いて等緯度経度(EPSG:4326)を採用しています。そのため、i,j方向の経度と緯度は等間隔になっています。

利用例

JAXA Earth API for JavaScript を使用した利用例は次の通りです。

海面上昇シミュレーター(国内版)

地形データとOpenLayersを用いて海面上昇をシミュレーションします。 スライドバーの設定に応じてカラーマップを切り替えることによって、瞬時に色を塗り替えています。

海面上昇シミュレーター(全球版)

地形データとOpenLayersを用いて海面上昇をシミュレーションします。 全球版では背景に表示されている陰影起伏図もJavaScriptを用いて動的に生成しています。

Observableのサンプルコード

Observableを用いることで、ブラウザ上でインタラクティブにJAXA Earth API for JavaScript を実行できます。

JAXA Earth Dashboard

OpenLayersを用いて、様々なデータを閲覧・利用などできるようにしたウェブサイトです。JAXA Earth API for JavaScript を利用して現在開発中です。

特集 気候変動2023

JAXA Earth API for JavaScript を利用して、日本周辺の海面水温の最新観測データを常時表示しています。

ライセンス

JAXA Earth API は一部のデータセットを使用する場合を除いて商用利用が可能です。 詳細については、こちらのページをご確認ください。

THIRD PARTY LICENSE(s):

お知らせ

  • 現在のバージョンでは、ブラウザ固有の機能や、ブラウザのメインスレッド専用の機能を利用している部分があるため、Node.jsやDeno、Bun、ウェブワーカーでは利用できません。次期バージョンでは対応予定です。