避難場所のオープンデータを可視化

本記事では、WireCloud を使って京都府にある避難場所を可視化する方法を紹介します。避難場所のデータは、京都府オープンデータポータルサイト KYOTO DATASTORE にある、”【京都府】避難所一覧” のオープンデータを利用しています。

前提条件

本記事の内容を試すために、WireCloud の稼働環境が必要です。”WireCloudのセットアップ” の記事を参考にして環境を作成してください。

Widget のインストール

ダッシュボードを作成するために必要なウィジェットをインストールします。まず、WireCloud にログインして、ウィジェットのマーケットプレイスに移動します。

マーケットプレイスから以下の３つのウィジェットをインストールします。ウィジェットのバージョンに注意してください。これらのウィジェットやオペレータを既にインストール済みの場合、この手順は不要です。

Openlayers Map Widget (CoNWeT/ol3-map/1.2.3)
NGSI source Operator (CoNWeT/ngsi-source/4.2.0b2)
NGSI Entity To PoI Operator (CoNWeT/ngsientity2poi/3.2.2)

キーワード検索を使い、Widget を検索して、”インストール” ボタンを押すことで、Widget がインストールされます。Openlayers Map は、画面を持つ ウィジェット (Widget) でダッシュボードに地図を表示します。NGSI source は、Orion Context Broker から NGSI形式のデータを取得する オペレータ (Operator) で、画面は持っていません。NGSI Entity To PoI は、NGSI形式のデータを Openlayers Map で表示できるように、PoI データの形式に変換します。

ダッシュボードの作成

避難場所のダッシュボードを新規作成します。画面の中央上にあるハンバーガー・アイコン（三）をクリックして、”新しいワークスペース” を選択します。

ワークスペースの名前を設定するダイアローグがオープンします。ワークスペースの名前を入力して、”設定” ボタンをクリックします。

これで、空のワークシートを作成できました。

Widget の配置

次に、ワークスペースに地図を表示する Widget を配置します。ハンバーガー・アイコンの “鉛筆” のアイコンをクリックして、ワークスペースを編集可能な状態にします。そして、”コンポーネンを追加” ボタンをクリックします。画面の左側に、ウィジェットのリストが表示されます。

ウィジェットのリストから、”OpenLayer Map” のウィジェットを見つけて、”ワークスペースに追加” ボタンをクリックします。

クリック後、オレンジ色の OpenLayes Map のウィジェットが一つ作成されます。

生成されたオレンジ色のウィジェットをクリックすると、ウィジェットがダッシュボードに配置され、以下のような画面になります。

地図を大きく表示するため、OpenLayers Map ウィジェットの歯車アイコンをクリックして、”フル・ドラッグボード” を選択します。

地図がワークシート全体に広がり、以下のような画面になります。

ワイヤーリング

次にワイヤーリングの編集画面に移動して、３つのウィジェットを接続します。画面上部の “ワイヤーリング” ボタンをクリックします。クリックできない場合は、”鉛筆” アイコンをクリックして、ワークシートを編集モードに切り替えてから、再度、”ワイヤーリング” ボタンをクリックして下さい。

ワイヤーリングの編集画面が表示されたら、”コンポーネント” 検索ボタンをクリックします。

画面に左側に、ウィジェットとオペレータのリストが表示されます。このリストから Openlayers Map を検索すると、オレンジ色の Openlayers Map のウィジェットが見つかります。これをクリックします。

Openlayers Map のウィジェットのワイヤーリングの編集画面に移動します。

次に、”NGSI Entity To PoI” と “NGSI Source” のオペレータをワイヤーリング編集画面に配置します。まず、”オペレータ” ボタンを選択して、オペレータのリストに切り替えます。次に、”NGSI Entity TO PoI” オペレータを検索して、”作成” ボタンをクリックすると、グリーン色のオペレータが作成されます。