タグ

ブックマーク / gunmagisgeek.com (3)

  • ぬるぬる動く!Web地図クライアント「Leaflet」を使おう!

    D3.jsと組み合わせても使いやすい、Web地図クライアントライブラリの大命……だと、個人的には思ってる……たぶん。 leaflet leaflet.jsとは何か leafletはWeb上で地図を表示するオープンソースのマップクライアントライブラリです。 軽量でスマートフォンなどのタッチ操作にも対応した地図を手軽に表示することができます。 ユーザーによって様々なプラグインが作成されているのが特徴で、それらを組み合わせることで多様な表現を行うことができるので「地図なんてGoogle Maps APIで十分じゃね?」という方も、一度触ってみてください。 そんな訳で、簡単な「Leaflet クイックスタート」的なものを書いてみました。 ベースマップの作成 cdnからcssファイルとjsファイルを読み込みます。 <link rel="stylesheet" href="http://cdn.le

    ぬるぬる動く!Web地図クライアント「Leaflet」を使おう!
    nakaji999
    nakaji999 2017/09/27
  • Google Map上にヒートマップを表示する

    国土数値情報サイトからダウンロードした都道府県地価調査データ(点)を元にGoogle Map上に群馬県の地価データをヒートマップで表示しました。 国土数値情報からダウンロードしたデータをKMLにコンバートし、さらにJavascriptの配列に変更(手動)してます。 (ぶっちゃけJPGIS(XML)から、直接JavaScriptの配列に変換した方が楽だったような気も…) KML形式への変換の仕方は以下の記事を参照してください。 Google Map上に学校区情報(国土数値情報)を表示する ※追記 Quantum GISでgeoJSON形式で出力することができるので、そっちを使う方がらくでした。 データさえできてしまえば、ヒートマップを表示するのは簡単です。 HeatmapLayerを使用するには、libraries=visualizationを付加してGoogle Map APIを読み込んで

    Google Map上にヒートマップを表示する
    nakaji999
    nakaji999 2016/10/28
  • 年収300万未満都市マップ、作ってみた。

    むかし、「未満都市」というドラマがありましたね。まぁ、関係ないですけど。 ネットをさまよっていたら下記のような記事をみつけました。 年収300万円世帯と1000万円世帯では、子どもの学力がはるかに違う~広がる「教育格差」。施設支援から厳しい現実が見えた 件の記事の是非はともかく、以前、整形した「平成25年住宅・土地統計調査」データの中に「世帯の年間収入階級(5区分)」というデータがあったので、地図上にマッピングしてみました。だた、すべての市区町村のデータがあるわけではないので一部の分布のみとなります。 世帯の年間収入マップ 「300万円未満、300万円〜500万円、500万円〜700万円、700万円〜1000万円、1000万円以上」という区分からひとつを選択し、その地域の世帯に対する割合をスライドで選択すると該当する地域が赤く塗られます。 灰色になっているところはデータがない地域です。 マ

    年収300万未満都市マップ、作ってみた。
    nakaji999
    nakaji999 2015/11/28
  • 1