はじめに

Oracle Application Express（APEX）は、Oracle Databaseのためのローコード・アプリケーション・プラットフォームです。
先日、Oracle APEX上でOracle Databaseの地理空間機能、Oracle Spatialを扱うことができるようになりました。
本記事では、APEXとSpatialを組み合わせて、座標からの空間データを表示する対話型マップを含むアプリケーションを作成してみます。

前提条件

Oracle APEX バージョン21.1以上
※本記事のスクリーンショットは21.2です。
Autonomous Databaseインスタンスが構成済みであること
※APEX, Spatialはともに全てのOracle Databaseでもサポートされています。今回はADBを使用します。
使用するサンプルデータのダウンロード
- Oracle APEX on GitHubにアクセス
- Branchesまでスクロールダウンし、APEXのバージョンを選択
- sample-apps/sample-appsと移動
  ※APEX 21.2であれば https://github.com/oracle/apex/tree/21.2/sample-apps/sample-maps
- airports-full.jsonとstates-full.jsonをダウンロード

サンプルアプリのインストール

自分で一からアプリを作成する前に、まずはサンプルのアプリから始めてみます。
Oracle APEXには、いくつかの機能を紹介するサンプル・アプリケーションのポートフォリオがあります。今回はOracle APEXの地理空間機能を紹介するSample Mapsアプリケーションを使用します。

アプリケーションのインストール

ワークスペースのホーム画面からアプリケーション・ビルダーをクリックします。
スタータまたはサンプル・アプリケーションのインストールをクリックします。
サンプルをクリックすると、サンプルアプリのリストが表示されます。
スクロールダウンし、Sample MapsのDownload Appをクリックし、sample-maps.zipをダウンロードします。
アプリケーション・ビルダーに戻り、インポートをクリックします。
sample-maps.zipをドラッグ&ドロップし、次をクリックします。
デフォルトの設定のまま、アプリケーションのインストールをクリックします。
全てデフォルト設定で、インストールをクリックします。
アプリケーションを実行します。
APEXのワークスペースのユーザー名とパスワードでサインインします。

データのロード

初回起動時にデータのロードに関するメッセージが表示されます。Data Loadingをクリックします。
Upload Filesを選択し、US States Dataにstates-full.json, Airports Dataにairports-full.jsonをアップロードし、データセットをロード

サンプルアプリの確認

タイルをクリックすると、機能の関連ページに移動します。今回はMap and Reportをクリックします。
地図上に空港の位置情報がマッピングされ、ピンアイコンをクリックすると詳細情報が表示されます。
他にもヒートマップなど様々なデータ探索の仕方ができるページがあります。

サンプルデータの確認

APEX画面に戻りSQLワークショップをクリックし、オブジェクト・ブラウザに移動します。
EBA_SAMPLE_MAP_AIRPORTSのデータを確認します。右側にスクロールしてジオメトリの列を表示すると、空港は点として保存されるため、点のジオメトリ値が入っています。
EBA_SAMPLE_MAP_SIMPLE_STATESのデータを確認します。ジオメトリの列を表示すると、州はポリゴンとして保存されます。
MDRT_...$というテーブルは、他のテーブルの空間索引をサポートするために自動で作成されます。これらは無視してかまいません。

ゼロから地図アプリを作る

次はゼロから地図上に空港の位置をマッピングするアプリを作成してみます。

ページの作成

アプリケーション・ビルダーから新たにアプリを作成します。
新規アプリケーションをクリックします。
名前はAPEX Mappingとします。ページの追加をクリックします。
ゼロから作るので、空白ページを選択します。
ページの名前はAirports and States Mapとします。
こちらでアプリケーションの作成をクリックします。

空港マップをページに追加

作成したAirports and States Map の編集画面にいきます。リージョンパレットからマップをドラッグし、Bodyセクションの下にドロップします。
リージョンのタイトルを新規からMy Map Regionへ変更します。
マップリージョンにはレイヤーという子要素が含まれています。レイヤーは、地図上にレンダリングされるデータコンテンツです。名前を空港に変更し、レイヤー・タイプがポイントになっていることを確認します。
ソースとして表名にEBA_SAMPLE_MAP_AIRPORTS表を指定します。レンダリングされる空港を制限するため、where句にLAND_AREA_COVERED > 2500を追記します。また、空間索引の使用ボタンをONにします。
下にスクロールして、[列のマッピング]セクションに移動します。ジオメトリ型のデータ型SDO_GEOMETRYとジオメトリ列GEOMETRYを選択します。また、主キー列にIDを指定します。
下にスクロールして、[情報ウィンドウ]セクションに移動します。ここでは、マップ内のアイテムをクリックしたときにポップアップで表示する情報を設定できます。拡張フォーマットボタンをONにし、HTML式に以下をペーストします。
```
<strong>&AIRPORT_NAME.</strong><br>
&CITY., &STATE_NAME.<br>
Code: &IATA_CODE.
```

