<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?libraries=geometry&sensor=true”></script>
これで Google Maps API javascript の読み込み
アプリがユーザ位置情報の取得にセンサーを使いたいので
sensor=true にしている
あと、
libraries パラメータを利用して ライブラリを読み込む
<body onload=”createMap()”>
<div id=”map” stype=”with:640px; height:480px; “></div>
これで
id=”map” の div を作って
body の onload イベントつまり読み込んだときの
イベントから
createmap()を読んで
map オブジェクトの初期化をする
そのときに呼び出す自作関数
ていうか、』世の中ではユーザ関数というらしい
function createMap(){
var position = new google.maps.LatLnt(35,135);
var options ={
zoom:15,
center: position,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById(‘map’), options);
var market = new googlemaps.market({
position:position,
map:map
});
}
地図を初期化するための各種プロパティを設定した
options を作成している
center には、地図の中心位置を設定するので
これは
var position で 35.135 を指定してあるので
これをそのまま使う
mapTypeId には地図のスタイルを設定する
たしか yahoo マップなら地下とかあった
普通の地図なら
ROADMAP にする
google.maps.Map() の引数には
描く場所、指定するオプション
だけど全部かくのは面倒なので
var options で変数宣言して格納するほうが楽
あと、描画する位置も div の id=”map” のところだから
map としている
次は、。マーカー
position はマーカーを表示する位置の指定
これは、すでに緯度経度の場所を指定しているから
そこにマーカーを出したいのでそのまま
position:position
でOK
map には、マーカーを表示する地図を指定する
すでに
var map で変数宣言して、この中にいろいろ設定しているから
map:map
でOK
つまり、マーカーを描きたいなら
var market=new google.maps.Market({
position: マーカーの位置,
map: 表示する地図を指定
});
というようになる