Mapbox 入門日記（４）カスタムレイヤ

Mapboxカスタムレイヤ

Mapboxでは、GLSL書ける type: ‘custom’ が用意されています。

使い方は公式サンプルサイト
https://docs.mapbox.com/mapbox-gl-js/example/custom-style-layer/
を参照してください。

基本的にonAddでシェーダーを用意して、renderでdrawします。

カスタムレイヤの問題点

renderで受け取るmatrixですが、メルカトル座標を描画するためのもの
です。

mapbox内部では、ベクトルタイルを描画するためにベクトルタイル座標
をベースにした描画を行っています。

ズームを拡大すると、精度の問題により、カスタムレイヤのブレが生じます。

詳細はこちらのissuesで議論されています。
https://github.com/mapbox/mapbox-gl-js/issues/7268

カスタムレイヤよりカスタムデータ

mapbox-gl-js自体はベクトルタイルを描画するためにいろいろのオプションが
あります。
一方描画(GLSL)をカスタマイズするためのcustomレイヤの機能が限られています。

そのため、サーバサイトで、独自でベクトルタイルを作って、mapbox-gl-jsに描画させるのが
正しいアップローチかと思います。