webGISを自作してみたい


ちょっと脈略はないかもしれませんが、仕事上も個人的興味の中でも、今最もアツいのは、「webGISを自作すること」です。

webGISってこんなやつです。

赤いのは活断層のあるエリアです。


この想いに至った理由は、いくつかありますが、主なものは以下の3点です。


  1. ずっとGISについてもっと知りたかったし、自作したいとと悶々としていたが、最近いろんな人GIS界隈)に出会うことができ、自作できることを知った。※特に「ひなたGIS」の創造主に会ったことは大きい。
  2. GISを知らない人にGISでできることを伝えるには、「こうやったら便利だろ!」を見せつける必要がある
  3. 自作で作った様子を見せれば、周りの人がギャフンと言い、協力や応援してくれるかもしれない

特に、1番目のきっかけと3番目の想いが強めに効いています。最近はこの動機を基に、いろんなところに首を突っ込んでいます。

※ひなたGISとは、宮崎市の職員さんが自力で作ったwebGISのことです。これやばいす。
hinata GIS


この出来事を機に、自作webGISについて本気で取り組もうと思っています。
(なぜなら、実現可能性が見えてきたから・・・)

具体的な方法は先人の知恵を借りる

確かに、とあるイベントで会った人たちに「自作できるよ」とは言われましたが、「はい、そうですか。では、やってみます。」と簡単には行きません。

というわけで、手当たり次第ググりました。

GIS 自作
webGIS 自作
GIS 自分で作る
GIS java
GIS 作り方

などなど、検索ワードは様々試しましたが、あまりいいページにたどり着きません。ほとんどが、「ArcGISレイヤーの作り方」とかそんな類です。

そんな中、最も近かったのが、国土地理院のページです。

実は、国土地理院から背景地図に使っていい地図は配布されています。

maps.gsi.go.jp

このサイトがまさにwebGISでしょう。
しかも日本の国土を管理?している国土地理院が出しているのだから、最も見本にすべき対象でしょう。

しかも、こうゆうサイト作るなら、こんなコード書いてね!みたいなページすらあるではないですか!?
地理院地図|ヘルプ
地理院地図|地理院タイルを用いたサイト構築サンプル集

これを参考にすれば、確かに背景地図をweb上で表示することはできました。

f:id:demacassette:20171018232550p:plain
こんな感じ。これはコピペでできる。。。


しかし、私がやりたいのは、その地図上に自分が載せたい情報のレイヤーを追加することです。


やはり先人の知恵はすごい

そして、さらにググりました。

GIS html
webGIS html

など、今度はコードに関するキーワードを加えてみました。

すると、奇跡的にFOSS4G関連のページにたどり着きました。

(はじめから、FOSS4GとかGeoOS.jpとかみとけば良かった)

そこで見つかったFOSS4G 2013のハンズオンセッション資料を基本的には参考にすることとします。

www.slideshare.net


公式のHPはこちら
sites.google.com


FOSS4Gって何?とかいう話は一旦置いておきましょう。


とりあえず、目指しているのは、フリーの背景地図を使って、自分がいじれるwebGISを作ることです。

これにより、低コストでGISの良さを伝えることができると見込んでいます。

試行結果

このスライドシェアに記載されている流れに沿って、試してみたりしています。

一応、webGISでレイヤーを重ねるための要素は理解したつもりです。

この時点では、先に紹介した国土地理院ベースの地図を背景地図にして、その上になんらかのレイヤーを表示するというところまでは行きました。

しかし、問題が残っています。

カーソル動かすと、上に乗せたレイヤーだけが移動してしまう。。。

つまり、背景地図とレイヤーとの座標が結合されていないように見えます。

ただ、これまで「きっと自作できるんだろうなぁ」と思い描いていたものが、不細工ながらも形になったということで、今日のところは勘弁していただきたい。


この記事も、その興奮のままに書き連ねているので、あまり良い整理になっていないと思いますので、後ほどシリーズ化したいと思います。

参考図書

地図化すると世の中が見えてくる

地図化すると世の中が見えてくる

GISを使った主題図作成講座-地域情報をまとめる・伝える

GISを使った主題図作成講座-地域情報をまとめる・伝える

3日で分かるビジネスGIS特訓ドリル

3日で分かるビジネスGIS特訓ドリル