はじめに
これまでに自分のベクトルタイルをArcGISオンラインで表示する方法をためました。次は、ArcGISで表示するためのベクトルタイルスタイルの作業が必要です。
過去、match等の表現が上手く表示されなかった経験があったので、本当に使うことができないのか改めて実験してみました。
(matchを上手に使うと、単一のスタイルレイヤーから、異なる色や線幅の表現が可能になります。その結果、大幅にスタイルレイヤ数を減らすことができるというメリットがあります。)
環境
- nodejsのローカルホストサーバーを立ち上げ、VectorTileServer用のindexとresources/styles/root.jsonを準備。(こんな感じのサーバーです。→ レポジトリ)
- ベクトルタイルはオフィスのArcGIS Onlineで実験(ArcGIS API for JavaScriptのバージョン不明。4でないかもしれません。)
実験結果
Filterでのmatchの利用
まず、ポリゴンデータで、gridcodeの20,30,80をもっているものだけtrueにするというフィルターでよく使うmatch表現を試してみました。以下のものです。
"filter": [
"match",
[
"get",
"gridcode"
],
[
20,
30,
80
],
true,
false
],
この結果、私の環境のArcGIS Onlineではベクトルタイルを地図上にロードできませんでした。しかし、この場合は、以下の表現ならArcGISでもOKです。
"filter": [
"any",
[
"in",
"gridcode",
20, 30, 80
]
],
paint
次に、ペイントの中で色の種類を変えられるか試してみました。色が変えられれば線の太さなども同様だと思うので実験はfill-colorのみで行いました。
"paint": {
"fill-color": [
"match",
[
"get",
"gridcode"
],
20,
"#DAEDD0",
30,
"#ECF3DD",
"#F6EFEF"
]
},
この結果、私の環境のArcGIS Onlineではベクトルタイルを地図上にロードできましたが、ポリゴン(Fill)の色は出てきませんでした。Fill colorのところが理解されていないようです。
次は、例えばcaseは使えるのか試してみました。
"paint": {
"fill-color": [
"case",
[
"has",
"gridcode"
],
"#DAEDD0",
"#F6EFEF"
]
},
この結果も表示されませんでした。caseは少しパターンを変えて下も実験しました。
"fill-color": [
"case",
[
"get",
"gridcode"
],
20,
"#DAEDD0",
"#F6EFEF"
]
これも表示されませんでした。
その他
他のArcGIS Online用のスタイルを見てみました。
例えば、ArcGISのLivingAtlasのベクトルタイルスタイルを見ても(例えばこちら)一つのスタイルレイヤで複数の色や線幅を表現しているものはないようです。
結論
私の環境では、matchとcaseは使うことができませんでした。
したがって、ArcGIS Online用のスタイルは、基本的に「一つのレイヤで一色(あるいは一種類の線幅)」と考えた方が良さそうです。
(ただし、ベクトルタイルのデータの中に描画情報を入れて、それを直接参照する形にすれば一つのレイヤでも好きなように表現できるかもしれませんね。)
注意:
環境の違いや、書き方の違いなどで、もしかしたら可能なのかもしれません。ここでのメモは、あくまで私が実験してみた結果のメモです。