10.4.6 マップの編集

ページ・デザイナでマップ・リージョンのコンポーネントを編集します。

10.4.6.1 ページ・デザイナでのマップの表示と編集

ページ・デザイナで属性を表示して、マップを構成するコンポーネントを表示および編集します。

マップには、空間ジオメトリ・レイヤーを含むマップ・リージョンがあります。このトピックでは、ヒート・マップ空間ジオメトリ・レイヤーを特徴とする、EARTHQUAKE_TABLEという名前のローカル表に作成された地震マップについて説明します。
ページ・デザイナでマップを表示または編集するには:
  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示され、プロパティ・エディタ(右ペイン)に「ページ」属性が表示されます。
  2. マップ・リージョンを確認します。
    1. 「レンダリング」タブで、「マップ」リージョンを選択します。プロパティ・エディタ(右ペイン)に、「リージョン」「属性」の2つのタブが表示されます。
      map_region_attributes.pngの説明が続きます
      図map_region_attributes.pngの説明

      前述の例では、「識別」の「タイトル」でマップの名前がEarthquake Mapであることを示し、「タイプ」が「マップ」であることを示しています。

    2. プロパティ・エディタで、「属性」タブをクリックします。
      map_attributes.pngの説明が続きます
      図map_attributes.pngの説明

      マップ属性は、基本のマップ特性を決定します。前述の例では、「コントロール」の下の属性に注意してください。「コントロール」では、ユーザーが実行時にマップ表示を変更できる様々な方法を決定します。たとえば:

      • ナビゲーション・バー - オプションには、「なし」「ズームのみ」および「ズームおよびコンパス」があります。

      • ナビゲーション・バーの位置 - 「開始」は、ナビゲーション・バーをマップの開始位置(通常は左側)に配置します。「終了」は、ナビゲーション・バーをマップの終了位置(通常は右側)に配置します。

      • マウス・ホイール・ズーム - マウス・ホイールを使用してズーム・インまたはズーム・アウトします。

      • 四角形ズーム - マップ上に四角形を描画している領域にマップをズームします。

      • スケール・バー - マップにスケール・バーを表示します。

      • 概要マップ - 概要マップを右下に表示します。

      • 無限マップ - 無限マップ・スクロールを有効にします。

      • ブラウザの位置の取得 - ユーザーのブラウザから、ユーザーの現在の位置を取得します。

      • 円形ツール - エンド・ユーザーがマップ上に円を描画できるようにします。終了するとイベントがトリガーされます。これにより、動的アクションまたはJavaScriptコードで円を処理できるようになります。

      • 距離ツール - エンド・ユーザーがマップ上のポイント間の距離を測定できます。

      前の例では、これらのコントロールの一部のみが有効になっていることに注意してください。

  3. マップの「レイヤー」を確認します。マップには空間ジオメトリ・オブジェクト(またはレイヤー)があります。これらは表のデータに基づいてマップに描画されます。
    1. 「レンダリング」タブで、「レイヤー」、Earthquake Mapを選択します。

      次の例には、SQL問合せを使用してローカル・データベースから取得したヒート・マップ・レイヤーがあります。

      map_layer_att_source.pngの説明が続きます
      図map_layer_att_source.pngの説明
  4. 「列マッピング」を確認します。プロパティ・エディタで、「列マッピング」までスクロールします。
    map_layer_att_columns.pngの説明が続きます。
    図map_layer_att_columns.pngの説明

    前述の例では、「列のマッピング」の属性「ジオメトリ列のデータ型」がSDO_GEOMETRY、「ジオメトリ列」がGEOMETRYであることを示しています。

10.4.6.2 既存のマップへの新規レイヤーの追加

マップ・リージョン定義を編集して、さらに空間ジオメトリ・オブジェクトを追加します。

