「Google マップ」でも使われている「Ajax」に興味があり、書籍『入門 Ajax』を買いました。この本で、「Google Maps API」を利用して「Google Maps」を自分のページに設置できる事を知りました。早速、自分のサイトにサンプルページをアップしてみました。いろいろ面白い事ができそうです。
ページの作成手順は、以下の通りです。
（１）「Google Maps API」のページから、「Sign up for a Google Maps API key」のリンクをクリックします。
（２）「Sign up for a Google Maps API key」のページで、「I have read and agree with the API terms and conditions」のチェックボックスをチェックし、 「My Web Site URL:」に地図ページを置く自分のサイトのURLを記入し、「Generate API Key」をクリックします。
なお、サイトのURLは、私の場合は、「http://nakamura-hiroshi.com/blog/」を設定しました。
（３）「Google Maps API key」と、サンプルコードが表示されます。サンプルコードをそのままコピーしてHTMLファイルとすれば、完成です。但し、そのままではIE6.0ではエラーになり表示できませんでした。これは、文字コードの設定に関係している様で、ブラウザの表示設定で、エンコードを「UTF-8」とすると、正常に表示できました。Firefoxでは問題無く表示できました。
（４）上記の文字コードの問題を避けるために、HTMLファイルに以下の「meta」タグを挿入し、文字コードとして「UTF-8」を指定する様にしました。
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
（５）地図のデフォルトは、「Palo Alto」が表示される様になっていますが、前記書籍のサポートサイトにある「経度・緯度を調べる（地図作成作業補助サンプル）」を利用すると、自分で表示したい地図の経度・緯度データが判るので、そのデータでサンプルコードの値を置き換えます。私は、東京タワーを中心に表示する様にしてみました。
map.centerAndZoom(new GPoint(139.74538564682007, 35.658595126386274), 4);
