国土地理院ベクトルタイルのOpenLayers用プリセット
@cieloazul310/ol-gsi-vt は、国土地理院が提供するベクトルタイルを OpenLayers で設定不要で手軽に表示するためのパッケージです。ベクトルタイル、最適化ベクトルタイルのそれぞれに通常、淡色の2種類ずつ、計4種類のプリセットレイヤを搭載しています。
GitHub リポジトリ
https://github.com/cieloazul310/ol-gsi-vt
デモ
https://cieloazul310.github.io/ol-gsi-vt
ol-gsi-vt Composer (New!)
https://ol-gsi-vt.vercel.app
- 2種類のベクトルタイルに対応
- ベクトルタイル (2019年7月29日関東の一部地域、2020年3月19日全国提供開始)
- 最適化ベクトルタイル (2022年9月6日提供開始、2023年8月30日PMTile版提供開始)
- 設定不要で使用可能
- テーマによる配色、タイポグラフィの編集
- TypeScriptによる型安全性
npm install @cieloazul310/ol-gsi-vt
npm や yarn で既存の OpenLayers プロジェクトや create-ol-app などで新規作成したプロジェクトにインストールする方法です。
https://openlayers.org/doc/quickstart.html
また、@cieloazul310/ol-gsi-vt
パッケージを利用したテンプレートを用意しています。テンプレートを下記コマンドでクローンすることで、設定不要でパッケージを利用することができます。
git clone git@github.com:cieloazul310/ol-gsi-vt-template.git --depth=1
https://github.com/cieloazul310/ol-gsi-vt-template
import { gsiOptVtLayer } from '@cieloazul310/ol-gsi-vt';
const layer = gsiOptVtLayer();
スタイルの設定なしで国土地理院の最適化ベクトルタイル及びベクトルタイルを利用することができます。
メインパッケージ。4種類のレイヤと以下の2つのパッケージが含まれます。
最適化ベクトルタイル及びベクトルタイルのプリセットのスタイルを定義したパッケージです。
テーマや型定義、注記の地物コードのフィルタリングなどの関数を搭載したパッケージです。
以下の全ての機能は @cieloazul310/ol-gsi-vt
モジュールからインポート可能です。
- gsiOptVtLayer(options?)
- gsiVtLayer(options?)
- gsiOptVtPaleLayer(options?)
- gsiVtPaleLayer(options?)
- optVtDefaultAttribution
- vtDefaultAttribution
- gsiOptVtStyle(options?, defaultTheme?)
- gsiVtStyle(options?, defaultTheme?)
- defaultTheme
- mergeDefaultTheme(defaultTheme)
- defaultPalette
- palePalette
- mergeDefaultPalette(paletteOptions?, initialPalette?)
- defaultTypography
- mergeDefaultTypogrphy(typographyOptions?, initialTypography?)
- defaultZIndex
ベクトルタイルのソースレイヤの取捨選択用の定数と関数
- gsiOptVtLayerNameCollection
- gsiOptVtLayerExclude(layerNameCollection)
- gsiVtLayerNameCollection
- gsiVtLayerExclude(layerNameCollection)
マニュアル記法で注記のスタイルを記述する際に、地物のフィルタリングと型安全を保つ関数。
- annoCodeIsAdress(code)
- annoCodeIsAdm(code)
- annoCodeIsAirport(code)
- annoCodeIsElevation(code)
- annoCodeIsGreen(code)
- annoCodeIsLandformPoint(code)
- annoCodeIsPort(code)
- annoCodeIsSchool(code)
- annoCodeIsTerrain(code)
- annoCodeIsTransp(code)
- annoCodeIsVegetation(code)
- annoCodeIsWater(code)
- zoomToResolution(zoomLevel)
- dspPos(dspPos?, arrng?, radius?)
最適化ベクトルタイル及びベクトルタイルの地物の型定義
- GsiOptVTFeatureProperties<VTCode, T>
- GsiVTFeatureProperties<FTCode, T>
- 淡色プリセットを使う
- テーマを変更して配色を変える
- 表示するソースレイヤを選択する
- 表示しないソースレイヤを選択する
- マニュアルでスタイルを設定する
地理院地図Vector(仮称)提供実験
https://github.com/gsi-cyberjapan/gsimaps-vector-experiment
最適化ベクトルタイル試験公開
https://github.com/gsi-cyberjapan/optimal_bvmap
国土地理院によるベクトルタイルは提供実験及び試験公開であるため、今後仕様変更や公開終了の可能性があります。留意してください。