GoogleMapsを設置方法
Posted on September 20th, 2008 [ Last update date September 21st, 2008 at 5:47 pm ]
ページに地図を貼付けるにはGoogla AccountとGoogle Maps API Keyが必要になります、API Keyはhttp://code.google.com/intl/ja/apis/maps/index.htmlのページから設置するサイトのULRを入力し取得できます。
API Key取得後にXHTMLのサンプルが表示されます、これが心強い味方になりますが WordPressをカスタマイズしサイトを構築しているため地図を表示しないページの事も考慮しサンプルのようには記述していません。
取得したAPI KeyでMaps APIをインクルード
<script src="http://maps.google.com/maps?file=api&v=2&key=あなたの取得したAPI Key" type="text/javascript"></script>
マップを表示する場所の指定します、空のDiv要素を作りid属性とスタイル属性あたえIDと幅と高さを指定します。
<div id="gmap" style="width: 800px; height: 400px"></div>
関数を実行し先ほど記述した空のDiv要素にマップを表示させ、マップの中心位置とズームレベル指定します。
<script type="text/javascript">
//<![CDATA[
window.onload=loadMap();
function loadMap(){
var map = new GMap2(document.getElementById("gmap"));
map.setCenter(new GLatLng(43.061081, 141.356363), 15);
}
window.onunload = GUnload;
//]]>
</script>
ウインドウがロードされたときにマップを表示する関数を実行し、アンロードされたときのメモリリークを防ぐために、GUnload()を実行します。
