rui live note

WordPress、PHP、子育て、ブログ、将棋、コワーキング、子育て、群馬等に関する日々感じたことを書いているブログです

*

棋士データベースで遊ぶ(4)〜OpenStreetMapで棋士出身地マップを作る〜

  • このエントリーをはてなブックマークに追加
  • Pocket

※この記事は「将棋 Advent Calendar 2016 – Adventar」の16日目です。

前回は棋士の出身地から都道府県別のグラフを作ってみましたが、今度は出身地のデータを利用して棋士を地図上にマッピングしてみようと思います!

棋士出身地マップ

最終的に出来上がったページはこちら。

棋士出身地マップ

棋士出身地マップ

マーカーをクリックすると棋士データベースから取得した棋士名、出身地、画像がポップアップで開くようになってます。

それにしても中座真七段ってすごい所からプロ入りを果たした方なんですね・・・、奨励会時代どんなに苦労されたことでしょう。

中座真七段

この地図何となくいじってるだけで結構楽しいので、どうぞお試しください。

出身地マップの作り方

地図の作り方をざっと流れで説明してみます。

地図は OpenStreetMap、地図上にマーカーを追加するのは Leaflet という JavaScript ライブラリを使いました。この組み合わせ、この程度のことがすごく簡単に作れてしまうのでとてもいい感じ。

以前の記事で作った全棋士データが入った kishi_all.json を元に、出身地から緯度・経度を取得したデータを追加して新たなデータ(map.json)を作ります。

そのデータを作るために組んだスクリプトはこちら。

スクリプト内の緯度・経度の取得には、こちらの Google Maps Geocoding API を使いました。

後は作られた json をマップページから読み込んで、Leaflet の機能でマーカー追加していけば出来上がりです。ページのソースはこんな感じです。

いやーこういう動きがあるものを作るのは楽しいですね。次回は違うものを作る予定でしたが、地図ネタでまた何か考えてみようかな・・・。

ad

この記事が気に入ったらシェアしてもらえると嬉しいです!

  • このエントリーをはてなブックマークに追加
  • Pocket
  • follow us in feedly
  • RSS

  関連記事

めかぶ
今日は大船渡から旬の味覚のめかぶが届きました

今日は3月11日でしたね。たまたまなのですが、実家の大船渡から旬の味覚のめかぶが …

OSC群馬
楽しかったオープンソースカンファレンス2016 Gunma

先日、地元LABI1高崎で開かれた「OSC 2016 GUNMA」行ってまいりま …

コロコロコミック
次世代ワールドホビーフェアに行くならコロコロコミックのVIP入場券を応募しておこう!

コロコロキッズたちの胸を焦がすビッグイベント「次世代ワールドホビーフェア ’15 …

次世代ワールドホビーフェア
今週末に迫った「次世代ワールドホビーフェア ’14 Summer」、我が家は行くや行かざるや・・・

コロコロキッズの祭典「次世代ワールドホビーフェア '14 Summer …

FAAVO群馬
群馬を応援できるクラウドファンディング「FAAVO群馬」がオープン!

クラウドファンディングサービス「FAAVO」の群馬版である「FAAVO群馬」が、 …

ジバニャンのチョコボー
また争奪戦必至か!?9月15日からジバニャンのチョコボーが発売される!

あちこちが妖怪ウォッチ関連グッズで溢れかえる昨今ですが、最近はコンビニにもどっぷ …

妖怪ウォッチ
妖怪ウォッチの「ようかい体操第一」4番の歌詞がまさかの内容で子ども大喜びだった件

ようかい体操第一 ついこないだまでオレカバトルに大はまりしてたと思いきや、今は妖 …

和凧
前橋の「上州空っ風凧揚げ大会」に行ってきました

2月15日、前橋で開かれた「第23回上州空っ風凧揚げ大会」に子どもたちと行ってき …

WordPressもくもく勉強会@群馬
4/30の「WordPressもくもく勉強会@群馬 #21」開催レポートです

WordPressもくもく勉強会@群馬 #21 : ATND WordPress …

将棋用語辞書
将棋ブログを書くなら必ず入れておきたい「IME用将棋用語辞書」

何となくはてな界隈で将棋に関するブログ記事を見かけることが増え、将棋ブームが歩み …