..
　■Home−jQuery、Ajax、各種API　関連−GoogleMapAPI−GoogleMapを設置する
+1JavaScript　無料のフリースクリプト集...
◇GoogleMapを設置する
　ホームページにGoogleMapを設置します。

↑ドラッグで動きます

1.Googleのアカウントを取得
　ＧｏｏｇｌｅＭａｐを設置するには、Ｇｏｏｇｌｅのアカウントを取得する必要があります。（既に取得している方は2へ）
　Ｇｍａｉｌ等も使えるようになって便利です。
　　　https://www.google.com/accounts/ManageAccount

2.GoogleマップAPIキーを取得
　さらに、コードの中で使用するＧｏｏｇｌｅマップＡＰＩキーを取得します。
　キーとは英数字の羅列で、例えば以下のような感じのものです。
　　　（ex.「ABQIAAAAMhOXEGQg6DJU7K_5z03RHBRStbE4dmH2wGls7TJriSz13EN5GhRlufSx0mhO_2oco43B6BRqY3o01A」）
　１つのキーでウェブサーバー上の１つのディレクトリが有効となります。
　つまり、http://plusone.jpn.org/で取得した場合、このディレクトリ以下のＵＲＬ全てで使用可能です。
　その他、制限等はＧｏｏｇｌｅマップＡＰＩの利用規約をご参照下さい。
　　　http://code.google.com/intl/ja/apis/maps/

3.ＨＥＡＤタグ間に以下のコードを記入します
　<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=『ＡＰＩキー』" type="text/javascript" charset="utf-8"></script>
　<script type="text/javascript">
　//<![CDATA[
　　　function load() {
　　　　　if (GBrowserIsCompatible()) {
　　　　　　　var map = new GMap2(document.getElementById("map"));
　　　　　　　map.setCenter(new GLatLng(『緯度』,『経度』),『ズーム率：０〜１７』);
　　　　　}
　　　}
　//]]>
　</script>
 　・『ＡＰＩキー』の部分は取得したキーをベタ打ち。「”」や「’」等は不用です。
　・『緯度』『経度』『ズーム率』は数値を記入。ズーム率は１７が最大にズームした状態になります。

4.ＢＯＤＹタグは以下のように記入します
　<body onload="load()" onunload="GUnload()">
5.表示したい場所に以下を記入します
　<div id="map" style="width: 〜px; height: 〜px"></div>
 　・ｗｉｄｔｈ（幅）とｈｅｉｇｈｔ（高さ）について「〜」に数値を記入します。
【サンプルを実行する：mpasample.html】

<html>
　<head>
　　<title>Google Maps JavaScript API Example</title>
　　<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;
key=ABQIAAAAMhOXEGQg9DJU7K_4z03RHBRStbE3dmH1wGls7TJriSz17EN5GhRlufSx2mhO_7oco33B6BRqY2o02A" type="text/javascript" charset="utf-8"></script>
　　<script type="text/javascript">
　　//<![CDATA[
　　function load() {
　　　if (GBrowserIsCompatible()) {
　　　　var map = new GMap2(document.getElementById("map"));
　　　　map.setCenter(new GLatLng(35.6587, 139.7454), 17);
　　　}
　　}
　　//]]>
　　</script>
　</head>
　<body onload="load()" onunload="GUnload()">
　　<div id="map" style="width: 500px; height: 300px"></div>
　</body>
</html>

※注意：ＡＰＩキーは各自で取得して下さい

..

..