첫예제가 너무 쉽지 않았나...
그래서 너무 뽀대가 나질 않는다... 줌인,아웃도 않되고... 그냥... 지도다.
구글맵은 역시 줌인,아웃도 되야하고, 일반,위성,하이브리드 지도도 선택해서 볼수 있어야 하지 않겠는가...
.... 해보자.
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAEMxD5KuM40jmb4GJnPTkJRS7xOUxO1Ufu-uozDqsHa5hmERu-xQqyZ1M1nyRpJvaLV__GNN29EB0hQ"
type="text/javascript"></script>
<script type="text/javascript">
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>
http://home.megapass.net/~l5027309/addcontrol.html
이건 링크고, 아래는 실행화면...
역시 소스를 뜯어보자
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAEMxD5KuM40jmb4GJnPTkJRS7xOUxO1Ufu-uozDqsHa5hmERu-xQqyZ1M1nyRpJvaLV__GNN29EB0hQ"
type="text/javascript"></script>
<script type="text/javascript">
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
소스가 너무 간단하지 않은가... 여기까지는 전예제와 동일하다. 설명생략.
map.addControl(new GSmallMapControl());
. 이넘은 만든 map 이란 넘한테서 컨트롤을 추가시키는 함수로
addControl(control,position?)으로 나타낸다. position이 없으면, control 위치가 position으로 지정된다.
GSmallMapControl()이넘은 네방향으로 움직이는 컨트롤과, 줌인,아웃 컨트롤을 만든다.
map.addControl(new GMapTypeControl());
. GMapTypeControl() 이 넘은 맵 타입을 지정하는 컨트롤을 만들수 있다. 맵상에는 Map, Satellite, Hybrid로 나타난다.
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>
. 이번 소스도 간단하게 뜯어보았다. 어떤가 너무 쉽지않은가?? ㅋㅋ