ArcGIS API 4.0 for JavaScript ~Map と View~

Document created by yusuke_nunokawaesrij-esridist Employee on Jul 24, 2015Last modified by yusuke_nunokawaesrij-esridist Employee on Nov 10, 2015
Version 16Show Document
  • View in full screen mode

4.0.png

 

次世代 Web API となる ArcGIS API 4.0 for JavaScript のベータ版が公開され、待望の 3D 対応が目玉となっていますが、それ以外にも多くの機能追加や API の刷新が行われています。

今回は API の刷新におけるもっとも重要な変更である Map と View について簡単にご紹介します。

 

View とは?

従来、ArcGIS API for JavaScript のアプリケーションで地図を作成/制御する際には Map クラスが全てを担っていました。

4.0 では地図制御におけるビジネス ロジックから描画ロジックが分離され、Map と View という 2 つのクラスによって、地図の制御を行うように変更が行われています。

4.0 の Map クラスは描画のためのロジックを持たず、分離された View クラスにそれを任せる構成になっています。

Map クラスは 2D と 3D の両タイプに対応していますが、描画を担う View はそれぞれでクラスが分かれています。

 

Map_View.png

 

Map には表示するデータやレイヤーの情報が含まれていますが、実際にそれらを表示/制御する機能は含まれていません。

背景地図のみを表示するためのスクリプトを比較してみましょう。

 

3.x

 

var map = new Map("mapDiv", {
  basemap: "topo",
  zoom: 4,
  center: [139, 35]
});

 

4.0

var map = new Map({
  basemap: "topo"
});

var view = new MapView({
  container: "viewDiv",
  map: map,
  zoom: 4,
  center: [139, 35]
});

 

4.0 では地図を表示するためのコンテナ、初期表示位置を決めるズームレベルと中心座標は View 側で定義されています。

しかし、一見すると 3.x の方がシンプルに見えます。

このようにコード量が少ないと、一括で制御してくれて一見シンプルに見えますが、地図データや地図に関連する機能が増えていくと、ビジネスロジックと実際にインターフェイスに反映させる描画ロジックを分けることはコードの複雑さを防ぐ助けになります。

MVC デザインパターンのモデル(Model)とビュー(View)のような関係に近いでしょうか。

 

最後に Map と View が分けられたアーキテクチャを利用した 1 つのユニークな例をご紹介します。

 

2Views.gif

 

このアプリでは、左右で異なる地図が表示されていますが、これは 1 つの Map をもとに異なる 2 つの View が作られています。

地図にどのようなデータ(レイヤー)を含めるかは Map で一括管理しており、View によってどのレイヤーを表示するかを切り替えています。たとえば、レイヤーの表示だけでなく、2D/3D も先述のように View が担うため、Map 自体は 2D であろうと 3D であろうと共通で使用することができます。

 

次回はシンプルになったプロパティ アクセスについてご紹介する予定ですのでご期待ください。

Attachments

    Outcomes