2007. 8. 17. 21:05
국가 및 종족 위치도를 구글맵 API를 이용하여 만들어보자.
1.구글맵 API의 Key 구하기
1)http://www.google.com/apis/maps/ 에서 “Sign up for a Google Maps API key”클릭
2)삽입할 URL 입력 ( 예: http://fttkorea.net )
3)세가지 정보 제공 : API 키, 사용해도 좋을 URL , 예제 HTML코드 (단.해당도메인 에서만 사용 가능)
2.예제 코드 수정하기
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://maps.google.com/maps?file=api&v=1&key=[API키]” type=”text/javascript”></script>
</head>
<body>
<div id=”map” style=”width: [가로픽셀수]px; height: [세로픽셀수]px”></div>
<script type=”text/javascript”>
//<![CDATA[
var map = new GMap2(document.getElementById("map"));map.setCenter(new GLatLng([가로위치좌표], [세로위치좌표]), [해상도]);
//]]
</SCRIPT>
</BODY>
</HTML>
3.원하는 지역 좌표값 얻기
1)API Key값을 넣는다.
2)가로픽셀수 : 480px, 세로픽셀수 : 300px 를 예제코드에 넣는다.
3)http://maps.google.com 에서 원하는 지역 더블클릭후 “Link to this page”클릭 하면 ll=좌표값 (세로위치좌표, 가로좌표위치)(해상도)를 예제코드에 넣는다.
*해상도는 숫자가 클수록 상세한 지도가 표시된다.
4.수정한 예제코드를 웹페이지에 넣기
1)웹에디터(나모)를 이용하여 적당한 위치에 수정한 예제코드를 삽입한다.
2)완성된 파일을 서버에 올린후 확인한다.
1.구글맵 API의 Key 구하기
1)http://www.google.com/apis/maps/ 에서 “Sign up for a Google Maps API key”클릭
2)삽입할 URL 입력 ( 예: http://fttkorea.net )
3)세가지 정보 제공 : API 키, 사용해도 좋을 URL , 예제 HTML코드 (단.해당도메인 에서만 사용 가능)
2.예제 코드 수정하기
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://maps.google.com/maps?file=api&v=1&key=[API키]” type=”text/javascript”></script>
</head>
<body>
<div id=”map” style=”width: [가로픽셀수]px; height: [세로픽셀수]px”></div>
<script type=”text/javascript”>
//<![CDATA[
var map = new GMap2(document.getElementById("map"));map.setCenter(new GLatLng([가로위치좌표], [세로위치좌표]), [해상도]);
//]]
</SCRIPT>
</BODY>
</HTML>
3.원하는 지역 좌표값 얻기
1)API Key값을 넣는다.
2)가로픽셀수 : 480px, 세로픽셀수 : 300px 를 예제코드에 넣는다.
3)http://maps.google.com 에서 원하는 지역 더블클릭후 “Link to this page”클릭 하면 ll=좌표값 (세로위치좌표, 가로좌표위치)(해상도)를 예제코드에 넣는다.
*해상도는 숫자가 클수록 상세한 지도가 표시된다.
4.수정한 예제코드를 웹페이지에 넣기
1)웹에디터(나모)를 이용하여 적당한 위치에 수정한 예제코드를 삽입한다.
2)완성된 파일을 서버에 올린후 확인한다.