구글맵

예상했던 것보다 훨씬 똑똑하다.
거기다 무료로 이용할 수 있으니 구글제품을 안 쓸래야 안 쓸 수가 없다.

<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<%
session.CodePage=65001
response.CharSet="utf-8"
%>
<!-- 구글맵 관련 스크립트 -->
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://maps.google.com/maps?file=api&v=2.x&key=사이트키값&language=ja" type="text/javascript"></script>
<script type="text/javascript" >
var xmlHttp;
var map = null;
var geocoder = null;
var marker = null;

//지도 초기화
function gMapInit() {
 if (GBrowserIsCompatible())
 {
  var point = new GLatLng('37.5091548', '127.1173515');
  map = new GMap2(document.getElementById("gMapCanvas"));
  map.addControl(new GSmallMapControl());
  map.addControl(new GMapTypeControl());
  map.addControl(new GScaleControl()); // add
  map.setCenter(point, 15);

  //초기화 좌표 위치에 마커설정
  marker = new GMarker(point);
  map.addOverlay(marker);
  document.getElementById('gMapLatitude').value = point.y;
  document.getElementById('gMapLongitude').value =point.x; 

  //지도상의 클릭 좌표에 마커설정
  //GEvent.addListener(map, "click", getAddGeocoder);
  geocoder = new GClientGeocoder();
 }
}

function getAddGeocoder(overlay, latlng) {
      if (latlng != null) {
        address = latlng;
        geocoder.getLocations(latlng, showAddress);
     }    
}

function searchGeocoderByAddMap(){
 var objForm = document.objForm;
 var addrVal = objForm.addrProvince.value + ' ' +  objForm.addrDistrict.value + ' ' + objForm.addrTown.value + ' ' +  objForm.addrHouseno.value ;

 /*
 if(objForm.addrProvince.value == ""){  
  alert("addrProvince 넣어 주세요.");
  return;
 }
 if(objForm.addrDistrict.value == ""){  
  alert("addrDistrict 넣어 주세요.");
  return;
 }

 if(objForm.addrTown.value == ""){  
  alert("addrTown 넣어 주세요.");
  return;
 }
 if(objForm.addrHouseno.value == ""){  
  alert("addrHouseno 넣어 주세요.");
  return;
 }
 */

 if (geocoder) {
  geocoder.getLatLng(addrVal, function(point) {
   if (!point) {
    alert(addrVal + " not found");
   } else {
    map.clearOverlays();
    map.setCenter(point, 15);
     marker = new GMarker(point);
     map.addOverlay(marker);
     document.getElementById('gMapLatitude').value = point.y;
     document.getElementById('gMapLongitude').value =point.x; 
   }
  }
  );
 }
}

function showAddress(response) {
    map.clearOverlays();
    document.getElementById('addrProvince').value = "";
    document.getElementById('addrDistrict').value = "";
    document.getElementById('addrTown').value = "";
   
    if (!response || response.Status.code != 200) {
      alert("Status Code:" + response.Status.code);
    } else {
      place = response.Placemark[0];
      point = new GLatLng(place.Point.coordinates[1],
                          place.Point.coordinates[0]);
      marker = new GMarker(point);
      map.addOverlay(marker);
  document.getElementById('gMapLatitude').value = place.Point.coordinates[1];
  document.getElementById('gMapLongitude').value =place.Point.coordinates[0];
  var a = place.address.split(" ");
  var addrBasic ="";
  
  for(var i=1;i<a.length;i++){   
   if(i==1){
    document.getElementById('addrProvince').value  =  a[i];
    addrBasic += a[i] + " ";
   }
   else if(i==2){
    document.getElementById('addrDistrict').value  =  a[i];
    addrBasic += a[i] + " ";
   }
   else if(i==3){
    document.getElementById('addrTown').value  =  a[i];
    addrBasic += a[i] + " ";
   }
   else if(i==4 && a.length != 5){
    document.getElementById('addrHouseno').value  =  a[i];
    addrBasic += a[i];
   }    
   else if(i ==(a.length-1)){
    document.getElementById('addrHouseno').value  =  a[i];    
   }
   else{}
  }
    }
}
</script>
<script language='javascript' for="window" event="onload">
gMapInit();  //로드시 맵초기화
//searchGeocoderByAddMap();  //로드시 기본좌표로 검색
</script>
<!-- /구글맵 관련 스크립트 -->
<form id="objForm" name="objForm" method="post">
<div><span>&nbsp;* gCode 확인 * </span></div>
<div>
1. 지도를 클릭한다.<br>
2. 각 필드에 데이터를 넣고 '검색'을 클릭한다.<br>
 <table id="table" width="450" border="1" cellspacing="0" cellpadding="0"  bordercolor="#dee2e7" > 
  <tr>
   <td>시 / 도</td>
   <td><input name="addrProvince" id="addrProvince" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15" /></td>
  </tr>
  <tr>
   <td>구 / 군</td>
   <td><input name="addrDistrict" id="addrDistrict" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15" /></td>
  </tr>
  <tr>
   <td>동(읍/면/리)</td>
   <td><input name="addrTown" id="addrTown" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15" /></td>
  </tr>
  <tr>
   <td>기타주소</td>
   <td>
    <input name="addrHouseno" id="addrHouseno" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15"  />
    <a href="javascript:searchGeocoderByAddMap();">검색</a>
   </td>
  </tr>
  <tr>
   <td colspan='2'>&nbsp;</td>
  </tr>
  <tr>
   <td>Longitude</td>
   <td><input name="gMapLongitude" id="gMapLongitude" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15"  value="127.1173515"/></td>
  </tr>
  <tr>
   <td>Latitude</td>
   <td><input name="gMapLatitude" id="gMapLatitude" style="width:300px;" type="text" size="11" maxlength="200" maxbyte_utf8="15" value="37.5091548" /></td>
  </tr>     
 </table>
</div>
<div width="100%">
 <table id="" width="100%" border="0" cellspacing="0" cellpadding="0" background bgcolor="">
  <tr><td width="50%">
   <div id="gMapCanvas" style="width: 500px; height: 400px"></div>
  </td></tr>
 </table>
</div>
</form>