2017년 9월 16일 토요일

구글맵(Google Map) 사용요령

자신의 web-page에서 구글맵(Google Map)을 사용하기 위해서는 먼저
https://developers.google.com/maps/documentation/javascript/get-api-key
를 방문하여 자신의 "API key"를 얻어야 합니다.
이 web-page에서 "Get a Key "라는 button을 누르면 됩니다.

Source

<div id="googleMap" style="width:100%;height:400px;"><div>

<script>
function myMap() {
  var mapProp= {
    center:new google.maps.LatLng(38,128),
    // 위에서 위도:38, 경도: 128>
    zoom:5,
    // zoom의 숫자 5는 클수록 지도가 커진다.
};
var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
// 지도가 들어갈 div의 id="googleMap",
// 그리고 위에서 만든 함수 mapProp
}
</script>

<script>
src="https://maps.googleapis.com/maps/api/js?key=자신의 key &callback=myMap
</script>
// 자신의 key는 다음 web-page에서 얻는다
// https://developers.google.com/maps/documentation/javascript/get-api-key
// 마지막으로 callback함수로 위에서 만든 myMap를 대입!!!

Result


댓글 없음:

댓글 쓰기