@blog.justoneplanet.info

■APIデビューと共に皆とやり方を共有！

1. Google Maps APIのサイトに行く
2. 自分のサイトのURLを入力しAPIキーをゲット！
3. Googleのアカウントを持ってなかったら作ってね。
4. APIキーとサンプルHTMLが表示される。
5. とりあえずコピー＆ペーストしてHTMLを作ってアップしてみる。
6. キーはチャント保存してね。

■下記がサンプル

どうでしょう？基本的なブラウザだったら表示できてるはず！

■サンプルソースコード

<script src="http://maps.google.com/maps?file=api&v=2&key=((your key!))" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load(){
    if(GBrowserIsCompatible()){
        var map = new GMap2(document.getElementById("map20070719"));
        map.setCenter(new GLatLng(35.633477,139.765449),14);
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
    }
}
load();
//]]>
</script>

■簡単な解説

• if(GBrowserIsCompatible())でGoogleMapが使えるブラウザの絞ってます
• elseを使えば使えない人用の表示をする事も出来るらしい
• map.setCenter(new GLatLng(35.633477,139.765449),14)で初期表示の座標を設定
• map.addControl(new GLargeMapControl())で左側のマップコントロールを表示
• map.addControl(new GMapTypeControl())で右上の地図のタイプコントロールを表示

■補足

• 便宜、仕様上ソースを多少変更しております
• 上記ソースは全要素が読み込まれた後（</body>と</html>）の間に貼り付けてみて下さい。
• head内に記述する場合はbodyにonload=”load();”と記述し、スクリプト内のload();は消してください。
• 上記ソースに関数GUnloadをonunloadで実行するようにしてください