<img alt="Google MapとFlicker画像検索のマッシュアップを自分でやってみる" src="http://web-marketing.zako.org/images/ScreenShot046.gif" width="460" height="364" />
<p>サンプルがあったので、ちょいと拝借してマッシュアップをしてみました。<br />
画像の数は多くないけど、それなりにおもしろい？</p>

<!--more-->
<h2>Google MapでFlicker画像検索</h2>
<iframe height="550" width="527" src="http://www.zako.org/maps/fricker.html" scrolling="NO" frameborder="0"></iframe>
<p><a href="http://www.zako.org/maps/fricker.html" target="_blank">全画面表示</a></p>
<p>サンプルの東京タワーでの検索結果、いろいろな場所からの東京タワーのショットを見ることができる。FlickerとGoogle Mapが融合すると、こういった楽しみ方ができるんですね。</p>
<p>プログラムなどほとんどわからなくても設置は可能。かくいう私もまるでわかってない(；・∀・)</p>
<h3>Google MapとFlickerのなんちゃってマッシュアップ手順</h3>
<blockquote><p>１．まず、<a href="http://code.google.com/apis/ajaxfeeds/" target="_blank">AJAX Feed API</a>のKeyを取得、⇒<a href="http://code.google.com/apis/ajaxfeeds/signup.html" target="_blank">Key取得ページ</a></p>
<p>２．次に<a href="https://developers.google.com/maps/?hl=ja" target="_blank">Google Maps API</a>のKeyを取得、⇒<a href="http://www.google.com/apis/maps/signup.html" target="_blank">Key取得ページ</a></p>
<p>３．サンプルファイルを右クリックで保存⇒<a href="http://www.zako.org/maps/fricker.txt">Frickr検索サンプルファイル</a>テキストファイルになっています。</p>
<p>４．<a href="http://www.vector.co.jp/soft/win95/writing/se086280.html" target="_blank">秀丸エディタ</a>など、文字コード変更可能なテキストエディタでファイルを開く</p>
<p>５．6行目の「ここにGoogle Maps APIのKey」に、取得したGoogle Maps APIのKeyを入力</p>
<p>６．7行目の「ここにAJAX Feed APIのKey」に、取得したAJAX Feed APIのKeyを入力</p>
<p>７．エンコードを「UTF-8」に変更し、ファイル形式を「html」にして保存</p>
<p>８．サーバーにアップロードすれば完了です。</p></blockquote>
<p>なんだかちょっとできちゃった感があっていいかも(；・∀・)<br />
自己満に過ぎませんが。。。あぁ勘違い(´Д⊂ｸﾞｽﾝ</p>
<!--- ignore ---><div style="margin-bottom:0px;"><div style="float:left;"><a href="http://www.amazon.co.jp/gp/redirect.html%3FASIN=4797332875%26tag=snowboadteamz-22%26lcode=xm2%26cID=2025%26ccmID=165953%26location=/o/ASIN/4797332875%253FSubscriptionId=028QVM5GAF1MWA4NBMR2" target="_blank"><img src="http://g-ecx.images-amazon.com/images/G/09/nav2/dp/no-image-avail-img-map._V23175435_AA120_.gif" alt="Googleマップ+Ajaxで自分の地図をつくる本  Google Maps API徹底活用" style="border:0;"></a></div><div style="float:left;margin-left:15px;line-height:120%"><div style="margin-bottom:10px;line-height:120%"><form style="margin-bottom:0px;" method="post" action="http://www.amazon.co.jp/gp/aws/cart/add.html" target="_blank"><input type="hidden" name="AssociateTag" value="snowboadteamz-22"><input type="hidden" name="SubscriptionId" value="028QVM5GAF1MWA4NBMR2"><input type="hidden" name="ASIN.1" value="4797332875"><input type="hidden" name="Quantity.1" value="1"><input type="image" name="submit.add-to-cart" src="http://rcm-images.amazon.com/images/G/09/extranet/associates/buttons/remote-buy-jp5.gif" /></form></div><div>Googleマップ+Ajaxで自分の地図をつくる本  Google Maps API徹底活用<br /></div><div style="margin-top:0px; margin-bottom:10px"><div style="margin-bottom:5px">価格：<span style="color:#f33;font-weight:bold;">￥ 2,079</span><br />平均評価：3.5<br />納期：通常24時間以内に発送<br /></div></div><div style="margin-top: 5px"><a href="http://www.amazon.co.jp/gp/redirect.html%3FASIN=4797332875%26tag=snowboadteamz-22%26lcode=xm2%26cID=2025%26ccmID=165953%26location=/o/ASIN/4797332875%253FSubscriptionId=028QVM5GAF1MWA4NBMR2" target="_blank">Amazon で詳細を見る</a> by <a href="http://web-marketing.zako.org/" title="WEBマーケティング ブログ" target="_blank">WEBマーケティング ブログ</a></div></div><div style="clear: left"></div></div>