マップには空間ジオメトリ・オブジェクトがあります。これらは表のデータに基づいてマップに描画されます。このトピックでは、郡を識別する既存のマップにポリゴン・オブジェクト・レイヤーを追加する方法について説明します。このトピックには、COUNTRIES_TABLEという名前のローカル表をソースとし、GEOMETRY列にマップされるCountriesという名前のオブジェクト・レイヤーを追加する例が含まれています。
既存のマップに新しいオブジェクト・レイヤーを追加するには:
  1. ページ・デザイナでページを表示します。
    1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
    2. アプリケーションを選択します。
    3. ページを選択します。
    ページ・デザイナが表示され、プロパティ・エディタ(右ペイン)に「ページ」属性が表示されます。
  2. 空間ジオメトリ・レイヤーを追加します。「レンダリング」タブで、「レイヤー」を右クリックして、レイヤーの作成を選択します。
  3. ページ・デザイナでは、次に行う処理が示されます。エラーがある場合は、「メッセージの表示」アイコンがページ開発者ツールバーに表示されます。
    1. ページ・デザイナ・ツールバーの「メッセージの表示」アイコンをクリックします。
      「メッセージ」ダイアログに、対処する必要があるエラーが表示されます。
    2. エラーを選択すると、プロパティ・エディタの関連する属性がハイライトされます。
  4. 「識別」の属性を編集します。
    1. 識別、名前 - わかりやすい名前(たとえばCountries)を入力します。
    2. 識別、レイヤー・タイプ - 空間ジオメトリ・タイプ(たとえば「ポリゴン」)を選択します。
  5. 「ソース」の属性を編集します。
    1. ソース、位置 - データの場所(たとえば「ローカル・データベース」)を決定します。
    2. ソース、タイプ - データの問合せ方法(たとえば「表/ビュー」)を選択します。
    3. ソース、表名 - 表(たとえばCOUNTRIES_TABLE)を選択します。
  6. 「列のマッピング」の属性を編集します。
    1. 列のマッピング、ジオメトリ列のデータ型 - ジオメトリ列のデータ型(たとえばSDO_GEOMETRY)を選択します。
    2. 列のマッピング、ジオメトリ列 - ジオメトリ列のデータ型(たとえばGEOMETRY)を選択します。
  7. 「外観」の属性を編集します。
    1. 外観、カラー・スキームの使用 - このレイヤーにカラー・スキームを使用するかどうかを指定します。カラー・スキームは色のリストです。値および最小値と最大値に基づいて、マップ・ウィジェットはリストからこのオブジェクトの実際の表示色を選択します。次の例では、このオプションは無効になっています。
    2. 外観、塗りつぶしの色 - 塗りつぶしの色を指定します。
    3. 外観、塗りつぶしの不透明度 - 塗りつぶしの不透明度を指定します。範囲はゼロ(完全に透明)から1.0 (不透明)です。
    4. 外観、ストロークの色 - ストロークの色を指定します。
  8. ツールチップを構成します。ツールチップは、ユーザーのマウスをポリゴンに合わせると表示されます。次の例では、列を置換するHTML式を使用します。ただし、カード・リージョン・タイプと同様に、テンプレート・ディレクティブも使用できます。
    1. ツールチップ、拡張フォーマット - 列を使用してツールチップを表示するか、HTML式とサポートされている置換文字列を使用して高度な書式でツールチップを表示するかを指定します。この例では、拡張フォーマットを有効にします。
    2. 外観、HTML式 - マップ上のオブジェクトにカーソルを合わせたときにツールチップとして表示されるHTML式を入力します。HTMLで列値を示すには、&COLUMN.構文を使用します。たとえば:
      Country Name<br>
      <b>&COUNTRY_NAME. (&ISO_A2.)</b>

    ヒント:

    サポートされているテンプレート・ディレクティブの詳細は、Oracle APEX JavaScript APIリファレンスapplyTemplateを参照してください。
  9. 凡例、非表示を有効にする - 凡例のレイヤー名をクリックして、レイヤーの可視性を切り替えることができるかどうかを決定します。凡例で国のポリゴンが非表示にならないようにします。「非表示を有効にする」を無効にします。
  10. レイアウト、順序 - 順序を変更します
  11. 「保存」をクリックします。
  12. 「ページの保存と実行」をクリックします。

    Earthquakeヒート・マップと国の2つのレイヤーを示すマップが表示されます。

    sample_map_two_layers.pngの説明が続きます
    図sample_map_two_layers.pngの説明

10.4.6.3 レイヤーの可視性の制御

ページ・デザイナで属性を編集して、レイヤーの可視性を制御します。

