채택완료

네이버 지도 API 좌표를 변수로 출력하는 법 문의드립니다.

2017-02-15 (수) 17:25:40 7,299

안녕하세요!

현재 하나의 게시판에 각 거래처의 정보를 넣고 본문에서는 각 거래처의 주소에 따라 네이버 지도를 보여주고자 합니다.

글쓰기시 wr_1에 주소를 입력하여 네이버주소 api에 대입하는 것은 간편하게 성공했습니다.

다만,

Copy
var map = new naver.maps.Map('map', {center: new naver.maps.LatLng(35.2430882, 128.6799992),zoom:15});

에 들어간 좌표를 wr_1의 입력한 주소에서 자동으로 뽑아오는 방법을 모르겠습니다.

수동으로 x, y좌표를 넣으면 정상적으로 출력이 되긴 합니다만,

wr_1에 입력된 주소를 변수처리해서 X,Y좌표에 자동으로 출력되게 하고 싶습니다.

워낙 프로그램에 문외한이라 어찌해야 될지를 모르겠네요.

이와 관련되어 성공하시거나 알고 계신 선배님들 계시면 조언 부탁드리겠습니다. ^^;;

Copy
<!-- 네이버지도 -->  <!DOCTYPE html>  <html>    <head>     <meta charset="UTF-8">     <title>간단한 지도 표시하기</title>     <script type="text/javascript" src="https://openapi.map.naver.com/openapi/v3/maps.js?clientId=BkFDbuMXQG28mqRdZN8f"></script>    </head>    <body>   <div id="map" style="width:100%;height:400px;"></div>   <script>     var map = new naver.maps.Map('map', {center: new naver.maps.LatLng(35.2430882, 128.6799992),zoom:15});     var marker = new naver.maps.Marker({    position: new naver.maps.LatLng(35.2430882, 128.6799992),    map: map // map변수에 잡힌 지도에 마커를 찍는다는것      });   </script>    </body>  </html>  <!-- 위 지도뿌리는 행위 -->  <!-- 아래 지도의 좌표를 파싱하는 행위 -->  <?php    $client_id = "BkFDbuMXQG28mqRdZN8f";    $client_secret = "o0TPPzv0pX";    $encText = urlencode($view['wr_1']); //주소지를 받아온다.    $url = "https://openapi.naver.com/v1/map/geocode?query=".$encText; // json    // $url = "https://openapi.naver.com/v1/map/geocode.xml?query=".$encText; // xml    $is_post = false;    $ch = curl_init();    curl_setopt($ch, CURLOPT_URL, $url);    curl_setopt($ch, CURLOPT_POST, $is_post);    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);    $headers = array();    $headers[] = "X-Naver-Client-Id: ".$client_id;    $headers[] = "X-Naver-Client-Secret: ".$client_secret;    curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);    $response = curl_exec ($ch);    //JSON타입을받아서 처리하는 과정이라 생각해라     $response_JSON = json_decode($response,true);     echo "<pre>";    print_r($response_JSON);     echo "</pre>";    echo "X Point : ".$response_JSON['result']['items'][0]['point']['x']."Y Point : ".$response_JSON['result']['items'][0]['point']['y'];    /*    $status_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);    echo "status_code:".$status_code."<br>";    curl_close ($ch);    if($status_code == 200) {   echo $response;    } else {   echo "Error 내용:".$response;    }    */  ?>
 

답변 1개 / 댓글 1개

채택된 답변
+20 포인트
2017-02-15 (수) 17:33:07

<!-- 아래 지도의 좌표를 파싱하는 행위 --> 

이걸 위로 올리시고

 

var map = new naver.maps.Map('map', {center: new naver.maps.LatLng(<?=$response_JSON['result']['items'][0]['point']['x'];?>, <?=$response_JSON['result']['items'][0]['point']['y'];?>),zoom:15});
13     var marker = new naver.maps.Marker({
14    position: new naver.maps.LatLng(<?=$response_JSON['result']['items'][0]['point']['x'];?>, <?=$response_JSON['result']['items'][0]['point']['y'];?>),

로 해보세요

답변에 대한 댓글 1개

2017-02-16 (목) 09:25:51
와우~ 블랙캣77님, 너무 감사드립니다!! ^^;;
검색도 해보고 이리저리 해봐도 안되던게 한 번에 해결되었네요.
이제 옵션들만 장착하면 멋지게 마무리 될 것 같습니다.
다시 한 번 진심으로 감사드립니다!!

답변을 작성하려면 로그인이 필요합니다.