5
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

mug-jp_logo_01.png

はじめに

MapLibreとは

MapLibre Official WebSite
https://maplibre.org

  • Web地図に関するプロダクトをOSSとして開発・メンテナンスしているOrganizationです
  • ブラウザ・モバイル向けの地図ライブラリおよび地図配信に関するツール群があります

MapLibre User Group Japan (MUG-JP) とは

MUG-JP Official Web Site
https://mug-jp.org/

  • MapLibreプロダクトの開発者によるユーザーコミュニティです
  • ナレッジの共有やイベントの開催による普及活動を行なっています

chiitiler

  • Node.jsで動作する「MapLibreラスタータイルサーバー」
  • TilerserverGLのオルタナティブ、サーバーレス環境への最適化を志向

chiitilerの紹介は過去の記事を参照してください。

本記事では最近追加された機能などの最新の動向を紹介します。

ライブラリーモード

chiitilerは当初、公開しているコンテナイメージを利用してサーバーを起動するマイクロサービス的位置づけでした。既存システムと疎結合に使えるサーバー、とは聞こえが良いですが、コンセプトである「MapLibre Styleの入力に対しタイル画像を返す」という機能に対しては、これは過剰です

npm install chiitilerでモジュールを追加して、関数としてタイルを生成出来たらうれしくないですか?(私はうれしかった)
ということで導入したのがライブラリーモードです。

使い方

npm install chiitiler
import {
    getRenderedBboxBuffer,
    getRenderedTileBuffer,
    ChiitilerCache
} from 'chiitiler';

// Optional: キャッシュ設定
const s3Cache = ChiitilerCache.s3Cache({
    bucket: 'chiitiler',
    region: 'ap-northeast-1',
    endpoint: null,
});
// credentials are loaded from environment variables: AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY

const tileBuf = await getRenderedTileBuffer({
    stylejson: 'https://example.com/style.json', // or StyleSpecification object
    z: 0,
    x: 0,
    y: 0,
    tileSize: 512,
    ext: 'webp', // png, webp, jpg
    cache: s3Cache,
    quality: 80,
    margin: 0,
});

const bboxBuf = await getRenderedBboxBuffer({
    stylejson: 'file://path/to/style.json', // or StyleSpecification object
    bbox: [123.4, 34.5, 124.5, 35.6],
    size: 1024,
    cache: s3Cache,
    ext: 'webp',
    quality: 80,
});

// Bufferが得られるのであとは良しなに
// TIPS: getRenderedTile()ならsharpのStreamが得られる

このAPIにより、既存のサーバーに統合できたり、サーバー以外のNode.jsスクリプトにも導入することが可能となります。なお、実行時の依存関係がファットなことには注意してください(Dockerfile)。

Cloud Optimized GeoTIFFのサポート(experimental)

このライブラリにインスパイアされ、chiitilerでcog://プロトコルをサポートしました。なお実験的な機能なので突如消すかもしれません。

論より証拠、上記のデモページでは、chiitilerはAWSがホスティングしているSentinel-2のCOGを直接参照して、タイル画像として配信しています。

image.png

以下のようなスタイルを定義することで利用できます。

{
    version: 8,
    sources: {
        cog: {
            type: 'raster',
            tiles: [
                'cog://https://sentinel-cogs.s3.us-west-2.amazonaws.com/sentinel-s2-l2a-cogs/54/T/WN/2024/9/S2A_54TWN_20240908_0_L2A/TCI.tif/{z}/{x}/{y}',
            ],
        },
    },
    layers: [
        {
            id: 'cog',
            type: 'raster',
            source: 'cog'
        },
    ],
}

注意点ですが、EPSG:3857のCOGでないと、正しい位置にレンダリングされません。なのでEPSG:4326のSentinel-2の画像が地中海に表示されています(ほんとは北海道のデータ)。

Production Ready (!?)

筆者所属のMIERUNEでは無料で使える地図タイルを配信しています。
今年に裏側をリプレイスしていて、そこではchiitilerを使っています。
現状までで不都合は起きていません。AWS Lambdaで運用しているのでコストも非常に安いです。

~Production Ready~ともマッチポンプとも言えます

終わりに

当初、chiitilerの目標はサーバーレス環境で動作するTileserverGLでしたが、最近はMapServerを代替できるのではないかと考えています。MapLibre Style Specificationの表現力なら可能だと考えています。現状、使っているのは筆者だけな可能性大ですが、今後の発展にご期待ください!

5
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?