Latest Contributions by KokiKUNIHARA

はじめに 2020年8月25日, 8月26日にウェビナーとして開催した 「ArcGIS 開発者のための最新アプリ開発塾2020」、多数の方にご参加いただきありがとうございました。今年の開発塾では、昨年からパワーアップした内容として、Web GIS を中心とした ArcGIS プラットフォームの活用方法および各 SDK 製品の特長や開発のベストプラクティスをハンズオン形式で実施しました。   昨年の開発塾と同様、本セミナーでの配布資料のデジタル版、ハンズオンで使用したデータやソースコードを GitHub 上で公開しております。都合により参加できなかった方、ArcGIS プラットフォームを活用した開発用 API / SDK での開発を体験してみたい方は、本記事に記載した「ハンズオンの進め方」をご参照ください。こちらをご参照いただければ開発塾当日と同じようにハンズオンを実施することができますので、ご活用ください。 ハンズオンの進め方 まずは環境設定を行い、各セッションの講義内容をご参照の上、ハンズオンを実施してください。 ・一日目 1. Web GIS 基礎 ～ArcGIS Online を使ってみよう！～     1-1. 講義     1-2. ハンズオン 2. ArcGIS Pro を使用した Web マップの作成     2-1. 講義     2-2. ハンズオン（ArcGIS Pro をお持ちの方）     2-3. ハンズオン（ArcGIS Pro をお持ちでない方） 3. ArcGIS API for Python を使用した現地調査用オフラインデータの作成     3-1. 講義     3-2. ハンズオン 4. ArcGIS Runtime SDK for .NET を使用して現地調査アプリを開発してみよう！     4-1. 講義     4-2. ハンズオン ・二日目 1. Web GIS 基礎 ～ArcGIS Online を使ってみよう！～     1-1. 講義     1-2. ハンズオン 2. ArcGIS Pro を使用した Web マップの作成     2-1. 講義     2-2. ハンズオン（ArcGIS Pro をお持ちの方）     2-3. ハンズオン（ArcGIS Pro をお持ちでない方） 3. ArcGIS API for Python を使用した Web マップ更新     3-1. 講義     3-2. ハンズオン 4. ArcGIS API for JavaScript を使用して Web アプリを開発してみよう！     4-1. 講義     4-2. ハンズオン 関連リンク 2018年 - 「ArcGIS 開発者のための最新アプリ開発塾」のハンズオンコードも大公開 2019年 - 「ArcGIS 開発者のための最新アプリ開発塾 2019」のハンズオンコードも大公開 ... View more

はじめに 昨年開催した「ArcGIS 開発者のための最新アプリ開発塾 2019」に引き続き、今年も 「ArcGIS 開発者のための最新アプリ開発塾2020」を開催します。今年はウェビナー（オンライン）での開催ですが、昨年に引き続き、Web GIS を中心とした ArcGIS プラットフォームの活用方法についてご紹介します。内容は昨年よりもボリュームアップしており、これから ArcGIS を使った開発を始める方から既存の開発者様まで満足していただける内容になっています。 開発塾とは 弊社永田町オフィスで毎年開催している開発者様向けのハンズオンセミナー（無料）で、各SDK製品の特長や開発のベストプラクティスをハンズオン形式で学んでいただくことができます。年々参加者も増えてきており（2019年の参加者数は2018年の参加者数から倍増）、ArcGIS を使った開発を始めてみたい、もしくは、より深く知りたいという場合、まずご参加いただきたいセミナーの一つです。 開催プログラムの内容 今年の開発塾は2日間に渡り開催され、さらにパワーアップした内容になっています。プログラムは各開催日で異なりますが（一部重複あり）、両日参加していただいても、1日だけ参加していただいても構いません。奮ってご参加ください。プログラムの詳細に関してはこちらをご参照ください。 関連リンク 2018年 - 「ArcGIS 開発者のための最新アプリ開発塾」のハンズオンコードも大公開 2019年 - 「ArcGIS 開発者のための最新アプリ開発塾 2019」のハンズオンコードも大公開 ... View more

