<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<script src="http://maps.google.com/maps?file=api
&v=2&key=(ここにkeyを入力)"
type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="gsample.js"
charset=utf-8"></script>
<title>Google Maps Event Test Page</title>
</head>
<body>
<div id="mymap" style="width: 500px; height: 400px"></div>
</body>
</html>
function startUp(){
var map= new GMap2(document.getElementById("mymap"));
map.setCenter( new GLatLng(35.70749253887843,
139.71373558044434), 13 );
GEvent.addListener(map, "click", showMessage);
}
function showMessage(){
alert("ここですか?");
}
onload = startUp;
onunload = GUnload;
GEvent.addListener(map, "click", showMessage);
function showMessage(ov, point){
alert("ここですか? 座標は,"+ point);
}
イベント名 | 引数 | 発生条件 |
"click" | (overlay, latlng) | 地図がクリックされたとき |
"mouseover" | (latlng) | 地図上にマウスポインタが入ったとき |
"mouseout" | (latlng) | 地図上からマウスポインタが出たとき |
"mousemove" | (latlng) | 地図上をマウスポインタが動いているとき |
"zoomend" | (oldLevel, newLevel) | 地図の縮尺変更終了時 |
"movestart" | () | 地図のドラッグ移動が開始されたとき |
"move" | () | 地図のドラッグ移動中 |
"moveend" | () | 地図のドラッグ移動終了時 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<script src="http://maps.google.com/maps?file=api
&v=2&key=(ここにkeyを入力)"
type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="gsample3.js"
charset=utf-8"></script>
<title>Google Maps Event Test Page</title>
</head>
<body>
<div id="mymap" style="width: 500px; height: 400px"></div>
</body>
</html>
var map;
function startUp(){
map= new GMap2(document.getElementById("mymap"));
map.setCenter( new GLatLng(35.70749253887843,
139.71373558044434), 13 );
GEvent.addListener(map, "click", switchMode);
}
function switchMode(){
if ( map.getCurrentMapType() == G_NORMAL_MAP )
map.setMapType( G_SATELLITE_MAP );
else if ( map.getCurrentMapType() == G_SATELLITE_MAP )
map.setMapType( G_NORMAL_MAP );
}
onload = startUp;
onunload = GUnload;
モード | 状態 |
G_NORMAL_MAP | 普通の地図モード |
G_SATELLITE_MAP | 衛星写真モード |
var map;
function startUp(){
map= new GMap2(document.getElementById("mymap"));
map.setCenter( new GLatLng(35.70749253887843 , 139.71373558044434), 13 );
map.addControl(new GLargeMapControl());
map.addControl(new GScaleControl());
map.addControl(new GMapTypeControl());
map.addControl(new GOverviewMapControl());
}
onload = startUp;
onunload = GUnload;
コントロール名 | 機能 |
GSmallZoomControl | 拡大ボタンと縮小ボタンを追加 |
GSmallMapControl | 拡大ボタンと縮小ボタンに加え,上下左右移動ボタンを追加 |
GLargeMapControl | 拡大縮小ボタンとスライダー,上下左右移動ボタンを追加 |
GMapTypeControl | 地図モードと衛星写真モードの切り替えボタンを追加 |
GScaleControl | 縮尺を表す画像を追加 |
GOverviewMapControl | 周辺地図画像を追加 |