2026, 새로운 도약을 시작합니다.

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

1890416218_1578286212.5314.png

php Curl 

[code]

$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); // 종료

[/code]

Html

[code]

<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>

[/code]

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

|

댓글 9개

감사합니다. 잘쓰겠습니다.
http://karb.co.kr/cq.php?it_id=1571157758

근데 여깃 주소에 구 선택 후 동 DB는 어디서 얻었나요?
sql 문 드릴까요? 부분적으로 추가을 해주셔야 할듯 하내요
옛날주소 sql 문 입니다.
http://karb.co.kr/down/zip_code.sql
감사합니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

그누보드5 팁자료실

번호 제목 글쓴이 날짜 조회
공지 3년 전 조회 4,597
2741 3일 전 조회 99
2740 4일 전 조회 96
2739 1주 전 조회 206
2738 1주 전 조회 209
2737 1주 전 조회 174
2736 1주 전 조회 276
2735 3주 전 조회 278
2734 3주 전 조회 259
2733 1개월 전 조회 262
2732 1개월 전 조회 300
2731 1개월 전 조회 264
2730 1개월 전 조회 222
2729 1개월 전 조회 350
2728 1개월 전 조회 244
2727 1개월 전 조회 419
2726 1개월 전 조회 253
2725 1개월 전 조회 326
2724 1개월 전 조회 357
2723 1개월 전 조회 265
2722 1개월 전 조회 298
2721 1개월 전 조회 211
2720 2개월 전 조회 304
2719 2개월 전 조회 307
2718 2개월 전 조회 200
2717 2개월 전 조회 335
2716 2개월 전 조회 202
2715 2개월 전 조회 311
2714 2개월 전 조회 271
2713 2개월 전 조회 374
2712 2개월 전 조회 289
🐛 버그신고