概要

ArcGIS Arcade 式を利用すると、ポップアップにマップ内の別レイヤーから関連する情報を取得し、表示させることができますが、意図通りの表示にするためには出力に気を付ける必要があります。Map Viewer でレイヤーのポップアップに Arcade 式を追加する際、テスト実行では表示される内容が、実際のマップ上のポップアップには表示されない場合があります。

詳細

たとえば、全国市区町村界データから横浜市のみを抽出したポリゴンデータと、神奈川県の「神奈川県オープンデータサイト」から入手した神奈川県内の公園の CSV を元にしたテーブルデータがあったとします。

横浜市のレイヤーと、公園の一覧のテーブルが Web マップに追加された状態で、横浜市内のある地点をクリックしたらポップアップに該当の地区町村内にある公園の一覧を表示させたいと考えました。

まず、ポップアップに Arcade 式を追加し、下記のようなスクリプトを記載しました。

// ポップアップ表示するレイヤーに "SIKUCHOSON" というフィールドがある前提です
var sikuchoson = $feature["SIKUCHOSON"]

// 公園の一覧テーブルに "名称" や "市区町村名" といったフィールドがある前提です
var allParks = FeatureSetByName($map, "parks", ["名称", "市区町村名"],false)

// クリックされた市区町村名が一致する公園のデータのみを、フィルターした featureSet を作成します
var parksInArea = Filter(allParks, "市区町村名 = @sikuchoson")
return parksInArea

エディター画面上で [実行] をクリックしたところ、出力として featureSet が正しく表示されているように見えます。
しかし、この状態でスクリプトを保存し、実際のマップ上でポップアップを表示させても、エディター画面上では確認できていた featureSet、つまり公園の名称一覧は表示されません。

これは、ポップアップでは featureSet をそのままユーザーに見える形で可視化させることができないからです。

解決策

Arcade では、スクリプトが実行される環境、プロファイルによって、利用可能な形式が変化します。ポップアップの場合、API リファレンスの Return types という記載を見ると、ポップアップでは Text もしくは Number のみを扱えると言うことが分かります。

上記の例にある、公園の名称一覧をポップアップに追加するには、途中まで記述した Arcade スクリプトで得られた featureSet の内容を Text（文字列）に展開する必要があります。
ポップアップは、Text に含まれる HTML を解釈し表示に反映させることができるため、スクリプトから返却する Text は単なる文字列でも良いですし、スタイルの指定を含めた HTML でも構いません。

例の続きとして、抽出した公園の名称一覧を、単純な HTML テーブルに整形してみましょう。

var sikuchoson = $feature["SIKUCHOSON"]

var allParks = FeatureSetByName($map, "parks", ["名称", "市区町村名"],false)

var parksInArea = Filter(allParks, "市区町村名 = @sikuchoson")


// 最終的に出力する HTML 文字列でテーブルを作成するため、tableHTML と名付けた変数に
// HTML を記載していきます。 
var tableHTML = '<table style="border-style: solid"><thead><tr><th>' + sikuchoson + ' の公園</th></tr></thead><tbody>'
for(var item in parksInArea){
    // 公園の名称をテーブルデータとして取り出し、文字列に追加します
    var tr = '<tr><td>' + item["名称"] + '</td></tr>'
    tableHTML += tr
}
tableHTML += "</tbody></table>"

 
// 最終的に、データタイプとデータ（HTML文字列）を設定した Dictionary として返却します

return {

    type : 'text',

    text : tableHTML

}

今度は、エディター上でテスト実行した結果は改行の無い HTML の文字列になりました。この状態では人間には読みづらいものですが、ポップアップに表示した際には HTML が解釈されるため、人に見やすい状態になるはずです。

Arcade スクリプトからポップアップへの最終的な返却値は、型と内容を示すデータの Dictionary となっている点にご注意ください。上記例にて、型（type）は、'text' を、内容（text）にはスクリプト内で構築した HTML 文字列を指定しています。また、上記例にあるように HTML とスタイルを組み合わせて使用できるため、自由度の高い表示方法を設定することができます。この対処によって、マップ上でクリックした際に表示されるポップアップが以下のように変化しました。