はじめに 「ArcGIS Runtime SDK で実現できるオフラインワークフロー」シリーズブログでは、オフラインアプリの開発を始める方の第一歩として、ArcGIS Runtime で実現できるオフラインワークフロー、データの準備、ポイントとなるコードについてご紹介しています。   ArcGIS Runtime で実現できるオフラインワークフロー ～概要編～ ArcGIS Runtime で実現できるオフラインワークフロー ～デスクトップ パターン～ ArcGIS Runtime SDK で実現できるオフラインワークフロー ～サービス パターン～   前回の記事では、オフラインワークフローの 2 つのパターン（デスクトップ パターン、サービス パターン）について、それぞれの特徴をご紹介しました。シリーズ第 2 回目となる今回は、デスクトップ パターンを実現するために必要なデータの作成方法とデータを読み込むためのコードをご紹介します。   デスクトップ パターン実現に必要な手順 ①モバイル マップ パッケージの作成 ②モバイル マップ パッケージの読込   ①モバイル マップ パッケージの作成 デスクトップ パターンではモバイル マップ パッケージやモバイル シーン パッケージを読み取り専用のオフラインデータとして使用します（本記事ではモバイル マップ パッケージを使用します）。モバイル マップ パッケージを読み込むだけでArcGIS Pro で作成したマップをアプリでもそのまま表示することができるので、レイヤーを追加したり、レイヤーのスタイルを設定したりする機能のコーディングが不要になります。そのため、開発コストを抑えることができます。   モバイル マップ パッケージの作成手順 モバイル マップ パッケージの作成手順は以下になりますが、詳細はこちらをご参照ください。   ArcGIS Pro でマップを作成 マップにレイヤーを追加/スタイル設定 ジオプロセシング ツールを使用してモバイル マップ パッケージを作成   ②モバイル マップ パッケージの読込 モバイル マップ パッケージの読込は以下の手順で実行します。   MobileMapPackage クラスの OpenAsync メソッドでモバイル マップ パッケージ　のディレクトリを指定してパッケージの読込 「1」で読込んだパッケージをMapview　クラスの Map プロパティに格納   // モバイル マップ パッケージの読込 MobileMapPackage　offlineMapPackage = await MobileMapPackage.OpenAsync(pathToUnpackedPackage); // モバイルマップパッケージに格納されているデータをマップに展開する var map = offlineMapPackage.Maps.First(); MyMapView.Map = map; // ベースマップ読込 MyMapView.Map.Basemap = Basemap.CreateImagery(); ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   こちらはESRIジャパンが Githubに公開しているサンプルのモバイル マップ パッケージとベースマップを読み込んだものです。上記サンプルコードを試される際にご使用ください。     チャレンジ①：有効期限付きのモバイル マップ パッケージの読込 ArcGIS Pro 2.4 以降では作成するモバイル マップ パッケージに対してマップの有効期限を設定することができます（ArcGIS Publisher　エクステンションが必要です）。そして、MobileMapPackage クラスの　Expiration プロパティを使用することで、アプリ起動時にモバイル マップ パッケージの有効期限を読み込んでマップの使用可否の判定や有効期限までの日数のリマインドをすることなどができます。   // モバイル マップ パッケージを読み込む MobileMapPackage offlineMapPackage = await MobileMapPackage.OpenAsync(data); // モバイル マップ パッケージの有効期限を読み込む. Expiration expirationDetails = offlineMapPackage.Expiration; System.Text.StringBuilder messageBuilder = new System.Text.StringBuilder(); // モバイル マップ パッケージの有効期限が過ぎているか判定する if (expirationDetails.IsExpired) { messageBuilder.AppendLine("モバイル マップ パッケージの有効期限が過ぎています:"); // 有効期限が過ぎていても使用可能かどうかを判定する. switch (expirationDetails.Type) { case ExpirationType.AllowExpiredAccess: messageBuilder.AppendLine("このマップは使用することができますが、有効期限が過ぎていないものに取り換えてください。"); MessageBox.Show(messageBuilder.ToString()); break; case ExpirationType.PreventExpiredAccess: messageBuilder.AppendLine("このマップは使用することができません。"); MessageBox.Show(messageBuilder.ToString()); return; } } // モバイル マップ パッケージの有効期限が過ぎていない場合 else { // 有効期限まであと何日かを出力 System.DateTimeOffset expirationDate = expirationDetails.DateTime; double daysLeft = expirationDate.Subtract(System.DateTime.Today).TotalDays; messageBuilder.AppendLine(string.Format("このマップの有効期限はあと {0} 日です", Math.Ceiling(daysLeft))); // 有効期限が過ぎたら使えなくなるモバイル マップ パッケージの場合 if (expirationDetails.Type == ExpirationType.PreventExpiredAccess) { messageBuilder.AppendLine("有効期限を過ぎたらこのマップは使用できなくなります"); } MessageBox.Show(messageBuilder.ToString()); } ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   有効期限の設定は、定期的に最新のモバイル マップ パッケージを作成するためのリマインダーとして、また、データを委託先の開発会社に渡す際などに役に立ちます。     チャレンジ②：編集用データとしてシェープファイルの読込 上述したように、デスクトップ パターンではモバイル マップ パッケージやモバイル シーン パッケージを読み取り専用のオフラインデータとして使用します。しかし、業務によってはデータの編集が必要になる場合もあるかと思います。その際は、読み取り専用データに加えて、シェープファイルや GeoPackage などをローカルデータとして保持し、それらに対してデータの編集を行う必要があります。   ※シェープファイルや GeoPackageの読込/編集を行うためには Standard ライセンス以上が必要です。詳細はこちらをご確認ください。   シェープファイルの読込は以下の手順で実行します。   ShapefileFeatureTable クラスの　OpenAsync メソッドを使用してシェープファイルをオープン 「1」でオープンしたシェープファイルを FeatureLayer　としてマップに追加   // ベースマップの読込 MyMapView.Map = new Map(Basemap.CreateImagery()); // シェープファイルのディレクトリ string filepath = @""; // シェープファイルをオープン ShapefileFeatureTable myShapefile = await ShapefileFeatureTable.OpenAsync(filepath); // オープンしたシェープファイルをレイヤーに格納 FeatureLayer newFeatureLayer = new FeatureLayer(myShapefile); // レンダリング Symbol sym = null; SimpleLineSymbol lineSym = new SimpleLineSymbol(SimpleLineSymbolStyle.Solid, Color.Black, 0.5); sym = new SimpleFillSymbol(SimpleFillSymbolStyle.Solid, Color.Pink, lineSym); newFeatureLayer.Renderer = new SimpleRenderer(sym); // 上記レイヤーマップに追加 MyMapView.Map.OperationalLayers.Add(newFeatureLayer); // ズーム await MyMapView.SetViewpointGeometryAsync(newFeatureLayer.FullExtent, 50); ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   こちらはESRIジャパンが公開している全国市区町村界データ（シェープファイル）を読み込んだものです。上記サンプルコードを試される際にご使用ください。     まとめ いかがでしたでしょうか。今回は、ArcGIS Runtime SDK を使って実現できるオフライン ワークフローのデスクトップ パターンについて説明しました。ArcGIS Pro でモバイル マップ パッケージを作成することによって、簡単にオフラインデータを用意することができます。また、シェープファイルなどを読み込むことによって、ローカルデータの編集を伴うアプリの開発も簡単に行うことができます。次回の連載では、ArcGIS Runtime で実現できるオフラインワークフローのサービス パターンを実現するための、データの準備方法、ポイントとなるコードについて紹介します。   次回 ArcGIS Runtime で実現できるオフラインワークフロー ～サービス パターン～   関連リンク ・ArcGIS 関連ページ               ・ArcGIS Runtime SDK for .NET (ESRIジャパン製品ページ)               ・ArcGIS for Developers (ESRIジャパン製品ページ)               ・ArcGIS Online (ESRIジャパン製品ページ)               ・ArcGIS Enterprise (ESRIジャパン製品ページ)               ・ArcGIS for Developer 開発リソース集               ・ArcGIS Runtime SDK for .NET (米国Esriページ (英語) ) ・シリーズブログ関連ページ ・デスクトップ地図アプリ開発 シリーズ ... View more

