Oracle APEX 21.1よりサンプル・アプリケーションがGitHubより提供されています。マップ・リージョンについてもサンプル・アプリケーションが提供されているので、そこで使用されているテクニックを確認してみます。
マップのサンプルにはいくつかの実装例が含まれています。その中の5種類の実装について紹介します。Faceted Searchはほぼ標準機能なので今回の作業からは外しました。
- 準備 - この記事です。
- クリックした医療機関をマップの中心にする - サンプルのClickable Map
- レポートで選択した医療機関をマップに表示する - サンプルのSearch and Show
- 円形ツールを使う - サンプルのCircle Search
- マップに表示されている医療機関をレポートする - サンプルのMap and Report
- 近隣の医療機関をレポートする - サンプルのNearest Neighbor Search
最近作成した全国医療機関の医療体制の状況をマップに表示するアプリケーションに機能を追加することにより、実装の手順を示します。作業の元になるアプリケーションのエクスポートは以下になります。
https://github.com/ujnak/apexapps/blob/master/exports/c19-medical-facilities.sql
データとして東京23区のデータをロードしました。他の地域のデータをロードしても作業に違いは発生しないはずなので、お住まいの地域を選んでもよいかと思います。
上記のすべての作業を行なったアプリケーションのエクスポートは以下に置いています。
https://github.com/ujnak/apexapps/blob/master/exports/c19-medical-map-sample.sql
元になるページの準備をする
最初にそれぞれの機能を実装するページの元とするページを作成します。すでに作成済みのページはレイヤーが複数あったり、機能のカスタマイズを行うには足りない設定があるため、その部分を変更します。
最初にマップ・リージョンを含むページ、ページ番号4の医療機関のページをコピーします。
ページ・デザイナより作成メニューのコピーとしてのページを実行します。
次のコピーとしてのページを作成として、このアプリケーションのページを選択します。次へ進みます。
コピー元ページとしてマップ・リージョンを含むページである4.医療機関を選択します。新規ページ名はサンプルの基本とします。次へ進みます。
ラベルの文字列や静的IDを変更する画面が開きます。ここでは何も変更せず、コピーを実行します。
新規にマップ・リージョンを含んだページが作成されます。最初にファセット検索のリージョンである検索を削除します。
レイヤーを1つにします。マップ・リージョンのソースのSQL問合せを以下に変更します。マップ上に表示される医療機関を特定するため、f.facility_idを検索列に追加し、行割当てのために使用していた列ANS_TYPEを削除します。
select f.facility_id, f.zip_code, f.facility_name, f.facility_addr, f.geometry
, m.ans_type ans_type_m, e.ans_type ans_type_e, h.ans_type ans_type_h
from c19_medical_facilities f
left outer join (
select ans_type, facility_type, facility_id
from c19_medical_facility_statuses
where facility_type = 'M') m
on f.facility_id = m.facility_id
left outer join (
select ans_type, facility_type, facility_id
from c19_medical_facility_statuses
where facility_type = 'E') e
on f.facility_id = e.facility_id
left outer join (
select ans_type, facility_type, facility_id
from c19_medical_facility_statuses
where facility_type = 'H') h
on f.facility_id = h.facility_id
レイヤーの通常を選択し、識別の名前を医療機関へ変更します。また、制限、停止、設置なし、未回答のレイヤーを削除します。
レイヤーが1つだけでジオメトリ列に空間索引が作成されていると、ソースの空間索引の使用をONにすることができます。これをONにできると、マップ・リージョンに表示される領域に検索結果が限定されるため、パフォーマンスが向上するとのことです。指定が可能であれば検討する価値があるでしょう。
情報ウィンドウの拡張フォーマットをONに変更し、ツールチップのHTML式を情報ウィンドウのHTML式へコピー&ペーストします。
ツールチップは拡張フォーマットをOFFにし、列としてFACILITY_NAMEを選択します。
マップ・リージョンを選択し、静的IDとしてmedical-facilities-regionを設定します。
Attributesを開き、コントロールのオプションからブラウザの位置の取得のチェックを外します。
以上で準備は完了です。作成したページを実行してみます。ナビゲーション・メニュー・エントリは作成していないため、左のナビゲーション・メニューからは呼び出すことはできません。
このページを元にして、マップのサンプル・アプリケーションで利用されているテクニックを実装していきます。