たかばし（高倉陸橋）の第一旭本店と新福菜館本店
つけ麺の高倉二条は横から見ると閉まってますが交差点から見ると開いてます（笑）
一乗寺の天天有と夢を語れが並んでるところ
たまに店の前で記念撮影をしている人がいる天下一品総本店（笑）

はじめて行く店もストリートビューで予習すれば、迷う確率はかなり減りますね（笑）

関連記事

• 京都ラーメン食ったマップを使って簡単Google Maps API
• パレード活動休止
• 京都ラーメンPlanet
• 京都ラーメン食ったマップ
• 運転免許の住所変更

→京都ラーメン食ったマップ
（サイドメニューのPagesにも出てます）

Googleマップ側からKML形式で出力されるデータを取り込んでるので、Googleマップのマイマップで情報を更新すると、こちらにも自動的に反映されるのがいい感じです。

JavaScriptの解説

覚えるのがイヤ〜ン、ドキュメント読むのがダル〜いGoogle Maps APIですが、これは６行のJavaScriptで動いてます。
これが６行なら、ちょっとやってみようって気になるでしょ？ならない？
興味のある人はview sourceしながら下の解説を見てください。

まずはマップの生成
var map = new GMap2(document.getElementById('kyoto_ramen_map'));
実質idを指定するだけです
（事前にdiv要素にIDを振って、style定義で幅と高さを与えておきましょう）

スクロールや拡大縮小のための小さなコントロールを追加します
map.addControl(new GSmallMapControl());

次に、扱いたいマイマップをGoogleマップで表示し、「このページへのリンク」をクリックして、URLを得ます
「京都ラーメン食ったマップ」の場合は
http://maps.google.com/maps/ms?ie=UTF8&hl=ja&msa=0&msid=112656633121951481930.0004349c12830d709f20a&ll=35.026974,135.781145&spn=0.049973,0.060768&z=14&om=1
となります
このURLの中にll=35.026623,135.749989というのがあり、これが表示されているマップの中心です

マップの中心と拡大率を指定します
map.setCenter(new GLatLng(35.026623,135.749989), 12);

さっきのURLに”&output=kml“という引数をつけると、マイマップデータをKML形式で得ることができます
var url = 'http://maps.google.com/maps/ms?msa=0&msid=112656633121951481930.0004349c12830d709f20a&ll=35.026623,135.749989&spn=0.099665,0.121708&z=13&om=1&output=kml';
（本来カットして良い引数があるはずですが、めんどくさいのでそのまま使ってます）

マイマップのKMLをロードして、マップに表示します
var geoxml = new GGeoXml(url);
map.addOverlay(geoxml);

WordPressでGoogle Maps APIを使うときの注意点

「投稿」じゃなくて「ページ」で作成
Google Maps APIのキーはURLに対して発行なので、通常の記事に使うと表示される場所によって動かなくなります（トップページからめくったり、月別やカテゴリ別アーカイブでURLのパスが変わる）。
今回は静的な「ページ」を作成し、ページスラッグを付けて、URLを固定しました。

TextControlプラグインでエスケープ回避
WordPressでは「投稿」にせよ「ページ」にせよ、改行をbrにされたり、クォートをエスケープされたりで、JavaScriptを本文中に書くことが難しいです。
TextControlというプラグインを使うと、記事やページごとにフォーマット形式を指定することができるようになり、本文をそのまま出力する「No Formatting」を指定することによりこの問題を回避することができます。

関連記事

• ストリートビューで京都ラーメンの聖地巡礼？
• パレード活動休止
• 京都ラーメンPlanet
• 京都ラーメン食ったマップ
• phpでGoogle Mapsをカンタンに使う - GoogleMapAPI

ベイエリアラーメンマップ
サンノゼ食いしん坊倶楽部編 - 日本の居酒屋マップ

こうしてみると、サンノゼ近辺ってのはやっぱりすごく充実してますよねぇ

関連記事

• 香風ラーメン
• 波浪/NAMINAMI - Mountain View
• Casanova - Cermelのレストラン
• この秋もミツワで大北海道展だっ！
• SUSE Linux@ThinkPad by Lenovo

サンプルを見ると

require(’GoogleMapAPI.class.php’);
$map = new GoogleMapAPI();
// setup database for geocode caching
$map->setDSN(’mysql://USER:PASS@localhost/GEOCODES’);
// enter YOUR Google Map Key
$map->setAPIKey(’YOURGOOGLEMAPKEY’);

と、コメント除いた４行で準備は完了。
requireとnewはいわずもがな。
setDSN()は、住所から座標への変換結果をキャッシュする機能のために、PEAR::DBのDSNを使用してデータベースを指定。
setAPIKey()はもちろんGoogleMapsのAPIキーを指定します。

地図にマーカーをうつには

// create some map markers
$map->addMarkerByAddress(’621 N 48th St # 6 Lincoln NE 68502′,’PJ Pizza’,'<b>PJ Pizza</b>’);
$map->addMarkerByAddress(’826 P St Lincoln NE 68502′,’Old Chicago’,'<b>Old Chicago</b>’);
$map->addMarkerByAddress(’3457 Holdrege St Lincoln NE 68502′,”Valentino’s”,”<b>Valentino’s</b>”);

と、メソッドaddMakerByAddress($address,$title,$html)でカンタンにマーカーを作成することができますな。
この住所から座標への変換にはYahooのgeocode APIを使っているそうです。
で、この住所から座標への変換結果を、さっき指定したデータベースにキャッシュしてくれるってわけです。
キャッシュ用のデータベースには

CREATE TABLE GEOCODES (
address varchar(255) NOT NULL default ”,
lon float default NULL,
lat float default NULL,
PRIMARY KEY (address)
);

ってな具合のテーブルを用意しておけとのこと。

HTML側では、
head内で$map->printHeaderJS();と$map->printMapJS();を出力
bodyのonload属性に”onLoad()”を指定
$map->printMap()で地図本体を表示
$map->printSidebar()でサイドバーとしてマーカー群のリンクを表示
となってます。

テンプレートシステムに対応するために、上記のメソッドのprintの部分がgetになった、文字列を返すメソッドも用意されていますね。
Smartyを使用した例もドキュメントに含まれてます。

JavaScriptをごちゃごちゃ書くのがめんどくさくて敬遠してた人が多い気がするGoogle Maps APIですが、これでphperへの敷居がぐぐっと低くなったんじゃないでしょうか？

関連記事

• PHPからGoogle Baseにポストする
• 京都ラーメン食ったマップを使って簡単Google Maps API
• Googleも間違えるhtml
• Google Analytics Status Update
• さらにGoogleのPersonalized Home