Tagchan Homepage

MovaTwitterで，エントリの末尾に「L:住所」を付けた場合，Google MapsのGeocoorderを使って， 緯度経度に変換し，Google Mapsにプロットします。ブログパーツなので， 自分のサイトに貼り付け可能です。最新のTwitterのエントリーのみが表示可能です。 また，MovaTwitterで写真をアップした場合，地図の下に写真も表示することが可能です。

このブログパーツを使うためには，Twitterに登録する必要があります。 そして，ユーザIDとアイコンの画像のURLを控えておきましょう。 登録したTwitterのアイコンがGoogle Mapsにプロットされます。 もちろん，Google MapsのAPI Keyも取得しておいてください。

TwitterのユーザID，アイコン画像のURL，Google Maps APIキーを入力し， Generateボタンをクリックすると，貼り付けるために必要なコードが生成されます。 これをお好きな場所に貼り付けてください。

Google Maps API key
Twitter User ID
Twitter Icon Image URL

うまく作成できない場合は以下のコードをご利用ください。 3行目から5行目と10行目に書き換える箇所があります。

<script type="text/javascript">
window.onload = function(){getJSON()};
var api_key = "Google Maps API Key";
var usrid = "Twitter Uer ID";
var icon_image = "Twitter Icon Image URL";
</script><script src="http://maps.google.com/maps?file=api&v=2.x&key=aa" type="text/javascript"></script>
<script type="text/javascript" src="http://www.tagchan.net/twitter_gmap.js"></script>
<div style="background-color:azure;border-style:solid;border-color:#125ebc;border-width:1px;font-size:11px;width:170px;padding:5px;">
<div id="twitter_div"><div style="text-align:center;line-height:15px;color:#125ebc;font-weight:bold;">
<a href="http://twitter.com/"Twitter Uer ID"" style="font-size:11px;color:#125ebc;font-weight:bold;">Twitter</a> with GoogleMaps</div>
<span id="my_twitter_widget_status" style="font-size:11px;"></span><span id="basho"></span></div>
<div id="map" style="width:170px; height:250px; margin:0px"></div>
<span id="my_twitter_photo"></span>Powered by MovaTwitter</div>

こちらにサンプルがあります。