다음 지도 api 주소을 좌표 구하고 여러개 마커 제어하기 > 그누보드5 팁자료실

그누보드5 팁자료실

다음 지도 api 주소을 좌표 구하고 여러개 마커 제어하기 정보

다음 지도 api 주소을 좌표 구하고 여러개 마커 제어하기

본문

1890416218_1578286212.5314.png

 

php Curl 

 


$address = "세종특별자치시 한누리대로 2130";
$url = "https://dapi.kakao.com/v2/local/search/address.json?query=".urlencode($address);

$ch=curl_init();
curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_URL, $url); // url 연결
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, 
            array("Accept: application/json", "Content-Type: application/json", 
                  "Authorization: KakaoAK {API REST 키}"));
curl_setopt($ch, CURLOPT_VERBOSE, true);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);

$response = curl_exec($ch);
$result = (array) json_decode($response); 
 
//좌표구하기
if($result["documents"][0]->road_address->x){
    $lat = $result["documents"][0]->road_address->y;
    $lng = $result["documents"][0]->road_address->x;
}else{
    $lat = $result["documents"][0]->address->y;
    $lng = $result["documents"][0]->address->x;
}
curl_close($ch); // 종료

 

Html

 


<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey={자바스트립트 API 키}"></script>
<script>
var mapContainer = document.getElementById('map'), // 지도를 표시할 div  
    mapOption = { 
        center: new kakao.maps.LatLng(36.48005808069782, 127.28903907443583), // 지도의 중심좌표
        level: 13 // 지도의 확대 레벨
    };
var map = new kakao.maps.Map(mapContainer, mapOption); // 지도를 생성합니다
 
// 마커를 표시할 위치와 내용을 가지고 있는 객체 배열입니다 
var positions = [
    <?php
       db 주소 불러옴  주소 : 세종특별자치시 한누리대로 2130
$testaddr = "세종특별자치시 한누리대로 2130";
  for 문시 주소 을 불러와 변수 $testaddr 
$address = $testaddr;
$url = "https://dapi.kakao.com/v2/local/search/address.json?query=".urlencode($address);

$ch=curl_init();
curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_URL, $url); // url 연결
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, 
            array("Accept: application/json", "Content-Type: application/json", 
                  "Authorization: KakaoAK {API REST 키}"));
curl_setopt($ch, CURLOPT_VERBOSE, true);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);

$response = curl_exec($ch);
$result = (array) json_decode($response); 
 
//좌표구하기
if($result["documents"][0]->road_address->x){
    $lat = $result["documents"][0]->road_address->y;
    $lng = $result["documents"][0]->road_address->x;
}else{
    $lat = $result["documents"][0]->address->y;
    $lng = $result["documents"][0]->address->x;
}
curl_close($ch); // 종료
    ?>
    {
        content: '<div class="customoverlay1">오버레이</div>', 
        latlng: new kakao.maps.LatLng( <?php echo $lat; ?>, <?php echo $lng; ?>)
    },
    <?php } ?>
];

for (var i = 0; i < positions.length; i ++) {
    // 마커를 생성합니다
    var marker = new kakao.maps.Marker({
        map: map, // 마커를 표시할 지도
        position: positions[i].latlng // 마커의 위치
    });
    // 마커에 표시할 인포윈도우를 생성합니다 
    var infowindow = new kakao.maps.InfoWindow({
        content: positions[i].content // 인포윈도우에 표시할 내용
    });
    // 마커에 mouseover 이벤트와 mouseout 이벤트를 등록합니다
    // 이벤트 리스너로는 클로저를 만들어 등록합니다 
    // for문에서 클로저를 만들어 주지 않으면 마지막 마커에만 이벤트가 등록됩니다
    kakao.maps.event.addListener(marker, 'mouseover', makeOverListener(map, marker,infowindow));
    kakao.maps.event.addListener(marker, 'mouseout', makeOutListener(infowindow));
}
// 인포윈도우를 표시하는 클로저를 만드는 함수입니다 
function makeOverListener(map, marker, infowindow) {
    return function() {
        infowindow.open(map, marker);
    };
}
// 인포윈도우를 닫는 클로저를 만드는 함수입니다 
function makeOutListener(infowindow) {
    return function() {
        infowindow.close();
    };
}
/* 아래와 같이도 할 수 있습니다 */
/*
for (var i = 0; i < positions.length; i ++) {
    // 마커를 생성합니다
    var marker = new kakao.maps.Marker({
        map: map, // 마커를 표시할 지도
        position: positions[i].latlng // 마커의 위치
    });
    // 마커에 표시할 인포윈도우를 생성합니다 
    var infowindow = new kakao.maps.InfoWindow({
        content: positions[i].content // 인포윈도우에 표시할 내용
    });
    // 마커에 이벤트를 등록하는 함수 만들고 즉시 호출하여 클로저를 만듭니다
    // 클로저를 만들어 주지 않으면 마지막 마커에만 이벤트가 등록됩니다
    (function(marker, infowindow) {
        // 마커에 mouseover 이벤트를 등록하고 마우스 오버 시 인포윈도우를 표시합니다 
        kakao.maps.event.addListener(marker, 'mouseover', function() {
            infowindow.open(map, marker);
        });
        // 마커에 mouseout 이벤트를 등록하고 마우스 아웃 시 인포윈도우를 닫습니다
        kakao.maps.event.addListener(marker, 'mouseout', function() {
            infowindow.close();
        });
    })(marker, infowindow);
}
*/
// 일반 지도와 스카이뷰로 지도 타입을 전환할 수 있는 지도타입 컨트롤을 생성합니다
var mapTypeControl = new kakao.maps.MapTypeControl();
// 지도에 컨트롤을 추가해야 지도위에 표시됩니다
// kakao.maps.ControlPosition은 컨트롤이 표시될 위치를 정의하는데 TOPRIGHT는 오른쪽 위를 의미합니다
map.addControl(mapTypeControl, kakao.maps.ControlPosition.TOPRIGHT);
// 지도 확대 축소를 제어할 수 있는  줌 컨트롤을 생성합니다
var zoomControl = new kakao.maps.ZoomControl();
map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);
</script>
 

 

예제)  http://karb.co.kr/asbestos-status.php

 

 

추천
6

댓글 9개

전체 2,426 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT