トップ «前の日記(2018-04-30(Mon)) 最新 次の日記(2018-05-03(Thu))» 編集

K2さんの雑記


2018-05-02(Wed) [長年日記]

日本一マクドナルドから遠い場所の記事が面白そうだったので、やってみた

Google Mapに、自分の好きなマーキングができそうな記事を、はてなブックマーク経由で見つけていて、面白そうだったのでやってみた。

シナリオは、マクドナルドのページから、店舗情報を取得してローカルに保存、Google Map上に表示するものを作成するというもの。タイトルのページでは、日本で一番マクドナルドから遠い場所はどこかを調べたり非常におもしろい考察をしているので、見てください。私は、とりあえず表示するところまでがんばってやってみようと思った。

まずマクドナルドから店舗情報をjson形式のファイルでローカルにダウンロードする方法を探す。詳細はタイトルページには載っていないので、自分でChromeのデベロッパーツールで調べた。今回デベロッパーツールもはじめて本格的に見たので、店舗情報を探し出すまではかなり手間取った。

Networkのタブで表示されるオブジェクトを一つ一つ見ていくと、地図の表示領域の範囲にある店舗情報が入っているオブジェクトを見つけた。全2887店舗分は入っていない。タイトルページでは、全店舗のjsonがデベロッパーツールで見れるとあったが、結局それは探し出せず。で、表示領域の範囲の店舗情報は、マクドナルドのホストにクエリを出せばもらえているので、ノーオプションで試して見ると、無事全店舗情報が取得できた。

さて、次はFusionTableが紹介されているので、使ってみた。Googleドライブで、まずFusionTableサービスを追加して、新規作成、ファイルをインポートするのだが、ここではcsvファイルを要求される。上記のjsonファイルをK2Editorに読み込んで、キーマクロでcsvファイルに変更。2900店舗分ほどのファイルで、変更に30分くらいかかった。本当はスクリプト言語で変換すれば簡単だと思うのだが、直感的なキーマクロでやってしまった。

で、Fusion Tableにインポートすると、元のファイルに含まれている緯度と経度は自動的に緯度と経度として認識されていて、そのままMap表示をすると全店舗が表示された。

ここでタイトルページは、方針変更、Google Maps JavaScript APIを使用するシナリオに進むので、私もそちらへ。Google APIを使用するのも始めてだったので、全部一から調べたが、Google Developers Consoleに行き、そのまま新規プロジェクトを作成、Google Maps Javascript APIを有効化して、APIキーを取得できた。

で、タイトルページに掲載されているhtmlファイルとjsファイルを使用して、ローカルのChromeで全マクドナルド店舗を地図上に表示することに成功した。下記の図は、1kmの円で描画したマクドナルド店舗マップ。

結構簡単にGoogle Mapが使えることがわかったので、これは仕事で使えそう。個人情報保護の観点であまり公開できるものにはならないが、身内で使うツールとかが作れそうなので、GW明けからがんばってみたい。

画像の説明

本日のツッコミ(全2件) [ツッコミを入れる]
j_catfish (2018-05-13(Sun) 20:20)

いいですね。やってみようと思って頂けて手順までなぞってもらえて、あの記事を書いた甲斐がありました。 <br>自分でも出来そうと思って頂けるように、まさにこんなリアクションを期待して面白げに書いたものですから嬉しいです。 <br>ていうか、自分でやってみると面白かったでしょう?私もそうでしたw

K2 (2018-05-15(Tue) 12:22)

記事作者様からコメントをいただけて恐縮です。以前から地図を使っていろいろやりたいと思っていたのですが、忙しさにかまけてほったらかしになっていました。あの記事がきっかけでいろいろやってみようとモチベーションが高まりましたので、感謝です。 <br>記事を書いていただいて、ありがとうございました。 <br>楽しかったですよ!


1965|09|
2002|09|10|11|12|
2003|01|02|04|05|06|07|08|09|10|11|12|
2004|01|02|03|04|05|06|07|08|09|10|11|12|
2005|01|02|03|04|05|06|07|08|09|10|11|12|
2006|01|02|03|04|05|06|07|08|09|10|11|12|
2007|01|02|03|04|05|06|07|08|09|10|11|12|
2008|01|02|03|04|05|06|07|08|09|10|11|12|
2009|01|02|03|04|05|06|07|08|09|10|11|12|
2010|01|02|03|04|05|07|08|09|10|11|12|
2011|01|02|03|04|05|06|07|08|09|10|11|12|
2012|01|03|04|05|08|
2014|01|02|03|04|05|08|09|10|11|12|
2015|01|02|03|04|05|06|07|08|09|10|11|12|
2016|01|02|03|04|05|06|07|08|09|11|
2017|01|03|05|06|07|08|10|11|12|
2018|01|02|03|04|05|




2018年
5月
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31
//
自己紹介
自己紹介
広告
計るだけダイエット
今聴いてるの
ブルックナー:交響曲第7番 ブルックナー:交響曲第7番
ブルックナー:交響曲第8番 ブルックナー:交響曲第8番
読書中
つっこみリスト
TrackBacks
日記仲間
/ / /
最近の日記
  • 2018-05-04(Fri)
    • 1. 引き続きJavaScript
    • 2. やっと関数
    • 3. 本日も終わり
  • 2018-05-03(Thu)
    • 1. そういうわけで、JavaScript
    • 2. html記述で間違えた場合、ブラウザはエラーを返してくれないの?
    • 3. Visual Studio Codeの上書きモード
    • 4. Visual Studio Codeにキーボードマクロはない
    • 5. 疲れたので本日は終わり
  • 2018-05-02(Wed)
  • 2018-04-08(Sun)
    • 1. タイヤ交換
    • 2. タイヤ交換 ファーストインプレッション
  • 2018-03-24(Sat)
    • 1. ウォーキング 24km 31000歩 平野神社・大覚寺・鈴虫寺・桂離宮
  • 2018-03-20(Tue)
    • 1. バージョン管理システムは重要
    • 2. Bitbucketは太っ腹
  • 2018-03-18(Sun)
    • 1. ウォーキング 24km 31000歩 船岡山・大徳寺・下鴨神社・建仁寺
  • 2018-03-14(Wed)
    • 1. Gitを使った
  • 2018-03-12(Mon)
    • 1. Xcode続き(Start Developing iOS Apps - Implement a Custom Control)
  • 2018-03-11(Sun)
    • 1. ウォーキング 20km 25000歩 神泉苑・泉涌寺
  • 2018-03-08(Thu)
    • 1. Swiftのオプショナル型の解説記事
  • 2018-03-05(Mon)
    • 1. Xcodeの続き−Imageの追加
  • 2018-03-01(Thu)
    • 1. Pythonの関数返り値定義
    • 2. Swiftの関数返り値定義
    • 3. Xcodeでのオブジェクトとコードの接続
    • 4. イベントハンドラ
    • 5. 慣れないCapsキー
  • 2018-02-28(Wed)
    • 1. Xcode上で、イベントアクションを作成