このトピックでは、CountriesとEarthquake Mapという2つの空間ジオメトリ・オブジェクト・レイヤーを持つマップがあると想定しています。Countriesレイヤーは、COUNTRIES_TABLEという名前のローカル表に基づいています。Earthquake Mapは、EARTHQUAKE_TABLEという名前のローカル表から取得され、ヒート・マップの空間ジオメトリ・レイヤーを備えています。
このタスクでは、ページ・デザイナで属性を設定し、Earthquake Mapオブジェクト・レイヤーの可視性を制御する方法を示します。このトピックでは、ズーム・レベルを指定し、マグニチュードが2を超える地震のみが表示されるように指定するサーバー側の条件を追加します。
レイヤーの可視性を制御するには:
  1. ページ・デザイナでマップ・ページを表示します。

    ページ・デザイナが表示されます。次の例では、マップにはCountriesとEarthquake Mapの2つの空間ジオメトリ・オブジェクト・レイヤーがあります。

    quake_map_2_layers.pngの説明が続きます
    図quake_map_2_layers.pngの説明
  2. 「レンダリング」タブ(左ペイン)の「レイヤー」の下で、Earthquake Mapを選択します。
    レイヤー属性がプロパティ・エディタに表示されます。
  3. プロパティ・エディタで、「ズーム・レベル」の属性を編集します。

    「ズーム・レベル」の最小値は1、最大値は18である必要があります。

    1. ズーム・レベル、最小 - このレイヤーを表示する最小のズーム・レベルを指定します(たとえば、1を入力)。
    2. ズーム・レベル、最大 - このレイヤーを表示する最大のズーム・レベルを指定します(たとえば、8を入力)。
      quake_map_zoom.pngの説明が続きます
      図quake_map_zoom.pngの説明

      これらの設定により、使用可能なズーム・レベルがデフォルト(1~18)から1~8に減少します。ユーザーが「ズーム・レベル」の指定の範囲外にズームすると、レイヤーが表示されなくなります。

  4. サーバー側の条件を作成します。
    1. サーバー側の条件、タイプ - 「式」を選択します。
    2. サーバー側の条件、PL/SQL式 - :MAG > 2と入力します。
    3. サーバー側の条件、実行条件 - 「各行」を選択します。
  5. 「ページの保存と実行」をクリックして、アプリケーション・ランタイムを表示します。使用できるズーム・レベルは8つのみです。
    マップが表示されます。使用できるズーム・レベルは8つのみで、マグニチュードが2を超える地震のみが表示されます。

10.4.6.4 マップ・リージョンとレポート・リージョンの接続

マップ・リージョンとクラシック・レポート・リージョンを接続します。

このトピックでは、マップ・リージョンをクラシック・レポートにひも付けて、マップ・リージョンが変更(つまり、移動、ズーム・イン、ズーム・アウト)されるたびにレポート・リージョンがリフレッシュされて変更が反映されるようにする方法について説明します。マップ・リージョンをレポート・リージョンに接続するために、この例では次のものを含むページを作成します。

  • EARTHQUAKE_TABLEという名前のローカル表から取得される、Earthquake Mapという名前のオブジェクト・レイヤーを含むマップ。
  • EARTHQUAKE_TABLEに基づくSQL問合せに基づいたクラシック・レポート。
  • マップをレポートと同期するために、非表示のページ・アイテムを使用して、現在のマップ・ステータス(境界ボックスとも呼ばれる)を維持します。境界ボックス(通常はbboxと短縮)は、2つの経度と2つの緯度によって定義される領域です。
  • マップの表示が変更されたときにレポートをリフレッシュする動的アクション。

ノート:

Oracle Spatial内の制限により、この例は、マップに地球の半分未満が表示されている場合にのみ機能します。したがって、マップのズーム・レベル1とズーム・レベル2のレポートは更新されません。『Oracle Spatial開発者ガイド』「座標系(空間参照システム)」を参照してください。

