JAXA Earth API for JavaScript
    検索インデックスを準備しています...

    概要

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

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

    データを取得する

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

    Imageは観測日時とバンドが特定された1つの全球データと考えることができます。 Imageに対しては、データを取得したい緯度経度範囲、出力する画像のサイズ(ピクセル数)を指定することで、必要な範囲、必要な解像度のデータを格納したDataObjectを取得します。

    DataObjectは、観測日時や緯度経度範囲、画像サイズが特定された一つのデータとして考えることができます。 可視化して閲覧可能な画像(HTMLCanvasElementやPNG画像など)にしたり、統計処理を行うことが可能です。

    getDataObjectを用いると必要な条件をまとめて指定して、DataObjectを簡易的に取得することも可能です。

    const dataObject = await je.getDataObject({
    collectionUrl: "https://s3.ap-northeast-1.wasabisys.com/je-pds/cog/v1/JAXA.EORC_ALOS.PRISM_AW3D30.v3.2_global/collection.json",
    bbox: [-180, -90, 180, 90], //[西, 南, 東, 北]
    width: 1000,
    height: 500,
    });

    ただし、内部ではImageCollectionImageの準備を毎回実行することになるため非効率です。 次のような場合は、ImageCollectionImageを直接扱って再利用することで効率化することが可能です。

    • 日付を変えながら時系列のデータを取得したい場合は、ImageCollectionを再利用します。
    • 緯度経度範囲を変えていろいろな場所のデータを取得したい場合は、Imageを再利用します。

    統計処理する

    DataObjectにはピクセルごとのデータが数値配列として格納されています。

    Inspectorを用いて特定の場所の値や座標を取得したり、statを用いて統計値を取得したり、createCsvでCSVファイルにしたり、数値配列を直接操作して独自の処理をしたりすることも可能です。

    computeを利用すると、ピクセル単位の演算をすることも可能で、単位変換をしたり、DataObject間の引き算により平年差算出をしたりすることが可能です。

    可視化する

    ColorMapにより、データの値に応じた色塗りの方法を指定します。

    const colorMap = new je.image.ColorMap({
    min: 0,
    max: 6000,
    colors: je.Colors.JET,
    });

    DataObjectColorMapの両方を使って、createCanvasによりHTMLCanvasElementを作成します。

    document.body.appendChild(je.image.createCanvas(dataObject, colorMap));
    

    のようにして、そのままブラウザの画面上に画像として表示させることが可能です。ただし、ブラウザのメインスレッド以外では使用できません。

    ブラウザのウェブワーカーでも処理させたい場合はOffscreenCanvasを使用します。createOffscreenCanvasによりウェブワーカー上でOffscreenCanvasとして画像を作成できます。ウェブワーカーで描画されたOffscreenCanvasImageBitmapに変換することでメインスレッドに転送することが可能で、ブラウザ上のHTMLCanvasElementに高速に描画できます。ただし、ブラウザ(メインスレッドまたはウェブワーカー)以外では使用できません。

    ブラウザ以外のサーバーサイドのJavaScript実行環境:Node.js、Deno、Bunでも処理させたい場合は、PNG画像として画像を出力します。 createPngにより、PNG画像のUint8Arrayに変換することが可能なため、

    import fs from "node:fs";
    // (中略)
    fs.writeFileSync("image.png", await je.image.createPng(dataObject, colorMap));

    のようにしてファイル保存することが可能です。また、ウェブサーバーで実行している場合は、

    import { Buffer } from "node:buffer";
    // (中略)
    res.type("png");
    res.send(Buffer.from((await je.image.createPng(dataObject, colorMap)).buffer));

    のようにウェブサーバーからPNG画像としてのレスポンスを返すことも可能です。

    地図APIと連携する

    現状動作確認ができているものとして、次の地図APIとフロントエンドのみの開発で連携可能です。

    サンプルコードの例はこちらをご参照ください。

    また、Node.jsなどを利用してウェブサーバー側で実行して簡易的なWMS/WMTSサーバーを作ることで、それ以外の一般的なWMS/WMTSに対応した地図APIと広く連携することも可能です。

    ImageGeneratorを使うことにより、WMS (Web Map Service) 方式のパラメータを使用して画像を作成できます。 Node.jsなどを利用してウェブサーバー側で実行することにより、簡易的なWMSサーバーを作ることも可能です。

    TileGeneratorを使うことにより、WMTS (Web Map Tile Service) 方式のパラメータを使用して画像を作成できます。 Node.jsなどを利用してウェブサーバー側で実行することにより、簡易的なWMTSサーバーを作ることも可能です。 ISO8601の日付フォーマットで指定することも可能です。


    補足

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

    ISO8601のフォーマットで指定することも可能です。

    // 2025/02/03 04:05:06 (UTC)を指定する場合(Date.UTC()を使用)
    const date = new Date(Date.UTC(2025, 2 - 1, 3, 4, 5, 6));

    // 2025/02/03 04:05:06 (UTC)を指定する場合(ISO8601のフォーマットで指定)
    const date = new Date("2025-02-03T04:05:06Z");

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

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