LoginSignup
9
9

More than 5 years have passed since last update.

Webに『たんけんぼくのまち』みたいな地図を作る 基礎編

Last updated at Posted at 2015-09-25

くらさんじゃないよ、チョーさんだよ!

小さい頃はNHK教育を娯楽代わりにしてみていたために、いつの間にか教育されていたという少年時代を過ごしていたような気がします。

b0285074_11371547.jpg
完成予想図

iOS9の地図とかものすごくて技術の進化のスピードにおどろく日々ですね。でも、世の中リアルではなくて、スーパーディフォルメなこんな地図も時代に関わらず面白いと思っている僕は、こんな地図が作りたい。作るためにはどうしたらイイんだろうと思ったところ、道路ネットワークなる用語を教えてもらいまして、それらをつかって、ゴールに至るまでの経緯です。

とっつきやすいGUIから。

DBを扱う上でコマンドラインでガシガシやっちゃえる人がたくさんいますが、僕はすぐ操作方法を忘れてしまうのでGUIの方がありがたいなと思い調べてみたところ、QGISというPythonで書かれたそれっぽいツールがありました。
http://dataninja.jp/qgis-mac-install/
こちらを参考にして入れてみます。
>動きましたー

70ZnI_gwz89s9zORWNEzNoAFE1y22CF5zbWCIbJGOHc.png
東京23区と全国の路線データをマッピングしたやつです。
僕の目には東京湾の中心にNEO-TOKYOが見えます。

下の参考サイトをなぞると同じことが出来ちゃいます。
書いていただいた方の足跡に沿って一歩一歩進んでみました。

WEBの練習

最終的なアウトプットはWEB上で展開する予定のため、簡単な作業フローを試してみます。
http://qiita.com/halhide/items/0d4116a11d05c21e6edc
こちらを参考にして入れてみました。
>動きましたー
GZaVFOuoX8AFMI1FlGkl8CZdCBBafE4o3iiN8AZHfMo.png

http://ghost.obscure.tokyo/d3/
自分色に染めた地図を作りたいと思った時には、GoogleMapのパレット(色情報)を
カスタマイズする以外のプレイもあるんですね。これは楽しいかも!
QGISはこの辺でだいぶわかってきましたね。
もはやこいつらはSVGなので、いかようにもできるということです。

ローカルDBにGISのデータを入れてみる。

今回、全国の道路ネットワークをゲットしようと思ってこの辺のセットアップを行いました。道路データ、1.2Gとかありまして、DBを挟まないとダメかなと思ったところ、PostGISという存在を知りました。

PostgreSQLは、カラムに緯度経度の箱を持っていたり、半径何キロという位置情報の処理をSQL文で直接作れるということで経験則ではありますが、位置情報のサービスをする上で結構なシェアを誇っています。

まずは、PostGISというPostgreSQLのやつを。
ということでPostgresから。
http://qiita.com/tstomoki/items/0f1a930bd42a8e1fdaac

そして、PostGISです。
http://qiita.com/Mitsunori_Tsukada/items/4b62562930f5865bdcf5

元データはどこにあるんだというところですが、OpenStreetMapの方からいただいて変換する方法で対応を行ってみます。
http://k-side.hatenablog.jp/entry/2015/04/24/150743
インポート出来たら、あとはローカルで好きなものを好きなだけGETできるはずです。道路幅とかでフィルタしたいんですが、国道、県道等のフラグはあったんですが調査中です。

普通に出来たところから、
どうやってモディファイしていくかという流れで書いていきます。

9
9
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
9