ジオフェンスデータを作ってみよう
はじめに
今回は、前回ご紹介した弊社のiOS用アプリの iChidori-Guide（イチドリ・ガイド）を利用するために、キーとなる「ジオフェンスデータ」を用意していきたいと思います。
前回記事：iChidori-Guide 使ってみた ① | iChidori-Guide 機能紹介
それでは早速行っていきましょう。
geojson.io の紹介
iChidori-Guide で利用するためのジオフェンスデータの形式は「GeoJSON」（ジオジェイソン）ファイルです。
ジオフェンスとは仮想的な境界線で囲まれたエリアのことを指します。
GeoJSON
JavaScript Object Notation（JSON）を用いて空間データをエンコードし非空間属性を関連付けるファイルフォーマットである。属性にはポイント（住所や座標）、ライン（各種道路や境界線）、 ポリゴン（国や地域）などが含まれる。
GeoJSON ファイルを用意するには様々な方法がありますが、今回は手軽に操作できるWebサービスの「geojson.io」でファイルを作成してみます。
ブラウザでアクセスしたら地球全体が表示されます。マウス操作で直感的に地球儀を動かすように表示をする事ができます。
画面にはメニューやアイコンが表示されています。主な部分を紹介します。
※各部名称は今回便宜上示すものです。正式名称などは割愛します。
| インターフェース名 | |
|---|---|
| ①ウィンドウ | 「JSON」タブは、ツールで描画された図形等を自動的にコードとして記述し表示します。編集も可能。 |
| ②検索窓 | 地域名など入力すると、その地点を表示します。 |
| ③アイコン（地図上） |
 地図を拡大表示します。 地図を縮小表示します。 北を画面上として表示をリセットします。 点を地図上に設定します。 線を地図上に設定します。 多角形を地図上に設定します。 矩形を地図上に設定します。 円（正円）を地図上に設定します。 描画したジオフェンス（図形）を編集可能状態にします。
|
| ④メニュー（画面左上） |
「Open」既存のGeoJSONファイルを読み込みます。 「Save」現状をGeoJSONファイルなどに書き出します。 「New」新規に作業画面が表示されます。 「Meta」他各種コマンド（今回は割愛します。） |
| ⑤ボタン（画面左下） | 地図や表示の見え方を切り替えられます。（今回は割愛します。） |
地図上にジオフェンスを描画する
実際に地図にジオフェンスを描画してみましょう。
地図は弊社付近（東京都新宿区高田馬場周辺）をベースにしています。
ジオフェンスを作成すると、画面右側にGeoJSONのコードが自動的入力されていくことにも注目してみてください。
＜点＞
をクリック。
地図上の任意の場所をクリックすると、ピンアイコンが表示されます。
＜線＞
をクリック。
地図上の任意の場所をクリックすると、始点が設定されます。
続けて終点になる部分をクリックすると、始点と繋がるように描画されます。
確定するにはもう一度同じ部分をクリックします。すると実践となり、始点と終点を結ぶ直線が描画されます。
※同じ地点をクリックしなければ、続けて点を打ち続ける事ができます。その点を結ぶように直線が描画されていきます。
＜面＞
多角形
をクリック。
地図上の任意の場所をクリックすると、始点が設定されます。
続けて想定の範囲を囲むように点を追加していきます。同時に想定される範囲が表示されていきます。
最後の地点でダブルクリック（または同じ地点でクリック）すると図形が完成します
矩形
をクリック。
地図上の任意の場所をクリックすると、始点が設定されます。
そのまま対角線上へドラッグすると、四角形が描画されます。
円
をクリック。
地図上の任意の場所をクリックすると、中心点が設定されます。
そのまま中心から任意の方向へドラッグすると、正円が描画されます。
＜編集＞
変更
をクリック。
変更したい点をクリック。ポインタが変更された状態でドラッグすると、点が移動しそれに伴い図形が変形します。
アイコン部分から「Editing Geometries」より「Save」をクリックして確定します。
また、この状態で点と点を結ぶ辺の中間位置にもうひとつの点ができます。この点をドラッグすることでも図形を変形する事もできます。
消去（１）
消去したいジオフェンスをクリック。
表示されるメニューより「Delete feature」をクリックで消去。
消去（２）
をクリック。（描画中のジオフェンス全体が編集状態になります）
ジオフェンスが複数ある場合は、消去したいジオフェンスの点をクリック。
その状態で表示される
をクリックすると、その点が消去されます。
編集を終える場合はアイコン部分「Editing Geometries」より「Save」ボタンをクリック。
ファイルの書き出し
編集が完了したら、これらの情報をファイルとして書き出します。
画面左上のメニューから「Save」から「GeoJSON」をクリック。
自動的にファイルがダウンロードされます。
任意の場所に保存してください。
次回への準備
ジオフェンスをアプリに読み込み、デバイスと連携した働きを実際にしたいので、ジオフェンスデータの作成を行いたいと思います。
ここでは、弊社近くの公園の一角にジオフェンスを作成しています。
新規の画面を用意し、目的地周辺を表示します。
ジオフェンスを描画します。 今回はいくつかの種類のジオフェンス（矩形、円、線）を作成しました。
描画ができたらメニューの「Save」から「GeoJSON」を選択します。
おわりに
今回はジオフェンスの作成をWebサービスの「geojson.io」を利用してシンプルなジオフェンスデータを作成してみました。
次回は、準備したジオフェンスデータをアプリ「iChidori-Guide」に取り込み、iChidoriデバイスと連動したアプリの実際の動きをご紹介します。
どうぞ、ご期待ください。
