JavaScriptでは、bodyタグにonloadを使って関数をコールする方法が、一般的ですが、これを使わずに、load時に地図を表示する方法について書きたいと思います。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true">
</script>
<script type="text/javascript">
function initialize(){
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8
, center: latlng
, mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map_03 = new google.maps.Map(
document.getElementById("map_canvas_03")
, myOptions
);
}
google.maps.event.addDomListener(
window
, 'load'
, initialize
);
</script>
</head>
<body>
<div id="map_canvas_03" style="width:400px; height:500px;"></div>
</body>
</html> |
たぶん、V2にもあったのかもしれませんが、Google Map APIに標準装備されているaddDomListenerメソッドを使えば、ブラウザを意識せずに、イベント処理を走らせることができるみたいです。
今回は、onloadの処理なので、
google.maps.event.addDomListener(
window
, 'load'
, 関数名
);
と設定すればオッケーです。
他にも、onclickに相当するclickや、Google Mapオリジナルのzoom_changedなども追加できるようです。
この部分についてももっと調査する必要がありそうですね。
0 コメント:
コメントを投稿