Arcade は、ArcGIS プラットフォームで使用するために開発された、新しい式言語です。
他の式言語と同様に、演算や式の評価を行うほか、記述した式を ArcGIS プラットフォームにおいて共有、実行することができます。
ArcGIS API for JavaScript ではバージョン 4.2 およびバージョン 3.19 から Arcade を使用できるようになりました。
本記事は、ArcGIS API for JavaScript で Arcade を使用する方法を前編と後編に分けてご紹介します。
前編では、Arcade を使ったビジュアライゼーションの基本をご説明し、後編では、ArcGIS プラットフォームでの Arcade の共有についてご紹介する予定です。
Arcade で式を定義してみよう!
では、さっそく、Arcade を使ったビジュアライゼーションの方法をご紹介します。
Arcade を Web アプリで使用するには、Arcade で式を定義し、定義した式を ArcGIS API for JavaScript で参照します。このセクションでは、Arcade 式を定義してみます。
以下のサンプルは、愛知県の地価価格を可視化しています。前年と比較して価格の変動が大きいほどシンボルは大きく、また、正の値を赤、負の値を青で表しています。
このサンプルでは2つの Arcade式を定義してデータを表現しています。それぞれの式を見てみましょう。
前年と比較した価格の上昇率を求める
上記のサンプルはこちらのデータから作成しました。
残念ながら、データソースには上昇率の情報は用意されていません。
そこで、Arcade を使い、各年の地価価格のフィールド値から、前年と比較した価格の上昇率を求める式を定義します。
<!--上昇率--> <script type="text/plain" id="land-price-rate"> // 価格データがないとき null を返す if(IsEmpty($feature.H25価格) || IsEmpty($feature.H26価格)){ return null; } // 上昇率を求める var rate = IIf($feature.H25価格 > 0 && $feature.H26価格 > 0, ($feature.H26価格 / $feature.H25価格 - 1) * 100, null); // 絶対値を求める var abs = Abs(rate); // 結果を返す return abs; </script>
Arcade は、変数の宣言や論理演算、関数の記述など JavaScript と似た構文を持っています。
もちろん、Arcade 独自の構文も定義されています。また、複雑な演算を簡単に行うための関数も豊富に提供されています。詳細は、ArcGIS Arcade ドキュメント をご参照ください。
さらに、Arcade には、フィーチャ データへアクセスするためのグローバル変数、$feature が用意されており、簡単にフィーチャのフィールド値を参照することができます。
$feature.FIELD_NAME
上昇率の正負を分類する
さて、もうひとつ、上昇率の正負を分類するための Arcade 式を用意しましょう。
上昇率が正の場合 "positive" を、0 の場合は 0 を、負の場合は "negative" を返すように式を書きます。
<!--正負--> <script type="text/plain" id="land-price-pn"> // 価格データがないとき null を返す if(IsEmpty($feature.H25価格) || IsEmpty($feature.H26価格)){ return null; } // 上昇率を求める var rate = IIf($feature.H25価格 > 0 && $feature.H26価格 > 0, ($feature.H26価格 / $feature.H25価格 - 1) * 100, null); // 正か負かを求める var uqv = When(rate > 0, "positive", rate < 0, "negative", rate == 0, 0, null); // 結果を返す return uqv; </script>
式が script タグ内に記述されているのは、ArcGIS API for JavaScript が式を文字列として参照するためです。
シンプルな一行の式のときは、JavaScript コード内にダブルまたはシングルクォートを使い書くこともできます。式が複数行に渡るときは、上記のように、別途 script タグ内に記述することもできます。この場合、ブラウザーが JavaScript としてスクリプトを実行することがないように、MINE タイプを text/plain にしましょう。
Arcade を使ってみよう!
では、用意した Arcade を ArcGIS API for JavaScript から参照し、データを可視化してみましょう。
まず、document.getElementById() メソッドを利用し、script タグ内に記述した Arcade 式を変数へ代入します。
var rateArcade = document.getElementById("land-price-rate").text; var pnArcade = document.getElementById("land-price-pn").text;
続いて、レンダラーを作成します。
シンボルの色を正負の個別値("positive"、0、"negative")をもとに表現したいので個別値分類クラスを使います。上昇率を表すシンボルの大きさは、visualVariables オプションを使用し設定します。
var renderer = new UniqueValueRenderer({ // 正負 valueExpression: pnArcade, valueExpressionTitle: "正負", uniqueValueInfos: [{ value: "positive", symbol: createSymbol("#ED5151"), label: "正" }, { value: 0, symbol: createSymbol("#E38B4F"), label: "0" }, { value: "negative", symbol: createSymbol("#149ECE"), label: "負" }, { value: null, symbol: createSymbol("#AAAAAA"), label: "その他" }], // 上昇率 visualVariables: [{ type: "size", valueExpression: rateArcade, valueExpressionTitle: "上昇率", minDataValue: 0, maxDataValue: 12, valueUnit: "unknown", minSize: "8px", maxSize: "60px" }] });
式は valueExpression オプションに渡します。
あとは、いつも個別値分類を行うのと同様に、各個別値のシンボルを定義したり、シンボルの大きさを設定したりするだけです。
このように、Arcade を活用することで、実行時に式を評価し、返ってきた値をもとにレンダリングすることができます。表現したいデータを持つ属性フィールドが無い場合でも、データソース自体を更新する必要がなく、複数のフィールドを組み合わせることで多様な表現が可能になりました。
さらに、Arcade が提供する豊富な関数を利用することで、複雑な演算も簡単に行うことができます。
関連リンク