1. Spatialマップ・ビジュアライゼーション開発者ガイド
  2. Oracle Maps
  3. Oracle Maps JavaScript API

4.1 Oracle Maps JavaScript API

Oracle Maps JavaScriptクライアントは、ブラウザベースのマップ・ビジュアライゼーション・エンジンであり、マップ・タイル・サーバーの上位で動作し、HTML5テクノロジを使用します。

次の機能が実装されています。

  • マップ・タイル・サーバーからマップ・タイルをフェッチし、マップ・タイル層としてWebブラウザに表示する機能。

  • マップ・ナビゲーション用のドラッグ、機能のクリック、矩形の描画、レッドライニングなどのユーザー操作を制御する機能。

    矩形の描画とは、アプリケーション・ユーザーが矩形の1つの隅をクリックした後、マウス・ボタンを押したままマウスを対角の隅までドラッグし、マウス・ボタンを離して矩形を作成することです。

    レッドライニングとは、アプリケーション・ユーザーがマウス・ボタンをクリックした後、マウスを移動しクリックを複数回実行する(各クリックにより、まっすぐな線分を使用してレッドラインを伸ばす)ことにより、ポリゴンまたはポリラインを作成することです。(多くの場合レッドラインの描画は赤色でレンダリングされますが、任意の色を使用する線スタイルも指定できます。)

これらの機能にアクセスするには、JavaScript API (いくつかのJavaScriptクラスから構成される)を使用します。Oracle Maps JavaScript APIのすべてのクラスの詳細は、次の場所にあるJavadocスタイルのリファレンス・ドキュメントを参照してください。

http://<host>:<port>/mapviewer/jslib/<version>/apidoc/index.html

親トピック: Oracle Maps

4.1.1 Oracle Maps JavaScript APIについて

Oracle Maps JavaScript APIは、最新のブラウザおよびHTML5の機能を利用します。次のような機能があります。

  • maps.oracle.com、Nokia Maps、OpenStreet Mapsなどのマッピング・サービス・プロバイダをはじめとする、様々なサード・パーティのマップ・タイル・サービスに対する組込みのサポート

  • レンダリング・スタイルおよび効果(グラデーション、アニメーション、ドロップ・シャドウなど)のオンザフライ適用による、クライアント側での地理空間データの優れたレンダリング

  • 多くのポイントの自動クラスタリングとクライアント側でのヒート・マップの生成

  • 属性値と空間述語(問合せウィンドウ)に基づく、クライアント側での地物のフィルタ処理

  • 優れた一連の組込みコントロールおよびツール(カスタマイズ可能なナビゲーション・バーと情報ウィンドウ、構成可能な層コントロール、レッドライン・ツール、距離測定ツールなど)

既存のサーバー側の事前定義済スタイルおよびテーマは、APIと連携して動作します。たとえば、次のコード・スニペットでは、関連する事前定義済スタイルを持つ事前定義済テーマmvdemo.customersに基づいて、インタラクティブなベクター層を作成します。 

var baseURL  = "http://"+document.location.host+"/mapviewer";
var layer = new OM.layer.VectorLayer("layer1",  
 {
     def:{
                type:OM.layer.VectorLayer.TYPE_PREDEFINED, 
                dataSource:"mvdemo", 
                theme:"customers", 
                url: baseURL
            }
  });

