2011년 9월 9일 금요일
홈페이지에 다음지도 달기
http://dna.daum.net/apis/maps/v3
https://apis.daum.net/register/myapi.daum
<!DOCTYPE html>
<html>
<head>
<title>Hello, World!</title>
<meta name="viewport" content="initial-scale=1.0,user-scalable=no">
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map { width: 100%; height: 100% }
</style>
<script type="text/javascript" src="http://apis.daum.net/maps/maps3.js?apikey=다음 API서버에서 받은 인증키" charset="utf-8"></script>
<script type="text/javascript">
window.onload = function() {
var position = new daum.maps.LatLng(사용자 위도값, 사용자 경도값);
var map = new daum.maps.Map(document.getElementById('map'), {
center: position,
level: 4,
mapTypeId: daum.maps.MapTypeId.ROADMAP
});
/*기본마커*/
var marker = new daum.maps.Marker({
position: position
});
marker.setMap(map);
var zoomControl = new daum.maps.ZoomControl();
map.addControl(zoomControl, daum.maps.ControlPosition.RIGHT);
var mapTypeControl = new daum.maps.MapTypeControl();
map.addControl(mapTypeControl, daum.maps.ControlPosition.TOPRIGHT);
/*인포윈도우*/
var infowindow = new daum.maps.InfoWindow({
content: '<p style="margin:7px 12px;font-size:12px">인포윈도우만 띄울 수도 있습니다.</p>'
});
daum.maps.event.addListener(marker, "click", function() {
infowindow.open(map, marker);
});
daum.maps.event.addListener(map, "click", function() {
infowindow.close();
});
};
</script>
</head>
<body>
<div id="map" style="width:600px;height:600px;"></div>
</body>
</html>
피드 구독하기:
댓글 (Atom)
댓글 없음:
댓글 쓰기