google map api 주소로 GPS 검출

주소만 가지고 GPS좌표를 검출하는 로직

요즘 지도 서비스를 개발 중입니다.

그냥 업체 정보에 지도만 나오는게 아니고 지도가 제대로 클릭되면 이동하도록 빠른 지도 서비스를 위해 개발 중인데 그중 일부 소스를 공유하고자 리뷰 합니다.

---

지도를 먼저 열어야 합니다.

var map;

var myLatLng=[];

var markers=[];

 var myLatLng = {lat: -25.363, lng: 131.044};

 var map = new google.maps.Map(document.getElementById('map'), {

    zoom: 2,

    center: myLatLng

  });

var geocoder = new google.maps.Geocoder();

var options = {

  enableHighAccuracy: true,

  timeout: 5000,

  maximumAge: 0

};

이렇게 하면 지도가 열릴겁니다.

---

그리고 일반적으로 GPS를 추출해서 저장했다가 나타내지만 그렇지 못하는 상황일 경우 주소만 가지고 gps좌표를 찍어야 합니다.

아래 함수를 이용하시면 map으로 잡혀 있는 지도 맵에 주소를 가지고 찍히게 됩니다.

function geocodeAddress(address,company) {

  var address = address;

  var resultsMap=map;

  var company=company;

   for (var i = 0; i < markers.length; i++) {

    markers[i].setMap(null);

  }       

  geocoder.geocode({'address': address}, function(results, status) {

    if (status === google.maps.GeocoderStatus.OK) {

      resultsMap.setCenter(results[0].geometry.location);

      var marker = new google.maps.Marker({

        map: map,

        position: results[0].geometry.location

      });

       var contentString = '<div id="content">'+company+'</div>';

          var infowindow = new google.maps.InfoWindow({

         content: contentString

        });

            map.setZoom(11);

 infowindow.open(map, marker);

      markers.push(marker);

    } else {

      alert('Geocode was not successful for the following reason: ' + status);

    }

  });

}

---

html 에서는 

onclick="geocodeAddress('<?=$data[address]?>','<?=$data[company]?>')"

이렇게 처리 해 주시면 됩니다.

gocodeAddress('주소','업체명');

먼저 지도는 새로고침이 없이 동작해야 되고 클릭하시면 이동하면서 zoom(11) 정도로 보이게 하는 작업입니다.