APIには、次の最上位クラスおよびサブパッケージがあり、これらはすべてネームスペースOMに含まれています。

  • Mapクラスは、このAPIのメイン・クラスです。

  • Featureクラスは、個々の地理的地物を表します。

  • MapContextクラスは、現在のマップの中心点やズーム・レベルなど、いくつかの重要なコンテキスト情報をカプセル化した最上位クラスです。通常はイベント・リスナーに渡されます。

  • controlパッケージには、ナビゲーション・バーや概要マップなど、すべてのマップ・コントロールが含まれています。

  • eventパッケージには、すべてのマップおよび層イベント・クラスが含まれています。

  • filterパッケージには、表示したベクター層の地物を選択またはサブセット化するためのすべてのクライアント側フィルタ(空間またはリレーショナル)が含まれています。

  • geometryパッケージには、様々なジオメトリ・クラスが含まれています。

  • layerパッケージには、様々なタイルおよびベクター層クラスが含まれています。タイル層クラスには、Oracle、Nokia、OpenStreetMapなど、いくつかのオンライン・マップ・サービスへのアクセスが含まれています。ベクター層は、インタラクティブな機能層です。

  • infowindowパッケージには、カスタマイズ可能な情報ウィンドウと、それらのスタイルが含まれています。

  • styleパッケージには、クライアント側のベクター・データに適用できるスタイルが含まれています。また、アニメーション、グラデーション、ドロップ・シャドウなどのビジュアル効果も含まれています。

  • toolパッケージには、距離測定ツール、レッドライン・ツール、ジオメトリ描画ツールなど、様々なマップ・ツールが含まれています。

  • universeパッケージには、組込み(事前定義済)マップ汎用が含まれています。マップ汎用は、マップ・コンテンツの枠ボックスと一連のズーム・レベル定義を定義します。

  • utilパッケージには、様々なユーティリティ・クラスが含まれています。

  • visualfilterパッケージでは、グラデーションやドロップ・シャドウなど、様々なビジュアル効果を実現するためのインタフェースが提供されます。

OM.Mapは、Webブラウザ内の全マップ操作におけるメインのエントリ・クラスです。このクラスや他のクラスにより、アプリケーション固有のロジック、操作および双方向性をWebマッピング・アプリケーションに追加するためのインタフェースが提供されます。次のようなアプリケーション・ロジックおよび操作があります。

  • マップ・クライアント・インスタンスを作成し、それをWebページ内で作成したマップ・コンテナDIVオブジェクトと関連付ける。

  • マップの中心やズーム・レベルなどのマップ・パラメータを構成するもの。

  • マップ・タイル層を作成し、操作する(オプション)。マップ・タイル層は不要です。アプリケーションに含めることができるのは、ズーム・レベルとスケールをプログラムによって定義するカスタム汎用を使用する、インタラクティブなベクター層のみです。

  • ベクター層を作成し、操作する。

  • マップ上に情報ウィンドウを表示するもの。

  • マップ・タイトル、著作権表示、マップ・コントロールなどの固定のマップ装飾を作成する。

  • ナビゲーション・パネル、矩形ツール、円形ツール、スケール・バー、概要マップ・パネルなどの組込みユーティリティにアクセスする。

  • イベント・リスナーを使用してイベント処理を(したがって、マップの相互作用も)カスタマイズする。

Oracle Maps APIの使用に関するその他のノートおよび考慮事項を次に示します。

  • 前のバージョンのAPIの「FOIサーバー」に対応するデータ・サーバーは、地物のベクター・ジオメトリと属性をクライアントにストリーミングして、ローカルでレンダリングを実行できるようにします。したがって、前のバージョンの「FOI層」は、ベクター層と呼ばれます。

  • インタラクティブなベクター層を表示するために、バックグラウンド・マップ・タイル層は必要ありません。たとえば、アプリケーションがバックグラウンド・タイル層を使用することなく、州のテーマ・マップを(人口の五分位値別に色分けするなどして)表示することが可能です。

  • APIはJQueryおよびJQueryUIに依存し、これらをインクルードします。このため、oraclemapsv2.jsはjquery-1.7.2.min.jsおよびjquery-ui-1.8.16.min.jsをインクルードします。アプリケーションでもJQueryとJQueryUIを使用し、これらをすでにインクルードしている場合は、Oracle Mapsライブラリをロードするかわりに、ファイルoraclemapsv2_core.jsを<script>タグ内で使用します。つまり、次を使用します。

    <script src="/mapviewer/jslib/v2/oraclemapsv2_core.js"></script>

    次は使用しません。

    <script src="/mapviewer/jslib/v2/oraclemapsv2.js"></script>

APIを使用したアプリケーションの開発の詳細は、「Oracle Mapsアプリケーションの開発」とOracle提供のチュートリアルおよびデモを参照してください。

親トピック: Oracle Maps JavaScript API