"G2Gmap"で超簡単にブログにGoogle Mapsを貼ってみる

そういえばこのブログはビジネス系の話を中心に書くつもりだったんだなあ、と思いつつ、また新しい作りモノ。
”G2Gmap”という名前で、ホントにもう、超簡単にブログやWeb Siteに地図（Google Maps）が貼れる。表示される地図は元のページにオーバーレイ表示されて、マウスでドラッグすることも可能。住所を元に地図を自動表示するから、昔書いたエントリに地図を追加するなんてことも容易に実現できる。

使い方は下記。

1. ブログのどこかに下記のスクリプトタグを埋め込む。テンプレートの中でも、エントリの中でもよい。
　　<script type="text/javascript" src="http://www.got2do.com/api/G2gmap.js" charset="utf-8"></script>
2. 地図を表示させたい住所部分の前後に、下記のようなタグを入れる。
　　<span class="G2gmap">1600 Amphitheatre Parkway, Mountain View, CA</span>

これだけで、ページ読み込み完了後に、上記2のspanタグで囲まれた部分に"Click To View Map"という表示が追加され、リンクが貼られる。リンクをクリックすると、その部分に地図が表示される仕組み。class指定を"G2gmap"にさえすれば、HTMLタグは別に何でもよい。

実際に設定してみるとこんな感じ。

- Google本社
　1600 Amphitheatre Parkway, Mountain View, CA
- エンパイアステートビル
　350 5th Ave, New York, NY
- 東京タワー
　東京都港区芝公園4-2-8

2年くらい前に「Google Mapsをブログに貼ってみる」（Google Maps->Blog）というネタをやったのだが、未だに「Google Map ブログ」で本ブログを訪れる方が結構いる。つまり、それくらい「ブログに地図」というニーズがある。然しながら、レイアウトを考慮するとブログに地図がイマイチ馴染まないのと、Google Mapsのコードを書かなくてもいいとはいえ、やっぱり手順が面倒だということで、「Google Maps->Blog」は自分でもほとんど使っていなかった。その一方、折角アメリカに住んでるんだから、使えるお店の紹介くらいはブログでしてみたいなという希望もあって、ものすごく久しぶりにGoogle Maps APIをいじって作ってみた（でもないや、MashUp Freak!のときにいじったな）。

そもそも、ブログで地図が必要な場合って、お店とかの場所を紹介するときなんだから、場所（住所）からリンクしとけばいいのである。だからと言って、手作業はやりたくないし、やったとしてもブログから地図サイトに飛んでしまうのは望ましくない。検索エンジンとかで探して辿りついてくれた読者は、お店の場所だけでなく、閉店時刻だとか、オススメのメニューだとか、そういう情報も一緒に手にしたいはずなのだ。でもって、そうした「生の声」を調べる為の情報源としては、草の根なブログしかなかったりするのである。特に、「アメリカのお店に関する日本語の情報」なんて、ロングテールの端っこの方だから、そうそう得られるものではない。

というわけで、次回より本ブログは「Bay Areaのお店紹介ブログ」としてリニューアル致します！

Powered by ScribeFire.