州マップの追加

「レイヤー」を右クリックし、「レイヤーの作成」を選択します。
名前を州、レイヤー・タイプをポリゴン、ソースをEBA_SAMPLE_MAP_SIMPLE_STATESに設定します。
レイヤーはページツリーに表示されている順番でレンダリングされます。空港を州の上にレンダリングするため、州レイヤーを空港レイヤーの上にドラッグします。また、[列のマッピング]でジオメトリ列GEOMETRYを選択します。[外観]で塗りつぶしの色と不透明度を設定します。ただし、不透明度を1にしてしまうと、背景の地図が見えなくなってしまうので注意してください。そしてツールチップにNAME列を指定します。
こちらで保存し、実行します。
空港をクリックすると設定した情報ウィンドウが表示されます。また、州の上にカーソルを置くと、設定したツールチップ、州の名前が表示されます。

空間分析

続いて上で作成したマップを拡張します。選択した州の中から、ユーザーが決めた距離の範囲内にある空港を検索できるようにします。

フィルタリングのためのリージョンを追加

左側のツリー一番上のページ2:Airports and States Mapをクリックします。次に、右側のプロパティパネルで、[外観]のページ・テンプレートをLeft Side Columnに変更します。
静的コンテンツをLEFT COLUMNにドラッグします。
名前をMy Filters Regionに変更します。

州の選択リストの作成

アイテム：選択リストをREGION BODYにドラッグし、名前をP2_STATE、ラベルを州にします。
右側のアイテムプロパティで、[検証]で必須の値に設定します。そしてLOVのタイプをSQL問合せにし、以下のクエリを入力します。また、追加値の表示・NULL値の表示はOFFにします。
```
select name, state_code
from EBA_SAMPLE_MAP_SIMPLE_STATES
order by name
```
スクロールダウンし、[デフォルト]セクションでタイプを静的に、静的値を'Texas'または任意の州（'で囲む）に設定します。

距離の入力項目を追加

アイテム：数値フィールドをREGION BODYにドラッグし、名前をP2_DISTANCEにします。またラベルを距離(km)とします。
スクロールダウンし、[検証]セクションで必須の値をONにします。
スクロールダウンし、[デフォルト]セクションでタイプ：静的、静的値：100と入力します。

動的アクションの作成

P2_DISTANCEを右クリックし、動的アクションの作成をクリックします。
動的アクションのプロパティで、名前を検証と更新に設定します。[タイミング]セクションでイベント：変更、選択タイプ：アイテム、アイテム：P2_DISTANCE, P2_STATE に設定します。続いて距離に負の値を送信させないように、[クライアント側の条件]セクションでタイプ：アイテム => 値、アイテム：P2_DISTANCE、値：0に設定します。
動的アクションは、設定された条件に基づいて呼び出されるTRUEアクションとFALSEアクションで構成されています。クライアント側の条件（P2_DISTANCE >= 0)がTRUEである場合、入力値を送信し、ページを更新する必要があります。アクションプロパティで、アクション：リフレッシュ、選択タイプ：リージョン、リージョン：My Map Regionと設定します。
次に、クライアント側の条件が満たされない場合、つまり負の距離値が入力された場合に呼び出されるアクションを設定します。[False]を右クリックし、FALSEアクションの作成をクリックします。
FALSEアクションは、ユーザーへのポップアップメッセージとします。アクション：アラートに設定し、タイトルとメッセージを入力します。
My Map Region には現在すべての州が表示されるようになっています。ここから、P2_STATEで選択した州のみ表示させるようにします。州レイヤーを選択し、レイヤープロパティの[ソース]セクションのWHERE句でstate_code = :P2_STATEと入力します。
最後に、ユーザーが入力した州と距離の範囲内の空港が表示されるよう空港レイヤーを修正します。空港レイヤーを更新し、レイヤープロパティの[ソース]セクションのタイプをSQL問合せにし、以下のクエリを入力します。
```
select a.*
from EBA_SAMPLE_MAP_AIRPORTS a, 
     EBA_SAMPLE_MAP_SIMPLE_STATES b
where b.state_code= :P2_STATE
and a.land_area_covered > 1000
and sdo_within_distance(a.geometry, b.geometry, 'distance='|| :P2_DISTANCE ||' unit=KM') = 'TRUE'
```
送信するページ・アイテムには、P2_STATE, P2_DISTANCEを設定します。
アプリケーションを保存・実行します。州でAlabamaを選択すると、アラバマ州と100km以内の空港が地図上に表示されています。
次に州でKansasを選択し、距離で600を指定すると、以下のように表示されます。
最後に距離に負の値を入力してみると、正しく設定したポップアップが表示されました。