マップとレポート・リージョンを接続するには:

  1. アプリケーションの作成ウィザードを実行して、アプリケーションを作成します。
  2. ページの作成ウィザードを実行して、新しいマップ・ページを追加します。
    1. 「アプリケーション」ホームページで、「ページの作成.」をクリックします
      「ページの作成」が表示され、「コンポーネント」「機能」および「レガシー・ページ」の3つのタブがあります。
    2. 「コンポーネント」で、「マップ」を選択します。
    3. ページ定義:
      • 名前 - このページのテキスト名を指定します(例: Earthquake Map)。
      • ページ・モード - デフォルトの「標準」を受け入れます。
    4. データ・ソース:
      • データ・ソース - ページのデータ・ソース(たとえば「ローカル・データベース」)を選択します。
      • ソース・タイプ - 新規ページのソース(たとえば、)を指定します。
      • 表/ビューの名前 - マップの基になる表を選択します(例: EARTHQUAKE_TABLE)。
    5. ナビゲーション - リージョンを展開して、ナビゲーションを有効または無効にします。いずれかのフラグが有効である場合は、追加の属性が表示されます。属性についてさらに学習するには、フィールドレベル・ヘルプを参照してください。
    6. 「次」をクリックします。
    7. マップ・スタイル - 空間ジオメトリ・レイヤーのタイプを選択します(例: 「ポイント」)。
    8. マップ属性:
      • ジオメトリ列タイプ - 空間オブジェクトの取得方法を選択します(たとえば「ジオメトリ列」)。
      • ジオメトリ列 - 空間ジオメトリ列(たとえばGEOMETRY)を選択します。
      • ツールチップ列 - ツールチップとして使用する列(たとえばMAG)を選択します。
    9. 「ページの作成」をクリックします。
    10. ページを実行すると、地震マップが表示されます。
    11. ページ・デザイナに戻ります。実行時開発者ツールバーの「ページX」をクリックします。Xはページ番号です。
    ページ・デザイナが表示されます。
  3. マップの横にクラシック・レポートを追加します。
    1. 「レンダリング」タブで、Earthquake Mapリージョンを選択します。
    2. 中央ペインの下部にある「ギャラリ」、「リージョン」タブで、「クラシック・レポート」を探します。
    3. 「クラシック・レポート」を右クリックして「追加先」「本体」Earthquake Map「列を後に挿入」の順に選択します。
      「レイアウト」タブのEarthquake Mapの横に、新しいクラシック・レポート・リージョンが表示されます。
    4. プロパティ・エディタで、次のリージョン属性を編集します。
      • 識別、タイトル - Earthquake Tableと入力します
      • ソース、タイプ - 「SQL問合せ」を選択します。
      • ソース、SQL問合せ - 次を入力します。
        select id, title, mag
        from earthquake_table
        where mag > 3
      • レイアウト、順序 - 20と入力します
      quake_rpt_region_att.pngの説明が続きます
      図quake_rpt_region_att.pngの説明
    5. 「クラシック・レポート」リージョンの属性を編集します。
      • 「属性」タブをクリックします。
      • メッセージ、データが見つからない場合 - 次を入力します。

        No features on the map. If you're zoomed out to the whole earth, zoom in to see data.

    6. 「ページの保存と実行」をクリックします。

      新しいクラシック・レポートが地震マップの右側に表示されます。

      quake_map_rpt.pngの説明が続きます
      図quake_map_rpt.pngの説明
    7. ページ・デザイナに戻ります。実行時開発者ツールバーの「ページX」をクリックします。Xはページ番号です。
  4. 非表示のページ・アイテムを追加して、現在のマップの状態(境界ボックスとも呼ばれる)を維持します。
    1. 「レンダリング」タブで、Earthquake Tableを右クリックして「下にページ・アイテムを作成」を選択します。
    2. プロパティ・エディタで、次の「ページ・アイテム」属性を編集します。
      • 識別、名前 - PX_BBOXと入力します。Xはページ番号です。
      • 指定、タイプ - 「非表示」を選択します。
      • 設定、保護された値 - このオプションを無効にします。
  5. Earthquake Mapリージョンを更新します。
    1. 「レンダリング」タブで、Earthquake Mapリージョンを選択します。
    2. プロパティ・エディタで「属性」をクリックします。
    3. 詳細、境界ボックス・アイテム - PX_BBOXを選択します。このXはページ番号です。
    4. 「保存」をクリックします。
  6. クラシック・レポートを定義するSQL問合せを更新して、空間フィルタを含めます。
    1. 「レンダリング」タブで、Earthquake Tableリージョンを選択します。
    2. プロパティ・エディタで、次のものを更新します。
      • ソース、SQL問合せ - 次を入力します。

        select id, title, mag
          from earthquake_table
         where (mag > 3)
           and sdo_anyinteract (geometry,
                                sdo_util.from_geojson ( :PX_BBOX)) = 'TRUE'

        PX_BBOXXはページ番号です。

      • ソース、送信するページ・アイテム - PX_BBOXを選択します。このXはページ番号です。

      update_quake_rpt_source.pngの説明が続きます
      図update_quake_rpt_source.pngの説明
  7. 動的アクションを追加して、マップの表示が変更されたときにレポートをリフレッシュします。
    1. 「レンダリング」タブで、マップ・リージョンEarthquake Mapを右クリックし、「動的アクションの作成」を選択します。
    2. プロパティ・エディタで、次の動的アクション属性を編集します。
      • 識別、名前 - この動的アクションの名前を入力します(たとえばMap Change)。
      • タイミング、イベント - マップが変更されました[マップ]を選択します。
      • クライアント側の条件、タイプ - 「アイテムはnullではない」を選択します。
      • クライアント側の条件、アイテム - PX_BBOXを選択します。このXはページ番号です。

      次に、TRUEのアクションを追加します。

  8. 「値の設定」のアクションを追加します。これは、現在のズーム・レベルが3より小さい場合に、PX_BBOXアイテム(マップ・リージョンによって設定される)をNULLにリセットします。
    1. 「レンダリング」タブで、既存のTrueアクション、「表示」を選択します。
    2. プロパティ・エディタで次の属性を編集します。
      • 識別、名前 - アクションの名前を入力します(例: NULL if zoom < 3)。
      • 識別、アクション - 「値の設定」を選択します。
      • 設定、タイプの設定 - 「静的割当て」を選択します。
      • 影響を受ける要素、アイテム - PX_BBOXを選択します。このXはページ番号です。
      • クライアント側の条件、タイプ - 「JavaScript式」を選択します。
      • クライアント側の条件、JavaScript式 - 次のように入力します。

        this.data && this.data.zoom < 3

      set_value_action.pngの説明が続きます
      図set_value_action.pngの説明
  9. PX_BBOXがNULLでない場合、レポート・リージョンを表示する「表示」のアクションを追加します。このアクションを「値の設定」のアクションと組み合せると、ズーム・レベル0、1および2のレポートが非表示になります。
    1. 「レンダリング」タブで、「Map Change」動的アクションを選択し、「TRUEアクションの作成」を選択します。
    2. プロパティ・エディタで次の属性を編集します。
      • 識別、名前 - アクションの名前を入力します(例: Hide if zoom 0, 1, 2)。
      • 識別、アクション - 「表示」を選択します。
      • 影響を受ける要素、選択タイプ - 「リージョン」を選択します。
      • 影響を受ける要素、リージョン - Earthquake Tableを選択します。
      • クライアント側の条件、タイプ - 「アイテムはnullではない」を選択します。
      • クライアント側の条件、アイテム - PX_BBOXを選択します。このXはページ番号です。
  10. PX_BBOXがNULLの場合に、クラシック・レポートを非表示にするための「非表示」アクションを追加します。
    1. 「レンダリング」タブで、マップの変更動的アクションを右クリックし、「TRUEアクションの作成」を選択します。
    2. プロパティ・エディタで次の属性を編集します。
      • 識別、名前 - アクションの名前を入力します(例: Hide if BBOX NULL)。
      • 識別、アクション - 「非表示」を選択します。
      • 影響を受ける要素、選択タイプ - 「リージョン」を選択します。
      • 影響を受ける要素、リージョン - Earthquake Tableを選択します。
      • クライアント側の条件、タイプ - 「アイテムはnull」を選択します。
      • クライアント側の条件、アイテム - PX_BBOXを選択します。このXはページ番号です。
      • 「保存」をクリックします。
  11. クラシック・レポートが表示されている場合(つまり、PX_BBOXがNULLでない場合)にそれをリフレッシュするための「リフレッシュ」アクションを追加します。
    1. 「レンダリング」タブで、マップの変更動的アクションを右クリックし、「TRUEアクションの作成」を選択します。
    2. プロパティ・エディタで次の属性を編集します。
      • 識別、名前 - アクションの名前を入力します(例: Refresh report)。
      • 識別、アクション - 「リフレッシュ」を選択します。
      • 影響を受ける要素、選択タイプ - 「リージョン」を選択します。
      • 影響を受ける要素、リージョン - Earthquake Tableを選択します。
      • クライアント側の条件、タイプ - 「アイテムはnullではない」を選択します。
      • クライアント側の条件、アイテム - PX_BBOXを選択します。このXはページ番号です。
      • 「保存」をクリックします。
      refresh_action.pngの説明が続きます。
      図refresh_action.pngの説明
  12. 「ページの保存と実行」をクリックします。

    最初、レポートは表示されません。

  13. ナビゲーション・バーで、「ズーム」を2回クリックします。

    Earthquake Tableが表示されます。

    quake_map_final.pngの説明が続きます
    図quake_map_final.pngの説明

    マップを再配置すると、Earthquake Tableも更新されます。