1. はじめに この記事は、[続編 はじめてのWeb マッピングアプリケーション開発] のシリーズ記事として、はじめて地図アプリの開発を行う開発者の方に向けて、ウィジェットを使ったアプリ開発についてシリーズで紹介しています。 続編 はじめてのWeb マッピングアプリケーション開発：ウィジェット編 続編 はじめての Web マッピングアプリケーション開発：印刷ウィジェット編 続編 はじめての Web マッピングアプリケーション開発：編集ウィジェット編 続編 はじめての Web マッピングアプリケーション開発：ナビゲーション ウィジェット編 続編 はじめてのWeb マッピングアプリケーション開発：OAuth 2.0編 前回の記事では、編集機能を実装するうえで、便利な編集ウィジェットを紹介しました。今回は、手軽にルート検索機能を実装できるナビゲーション ウィジェットを紹介いたします。  これまでの記事と同様に、ソースコードは ESRIジャパンの GitHub で公開していますので、ご覧ください。Web アプリ開発の実行環境をお持ちでない方は、JSBin を使用して、Web ブラウザー上でコードの入力・編集、アプリの実行を試すこともできます。   2. ナビゲーション ウィジェット とは ナビゲーション ウィジェットとは、シリーズ最初のウィジェット編の記事で紹介した、ArcGIS API for JavaScript が提供する UI コンポーネント群の一つです。 ArcGIS API for JavaScript で提供されているナビゲーション ウィジェットは ArcGIS World Routing Service というサービスを使用するウィジェットで、このウィジェットを使うことによって、数行のコードでルーティング機能をGIS アプリケーションに実装することができ、目的地までの最適なルートと所要時間を計算することができます。   2-1.  ウィジェットの実装 ナビゲーション ウィジェットの実装  ① Directions モジュールの追加 ※前回の記事、編集ウィジェット編で作成したコードにナビゲーション ウィジェットを追加していきます。 初めに、require ステートメントで Directions を追加します。   require([ "esri/Map", "esri/views/MapView", "esri/widgets/Search", "esri/widgets/BasemapGallery", "esri/widgets/Print", "esri/widgets/Expand", "esri/widgets/Editor", "esri/widgets/Directions" ], function(Map, MapView, Search, BasemapGallery, Print, Expand, Editor, Directions) {   ② Directions ウィジェットの作成 require で追加した Directions モジュールを使用して、Directions クラスから directions オブジェクトを作成します。directions オブジェクトの view プロパティに view を設定します。   /************************************************************ * 省略 ************************************************************/ // Directions ウィジェット var directions = new Directions ({ view: view });   ③ Expand ウィジェットに追加 前回の記事でも紹介しましたが、Expand ウィジェットを活用することによってより洗練されたUI を持つ地図アプリを作成することができるので、今回作成するDirections ウィジェットも Expand ウィジェットに追加します。   /************************************************************ * 省略 ************************************************************/ view.when(function() { view.ui.add(createExpandWidgets([search, basemapGallery, print, editor, directions]), ‘top-right’); }); function createExpandWidgets(widgets){ return widgets.map(widget => new Expand({ view: view, content: widget, expanded: false, group: ‘top-right’ })) }     3. ナビゲーション ウィジェットの使い方と機能 ナビゲーション ウィジェットでは、以下項目の設定をすることができます。 出発地 目的地/経由地 ルーティングの条件（運転時間優先でのルーティングや運転距離優先でのルーティングなど） 出発時間 そして、ルート検索後、目的地までのルートの詳細を確認することができます。                             また、移動モード条件の変更や出発地と目的地の入れ替えなども簡単に実行することが可能です。   4. シンボル設定  出発地と目的地/経由地にプロットされるポイントとルートのラインシンボルの設定をすることができます。 ① SympleMarkerSymbolモジュールの追加 require ステートメントで SimpleMarkerSymbol　を追加します。   require([ "esri/Map", "esri/views/MapView", "esri/widgets/Search", "esri/widgets/BasemapGallery", "esri/widgets/Print", "esri/widgets/Expand", "esri/widgets/Editor", "esri/widgets/Directions", "esri/symbols/SimpleMarkerSymbol" ], function(Map, MapView, Search, BasemapGallery, Print, Expand, Editor, Directions, SimpleMarkerSymbol) {   ② ポイント用シンボルの作成 SimpleMarkerSymbol型のインスタンスを戻り値とする「createStopSymbol」メソッドを作成し、directionsオブジェクトのstopSymbols の各プロパティにセットします。   function createStopSymbol(color, size) { return new SimpleMarkerSymbol({ style: "simple-marker", size: size, outline: { 　　 width: "2px", 　　color: "white" 　　}, color: color }); } // ポイントシンボル設定 directions.stopSymbols.first = createStopSymbol("green","14px"); directions.stopSymbols.middle = createStopSymbol("black","10px"); directions.stopSymbols.last = createStopSymbol("red","14px");   ③ ライン用シンボルの作成 directionsオブジェクトのstopSymbols の各プロパティにラインシンボル用の値をセットします。   // ラインシンボル設定 directions.routeSymbol.width = "2"; directions.routeSymbol.color = [0, 0, 0, 0.75]; directions.routeSymbol.style = "short-dot";      5. まとめ 今回はルーティング機能を手軽に実装できるナビゲーション ウィジェットを紹介しました。ナビゲーション ウィジェットを使えばたった数行のコードで、汎用的に使えるルーティング機能を実装できます。本シリーズで今まで紹介したウィジェットも含めて、ご活用ください。 今回作成したサンプルは以下で動作を確認することも可能です。 ナビゲーション ウィジェット：リンク 次回はセキュアなログイン認証機能を実装する上で便利な、OAuth 2.0 についてご紹介します。   6. さいごに シリーズ第二弾の印刷ウィジェット編で印刷ウィジェットの実装について紹介しましたが、ナビゲーション ウィジェット使用後に印刷ウィジェットを使用することで、簡単に目的地までの道順付きの地図を出力することができます。  ウィジェット単体でも便利ですが、ウィジェットを組合せて使用することでより便利なアプリケーションを開発することができます。ArcGIS API for JavaScript には本シリーズで紹介したウィジェット以外にも様々なウィジェットが搭載されています。業務に合わせて最適なウィジェットの組合せを考えてみてください。   7. 関連リンク ・はじめてのWebマッピングアプリケーション開発 はじめての Web マッピングアプリケーション開発：地図表示編 はじめてのWeb マッピングアプリケーション開発：レイヤー表示編 はじめての Web マッピングアプリケーション開発：レイヤーの可視化編 はじめての Web マッピングアプリケーション開発：ポップアップの設定編 はじめての Web マッピングアプリケーション開発：Web マップの作成・表示編 はじめてのWeb マッピングアプリケーション開発：グラフィック編 はじめてのWeb マッピングアプリケーション開発：クエリ編 続編 はじめての Web マッピングアプリケーション開発：ウィジェット シリーズ編 続編 はじめての Web マッピングアプリケーション開発：印刷ウィジェット編 続編 はじめての Web マッピングアプリケーション開発：編集ウィジェット編 ・ArcGIS　API　for JavaScript ・ArcGIS for Developer 開発リソース集 ... View more

はじめに 以前、GeoNet ブログで 2019/8/23 (金) に弊社永田町オフィスにて開催した「 ArcGIS 開発者のための最新アプリ開発塾 2019 」のハンズオン資料を公開しました。本連載では、そのハンズオンで活用した、「 Data Collection for .NET 」アプリが持つ主要な機能について解説を、前半/後半2回にわたりご紹介しています。   このアプリが持つ主要な機能は以下の4つで、前回の記事では 「 1.認証 」,「 2.オフラインデータの作成 」 について解説を行いましたが、本記事では 「 3. (オフライン)データの編集 」,「 4.オフラインデータとオンラインデータの同期 」 について解説を行います。 1.認証 2.オフラインデータの作成 3.(オフライン)データの編集 4.オフラインデータとオンラインデータの同期 3. (オフライン)データの編集 以下のイメージでは、街路樹ポイント データの属性を編集しています。 今回使用している Web マップ では、属性値：「 Condition 」 を使用してポイントのシンボルを定義しているため、「 Condition 」 項目の値を変更するとポイントのシンボルが変更されます。 データ編集時の処理の流れ データ編集時は以下3点が実装のポイントとなります。それぞれの処理概要を説明します。   1.フィーチャの選択 2.属性画面の表示 3.データの更新 1.フィーチャの選択 GeoView クラスの IdentifyLayersAsync メソッドを使用してクリックした地点にフィーチャがあるかどうか確認することができます。フィーチャが存在する場合、FeatureLayer クラスの SelectFeature メソッドでそのフィーチャを選択します。 ※ ソースファイル：DataCollection.Shared\Binding Support\IdentifyController.cs                                  DataCollection.Shared\ViewModels\MainViewModel.cs // クリックした地点にフィーチャがあるか確認 var identifyLayersTask = mapView.IdentifyLayersAsync(tapScreenPoint, pixelTolerance, returnPopupsOnly, maxResultCount); // クリックした地点にフィーチャがある場合 if (identifyLayersTask.Result.Count > 0) { // フィーチャを取得 var feature = identifyLayerResult.GeoElements[0] as ArcGISFeature; // フィーチャを選択 var featureLayer = feature.FeatureTable.FeatureLayer; featureLayer.SelectFeature(feature); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ 2.属性画面の表示 PopupManager と Popup クラスを使用して属性画面を表示させます。そして、StartEditing メソッドで編集開始、FinishEditingAsync メソッドで編集を終了します。   ※ ソースファイル：DataCollection.Shared\ViewModels\IdentifiedFeatureViewModel.cs public PopupManager PopupManager { get; set; } // 属性画面を表示 PopupManager = new PopupManager(new Popup(feature, featureTable.PopupDefinition)); // 編集開始 PopupManager.StartEditing(); // 編集終了 PopupManager.FinishEditingAsync(); ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ 3.データの更新 Popup クラスの GeoElement プロパティを使用して編集対象フィーチャを取得します。そして、FeatureTable クラスの UpdateFeatureAsync メソッドを使用してフィーチャの更新を行います。   ※ ソースファイル：DataCollection.Shared\ViewModels\EditViewModel.cs // 編集対象フィーチャの取得 var editedFeature = popupManager.Popup.GeoElement as ArcGISFeature; // フィーチャの更新 table.UpdateFeatureAsync(editedFeature); ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ 4. オフラインデータとオンラインデータの同期 以下のイメージでは、編集したオフラインデータをオンラインデータに同期させています。 オフラインデータとオンラインデータの同期は 「 Esri.ArcGISRuntime.Tasks.Offline 」 ネームスペースにあるクラスやプロパティを使用することによって実現することができます。以下に詳細を記載します。 オフラインデータ同期の流れ 1.同期用のインスタンス作成 OfflineMapSyncTask クラスの CreateAsync メソッドを使用します。 2.同期用のパラメータ作成 OfflineMapSyncParameters クラスで同期用のパラメータを作成します。パラメータの詳細は以下に記載します。 ・SyncDirection ⇒ 同期方法の指定 ・RollbackOnFailure ⇒ 処理失敗時にロールバックするかの指定 3.同期用のジョブ作成 OfflineMapSyncJob クラスの SyncOfflineMap メソッドを使用します。 4.同期処理実行 OfflineMapSyncJob クラスの Start メソッドを使用します。 ※ ソースファイル：DataCollection.Shared\ViewModels\SyncViewModel.cs // 1.同期用のインスタンス作成 var syncTask = await OfflineMapSyncTask.CreateAsync(map); // 2.同期用のパラメータ作成 var taskParams = new OfflineMapSyncParameters() { SyncDirection = SyncDirection.Bidirectional, RollbackOnFailure = true }; // 3.同期用のジョブ作成 internal OfflineMapSyncJob OfflineMapSyncJob { get; private set; } OfflineMapSyncJob = syncTask.SyncOfflineMap(taskParams); // 4.同期処理実行 OfflineMapSyncJob.Start(); ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ まとめ いかがでしたでしょうか。本記事では、Data Collection for .NET に実装されている　「 (オフライン)データの編集 」 や 「 オフラインデータとオンラインデータの同期 」 について簡単ですが、機能の解説を行いました。 Web マップを活用してオフラインで使用するアプリの開発を行う際には、本記事の内容を参考にしていただければと思います。また、Data Collection for .NET は 参照するWeb マップを変更するだけで、汎用的にご利用いただけますので、現在業務でお使いのデータでアプリを使用してみてください。 関連リンク Data Collection for .NET の機能を解説 (前半) Data Collection Data Collection .NET (GitHub) Data Collection iOS (GitHub) ArcGIS Runtime SDK for .NET (ArcGIS for Developers)  ArcGIS for Developer 開発リソース集 ... View more

はじめに このシリーズでは「ArcGIS Pro SDK for .NET を使用した機能開発」のシリーズ記事として、ArcGIS Pro を拡張するためのアドイン開発時によく使う便利なクラスやメソッド、また、それらを用いた実践的な開発をご紹介します。本シリーズで実装するソースはすべて Github に格納してありますので、ぜひ ArcGIS Pro SDK for .NET（以下 Pro SDK）を使用する開発の参考にしてください。   本シリーズ第1回目となる今回は「マップとの対話的な操作により選択したフィーチャの属性表示を行う機能」を実装する方法をご紹介します。   本記事の対象読者 ・Pro SDK を使用してArcGIS Pro のアドイン開発を行っている方 ・Pro SDK を使用したArcGIS Pro のアドイン開発をこれから行う、もしくは、検討している方   ※「ArcGIS Pro SDK for .NET を使った独力での開発」でご紹介した Pro SDK のハンズオンで予習しておくと、本シリーズをよりスムーズに理解できると思います。   Tips:マップとの対話的な操作とは？ マップとの対話的な操作とは、マップをクリックしたり、ジオメトリをスケッチしたり、マップに対して何らかの操作をしてそこから結果を得ることです。以下動画でマップをクリックした地点の座標を表示させていますが、これはマップをクリックして（マップに対する操作）、そこの座標を取得する（結果を得る）というマップとの対話的な操作の一例です。                                     Pro SDK でマップとの対話的な操作を行うためのアイテム 「マップ ツール」というアイテムを使用する必要があります。上記動画の「MapTool1」というボタンがそれにあたります。マップ ツールの実装方法については後述します。   本記事で実装する機能の概要 マップ ツールで選択したフィーチャの属性をドッキング ウインドウに配置した DataGrid に表示させる機能を実装します（以下「完成イメージ」参照）。ドッキング ウインドウの実装方法については後述します。   完成イメージ                               ※本記事ではドッキング ウインドウの「対話的操作」タブ内の一部機能の実装を行います（当該タブ内のその他の機能は次回の連載にてご紹介します）。他タブの機能も今後の連載でご紹介します。   Tips:なぜマップ ツールをドッキング ウインドウへ配置する必要があるのか？ Pro SDK で追加するアイテムはデフォルトで「アドイン」タブに配置されます。確かにそれでも問題ないこともあると思いますが、追加したアイテムをドッキング ウインドウに配置することにより、より操作性の高い機能を開発することができます。マップ ツールをドッキング ウインドウに配置（ドッキング ウインドウ右上の「選択」ボタン）することによって、見た目のバランスや操作の導線を考慮した開発をすることができるようになります。   本記事で実装する機能の実装手順 1.マップ ツールの作成 2.マップ ツールをドッキング ウインドウへ配置 3.アクティブなマップ ビューに存在するレイヤーをコンボ ボックスに格納 4.マップ ツールを使用して選択したフィーチャの属性を DataGrid に表示 5.マップ ビューに対するイベント クラスの利用   本記事で使用する主な API カテゴリ　     本記事では「マップ ビュー」、「ジオデータベース」を中心に使用します。   ※API カテゴリに関しては「ArcGIS Pro SDK for .NET を使った独力での開発」をご参照ください。   本記事で使用するソース 本記事で使用するソースは Github に格納しています。ソースに関して実装のポイントとなる部分を抜粋して解説しますので、ダウンロードをお願いします。   本記事で使用するファイル     1.Config.daml ボタンなどのアイテムに対して、配置場所などを定義するための設定ファイル。プロジェクト作成時にデフォルトで作成されます。   2.IdentifyFeatures.cs マップ ツール。作成手順に関しては「1.マップツールの作成」をご参照ください。   3.MainDockPane.xaml ドッキング ウインドウ。作成手順に関しては「Pro SDK を使用した ArcGIS Pro の拡張④：アドインの開発」をご参照ください。   4.MainDockPaneViewModel.cs ViewModel。ドッキング ウインドウ（MainDockPane.xaml）作成時に自動的に作成されます。   実装手順 1. マップツールの作成 前述した通りですが、マップ ツールはマップに対して対話的な操作を行うためのアイテムです。マップをクリックしたり、ジオメトリをスケッチする際にイベントを発生させることができます。   手順 1.1  マップ ツールをプロジェクトに追加 「プロジェクトを右クリック > 追加 > 新しい項目 > ArcGIS Pro マップ ツール」の手順でマップ ツールをプロジェクトに追加します（本記事ではIdentifyFeatures.cs と名前を付けて保存しています）。     1.2 IdentifyFeatures.cs（マップ ツール）に処理を追加 今回実装する処理ではフィーチャの選択はポリゴンで行うため、「SketchType」 プロパティに 「SketchGeometryType.Polygon」 を設定します。また、「OnSketchCompleteAsync」メソッド（当該ファイルにデフォルトで作成されているメソッド）の処理を以下のように拡張します。このように実装することで、マップ ツールでスケッチしたポリゴンに交差するフィーチャを選択することができます。 public IdentifyFeatures() { IsSketchTool = true; // ポリゴンをスケッチする SketchType = SketchGeometryType.Polygon; SketchOutputMode = SketchOutputMode.Map; } protected override Task<bool> OnSketchCompleteAsync(Geometry geometry) { return QueuedTask.Run(() => { // スケッチしたジオメトリに交差するフィーチャを選択する var mapView = MapView.Active; mapView.SelectFeatures(geometry); return true; }); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍    これで「マップ ツールの作成」は完了です。次の手順で作成したマップ ツールをドッキング ウインドウに配置します。   2. マップ ツールをドッキング ウインドウへ配置 「選択」ボタンを押した際にマップ ツールが起動するように実装します。      手順 2.1 MainDockPane.xaml の設定 「選択」ボタンの 「Command」 属性を 「MainDockPaneViewModel.cs」 の 「SelectionTool」プロパティとバインドします。 <Button Grid.Column="2" Content="選択" Command="{Binding Path= SelectionTool}" Style="{DynamicResource Esri_Button}"></Button>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   2.2 MainDockPaneViewModel.cs でイベントハンドラを登録 「選択」ボタンを押すと 「ExecuteSelectionTool()」メソッドが実行されるように実装します（マップツールが起動します）。当該メソッド内では 「"AddInSamples_IdentifyFeatures"」（マップ ツールのDAMLID）を引数として 「GetPlugInWrapper()」 メソッドが実行されます。このように 「GetPlugInWrapper()」 を使用することでマップ ツール と「選択」ボタンをバインドすることができるようになります。 protected MainDockPaneViewModel() { // 選択ボタンを押すとExecuteSelectionTool()が実行される _selectionTool = new RelayCommand(() => ExecuteSelectionTool(), () => true); } private RelayCommand _selectionTool; public ICommand SelectionTool => _selectionTool; internal static void ExecuteSelectionTool() { // 作成したマップ ツールのDAMLIDを指定 var cmd = FrameworkApplication.GetPlugInWrapper("AddInSamples_IdentifyFeatures") as ICommand; if (cmd.CanExecute(null)) // マップツール起動 cmd.Execute(null); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   2.3 Config.daml の設定 「アドイン」 タブにマップ ツールが表示されないように以下のようにマップ ツールの要素をコメントアウトします。 <group id="AddInSamples_Group1" caption="Group 1" appearsOnAddInTab="true"> <button refID="AddInSamples_MainDockPane_ShowButton" size="large" /> <!—-<tool refID="AddInSamples_IdentifyFeatures" size="large" />--> </group>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   これで「マップツールをドッキング ウインドウへ配置」は完了です。   3. アクティブなマップ ビューに存在するレイヤーをコンボ ボックスに格納 コンボ ボックスの選択肢がアクティブなマップ ビューに含まれているレイヤーを動的に表示するように実装します。      手順 3.1 MainDockPane.xaml の設定 コンボ ボックスの 「Itemsource」 と 「SelectedItem」 属性を 「MainDockPaneViewModel.cs」 の「FeatureLayers」 と 「SelectedFeatureLayer」プロパティとバインドさせます。 <ComboBox Grid.Column="1" ItemsSource="{Binding FeatureLayers}" SelectedItem="{Binding SelectedFeatureLayer}"/>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   3.2 コンボ ボックスとバインドするプロパティを作成 「MainDockPaneViewModel.cs」 に「FeatureLayers」と「SelectedFeatureLayer」プロパティ（「3.1」でバインドさせたプロパティ）を作成します。各々の役割は以下の通りです。   ・FeatureLayers・・・アクティブなマップ ビューに存在するレイヤーを格納 ・SelectedFeatureLayer・・・コンボ ボックスで選択しているレイヤーを格納   private ObservableCollection<BasicFeatureLayer> _featureLayers = new ObservableCollection<BasicFeatureLayer>(); private BasicFeatureLayer _selectedFeatureLayer; public ObservableCollection<BasicFeatureLayer> FeatureLayers { get { return _featureLayers; } set { SetProperty(ref _featureLayers, value, () => FeatureLayers); } } public BasicFeatureLayer SelectedFeatureLayer { get { return _selectedFeatureLayer; } set { SetProperty(ref _selectedFeatureLayer, value, () => SelectedFeatureLayer); } }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   3.3 GetLayers() メソッドの実装 「3.2」で作成した「FeatureLayers」プロパティにアクティブなマップ ビューに存在するレイヤーを格納します。 private void GetLayers() { // アクティブなマップビューを取得 var mapView = MapView.Active; if (mapView == null) return; // コンボ ボックスに格納されているレイヤーをクリア FeatureLayers.Clear(); // コンボ ボックスにレイヤーを格納 foreach (var featureLayer in mapView.Map.Layers.OfType<BasicFeatureLayer>()) { FeatureLayers.Add(featureLayer); } }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   これで「アクティブなマップ ビューに存在するレイヤーをコンボ ボックスに格納」は完了です。   4. マップ ツールを使用して選択したフィーチャの属性を DataGrid に表示 マップ ツールを使用して選択したフィーチャの属性を表示する DataGrid を実装します。     手順 4.1 MainDockPane.xaml の設定 DataGrid の「ItemsSourse」 属性と 「MainDockPaneViewModel.cs」 の 「SelectedFeatureDataTable」 プロパティをバインドします。 <DataGrid ItemsSource="{Binding Path=SelectedFeatureDataTable, Mode=OneWay}" Grid.ColumnSpan="2"> </DataGrid>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   4.2 DataGrid とバインドするプロパティを作成 「MainDockPaneViewModel.cs」 に「SelectedFeatureDataTable」プロパティを作成します。 private DataTable _selectedFeatureDataTable; public DataTable SelectedFeatureDataTable { get { return _selectedFeatureDataTable; } set { SetProperty(ref _selectedFeatureDataTable, value, () => SelectedFeatureDataTable); } }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   これで「マップ ツールを使用して選択したフィーチャの属性を DataGrid に表示」は完了です。   5. マップ ビューに対するイベント クラスの利用 マップ ツールの他にマップ ビューに対するイベント クラスを使用すると、より高度なマップとの対話的な操作ができるようになります。今回使用するイベント クラスは以下の四つです。   ・MapSelectionChangedEvent マップ内の選択状態が変わった場合に発生   ・ActiveMapViewChangedEvent アクティブなマップを切り替えた場合に発生   ・LayersAddedEvent マップにレイヤーを追加した場合に発生   ・LayersRemovedEvent マップからレイヤーを削除した場合に発生   5.1 イベントの登録 「MainDockPaneViewModel.cs」 のコンストラクタに以下三つのイベントを登録します。 protected MainDockPaneViewModel() { // マップツール _selectionTool = new RelayCommand(() => ExecuteSelectionTool(), () => true); // イベントの登録 ActiveMapViewChangedEvent.Subscribe(OnActiveMapViewChanged); LayersAddedEvent.Subscribe(OnLayerAdded); LayersRemovedEvent.Subscribe(OnLayerRemoved); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   もう一つのイベント「MapSelectionChangedEvent」を「OnShow」メソッド内で登録します。 「MainDockPaneViewModel.cs」が継承している「DockPane」抽象クラスの「OnShow」メソッドをオーバーライドすることでドッキング ウインドウが表示/非表示されるタイミングでイベントの登録/解除を行うことができるようになります。今回はドッキング ウインドウが非表示の場合は MapSelectionChangedEvent を解除するように実装します。 private SubscriptionToken _mapSelectionChangedEvent = null; protected override void OnShow(bool isVisible) { if (isVisible && _mapSelectionChangedEvent == null) { // イベントの登録 _mapSelectionChangedEvent = MapSelectionChangedEvent.Subscribe(OnMapSelectionChanged); } if (!isVisible && _mapSelectionChangedEvent != null) { // イベントの解除 MapSelectionChangedEvent.Unsubscribe(_mapSelectionChangedEvent); _mapSelectionChangedEvent = null; } }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   5.2 イベントハンドラの実装① 以下のイベントハンドラを実装します。 ・OnLayerAdded() マップにレイヤーを追加した時に実行されます。追加したレイヤーをコンボ ボックスに格納します。   ・OnLayerRemoved() マップからレイヤーを削除した時に実行されます。削除したレイヤーをコンボ ボックスから削除します。また、DataGrid をクリアして選択しているフィーチャを解除します。   ・OnActiveMapViewChanged() アクティブなマップビューが変わった時に実行されます。「3.3」で実装した「GetLayers()」メソッドを実行することでコンボ ボックスにアクティブなマップ ビューに存在するレイヤーを格納します。 private void OnLayerAdded(LayerEventsArgs args) { // 追加したレイヤーをコンボボックスに追加 foreach (var featureLayer in args.Layers.OfType<BasicFeatureLayer>().ToList()) { FeatureLayers.Add(featureLayer); } } private void OnLayerRemoved(LayerEventsArgs args) { // 削除したレイヤーをコンボボックスから削除 foreach (var featureLayer in args.Layers.OfType<BasicFeatureLayer>().ToList()) { if (_featureLayers.Contains(featureLayer)) { FeatureLayers.Remove(featureLayer); } } // DataGridをクリアして選択しているフィーチャを解除 Clear(); } private void OnActiveMapViewChanged(ActiveMapViewChangedEventArgs args) { // レイヤーを取得 GetLayers(); // DataGridをクリアして選択しているフィーチャを解除 Clear(); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   5.3 イベントハンドラの実装② 以下のイベントハンドラを実装します。 ・OnMapSelectionChanged() マップ ツールを使用して選択したフィーチャのフィールド情報と属性を取得し、それらを DataGrid に格納します。 private void OnMapSelectionChanged(MapSelectionChangedEventArgs args) { QueuedTask.Run(() => { // レイヤーを選択していない場合 if (_selectedFeatureLayer == null) return; var listColumnNames = new List<KeyValuePair<string, string>>(); var listValues = new List<List<string>>(); // 選択したフィーチャを処理する using (var rowCursor = _selectedFeatureLayer.GetSelection().Search(null)) { bool bDefineColumns = true; while (rowCursor.MoveNext()) { var anyRow = rowCursor.Current; if (bDefineColumns) { // 選択したフィーチャのフィールドを取得 foreach (var fld in anyRow.GetFields().Where(fld => fld.FieldType != FieldType.Geometry)) { listColumnNames.Add(new KeyValuePair<string, string>(fld.Name, fld.AliasName)); } } // 選択したフィーチャの属性を取得 var newRow = new List<string>(); foreach (var fld in anyRow.GetFields().Where(fld => fld.FieldType != FieldType.Geometry)) { newRow.Add((anyRow[fld.Name] == null) ? string.Empty : anyRow[fld.Name].ToString()); } listValues.Add(newRow); bDefineColumns = false; } } // DataGridにカラムを設定 SelectedFeatureDataTable = new DataTable(); foreach (var col in listColumnNames) { SelectedFeatureDataTable.Columns.Add(new DataColumn(col.Key, typeof(string)) { Caption = col.Value }); } // DataGridに選択したフィーチャの属性を格納 foreach (var row in listValues) { var newRow = SelectedFeatureDataTable.NewRow(); newRow.ItemArray = row.ToArray(); SelectedFeatureDataTable.Rows.Add(newRow); } if (_selectedFeatureDataTable.Rows.Count > 0) { // ズーム ZoomToSelection(); } NotifyPropertyChanged(() => SelectedFeatureDataTable); }); }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   5.4 SelectedFeatureLayer に処理を追加 「3.2」で実装した「SelectedFeatureLayer」のセッターに「OnMapSelectionChanged(null);」 を追加します。これによってフィーチャ選択後(複数のフィーチャクラスのフィーチャを選択)にコンボ ボックスのレイヤーを変更し、変更後のレイヤーのフィーチャが選択されている場合、その属性が DataGrid に表示されるようになります(以下動画参照)。                                 public BasicFeatureLayer SelectedFeatureLayer { get { return _selectedFeatureLayer; } set { SetProperty(ref _selectedFeatureLayer, value, () => SelectedFeatureLayer); OnMapSelectionChanged(null); } }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍   これで「マップ ビューに対するイベント クラスの利用」は完了です。   まとめ このようにマップ ツールとイベント クラスを利用することによって、ArcGIS Pro 単独では実現できない高度なマップとの対話的な操作を実現することができるようになります。マップ ツールにはその他にも様々なメソッドが用意されています。また、その他様々なイベント クラスも用意されていますので、Pro SDK を使用して開発を行う際はぜひ使ってみてください。   次回 次回は「マップとの対話的な操作その2」です。本記事でご紹介した機能を拡張します。   関連リンク ArcGIS Pro SDK for .NET を使用した ArcGIS Pro の拡張 シリーズ ArcGIS Pro SDK for .NET ArcGIS Pro SDK for .NET コンセプト（GitHub） ArcGIS Pro SDK for .NET サンプル集（GitHub） ArcGIS Pro SDK 2.4 for .NET API リファレンス ArcGIS Pro SDK for .NET ハンズオン ... View more

この記事では「Web マッピング アプリ開発に便利なツールをご紹介」のシリーズ記事として、ArcGIS API for JavaScript を使用して地図アプリ開発を行う方に向けて、開発の役に立つ便利なツールをご紹介します。   前回は webpack を利用したカスタム ビルドの作成方法と CLI を利用したテンプレート アプリの作成方法について紹介しました。 第四回目となる今回は、ArcGIS API for JavaScript Snippets をご紹介します。これは ArcGIS API for JavaScript のコード スニペットを提供する Visual Studio Code のエクステンションです。   Visual Studio Code とは？ Visual Studio Code とはソースコード エディタです。マイクロソフト社により開発され、Windows、Linux、macOS 上で動作します。デバッグ、Git クライアントの統合、シンタックスハイライト、インテリセンス、スニペット、リファクタリングなどの機能を持ちます。カスタマイズもでき、利用者はエディタのテーマやキーボードショートカット等を変更することができます。Visual Studio Code での開発環境の構築方法については「Web マッピング アプリ開発に便利なツールをご紹介：～Visual Studio Code で開発環境を構築～」の記事もご覧ください。   ArcGIS API for JavaScript Snippets とは？ ArcGIS API for JavaScript Snippets は ArcGIS API for JavaScript のコード スニペットを提供する Visual Studio Code のエクステンションです。皆様は ArcGIS API for JavaScript で開発を行っている際にコードの書き方を思い出せない経験をしたことはないでしょうか？例えば、個別値分類表示したいけど、UniqueValueRenderer の使い方を忘れてしまったので、API リファレンスを参照し、サンプルコードをコピーして、それをご自身の目的に合った形にカスタマイズするといったようなことは開発者の方にとってはよくあることかと思います。ArcGIS API for JavaScript Snippetsを使用することによって、そういった面倒な手間を省き、コード スニペットを使用してより効率的に開発をすることができるようになります。   ArcGIS API for JavaScript Snippets の使用例 コード スニペットの利用例を以下の動画でご紹介します（3D マップでのラベル追加の実装）。動画を見ると、この実装はコード量が多くて複雑ということがわかるかと思います。こういった場合は、動画の中に出てくる LabelClass のプロパティをすべて覚えるのではなく、コード スニペットを利用することによって、効率よく開発を行うことができます。ご自身でつけたコード スニペットの名前（動画では labeling3d という名前）をタイプし、Tab キーを押すだけでそれを実現することができます。     ArcGIS API for JavaScript Snippets のインストール 1. Visual Studio Code で Extensions を押下してください   2. 検索バーで「ArcGIS API for JavaScript」と検索し、「ArcGIS API for JavaScript Snippet」 をインストールしてください   3. 登録されているコード スニペットの名前を確認してください   これらのコード スニペット名をタイプし、Tab キーを押せば、登録されているコード スニペットを使用することができます。登録されているコード スニペットは Github で確認することができます。もし、ここに登録したいコード スニペットがない場合は GitHub にイシューを作成するか、プルリクエストをしてください。もしくは、Github に新しく登録する必要はないけど、ご自身で新しいコード スニペットを作成したいという場合は Visual Studio Code 上に登録することができます。登録方法は「Snippets in Visual Studio Code」の記事（英語）を参照してください。   ArcGIS API for JavaScript Snippetsの対応言語 本ブログではArcGIS API for JavaScript のコード スニペットについてご紹介しているのですが、ArcGIS API for JavaScript SnippetsはArcGIS API for JavaScript 以外の言語にも対応しています。以下に対応言語の一覧を記載しますので、ぜひ使ってみてください。 ・HTML コード スニペット ・ArcGIS API for JavaScript コード スニペット ・TypeScript コード スニペット ・JSON コード スニペット ・TSX コード スニペット   ブラウザー コンソールでデバッグする際に便利なコード スニペット 開発時だけではなく、デバッグ時に使用できるコード スニペットも用意されています。例えば、以下の動画のように「Pretty print camera」スニペットを使用すると、3D アプリをインタラクティブに操作し、現在表示されているカメラ位置のコードをコンソールに表示できます。アプリではそのコードをそのままペーストするだけで簡単に初期表示位置を設定できます。こちらのコード スニペットも Github で確認することができます。使用方法は「Run Snippets Of JavaScript On Any Page With Chrome DevTools」のチュートリアル（英語）を参照してください。また、チュートリアルでは Google Chrome デベロッパー ツールを使用していますが、Firefox を使用されている方は Scratchpad を使用して同様のことができます。     まとめ このように ArcGIS API for JavaScript Snippets を使用することによって、コード作成の負担を減らし、開発を効率的に進めることができます。開発工数の削減をお考えの方はぜひ ArcGIS API for JavaScript Snippets を使ってみてください。 ... View more

I'm using TimeSlider widget and I've found a minor defect. TimeSlider | ArcGIS API for JavaScript 4.12  Time in my widget shows like YYYY/MM/DD HH:MM:SI. It should go by 10-minute interval like from 2019/07/03 00:10:00 to 2019/07/03 00:20:00 when you click on the play button, the next and previous button and use mouse cursor, but when using  mouse cursor, it goes by like from 2019/07/03 0:10:00 to 0:09:59. A summary of this issue is below. 1.The issue is not reproducible when you click on the play button of the Time Slider widget. 2.The issue is not reproducible when clicking on the next and previous button of the Time Slider widget. 3.The issue is reproducible when you manually move the time slider by using mouse cursor only at certain points for. e.g: between 2019/07/03 12:10:00 - 2019/07/03 12:20:00. In addition, this happens when your browser is maximized. I know the esri/widgets/TimeSlider class is currently on a beta release state, but I'd like to notify this issue and I hope it will be fixed. I've attached a video showing the issue. I would appreciate it if you could take a look at it. ... View more