포럼
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
사이트에 네이버 지도를 넣고 싶은데요
2012.03.23 23:53
네이버에서 지도 api 받고 어떻게 해야 할지 난감합니다. ㅠㅠ
댓글 3
-
굿총
2012.03.24 01:31
-
misol
2012.03.24 13:57
네이버 지도 컴포넌트 사용하세요. -
옆집옵하
2013.05.25 18:26
api 키까지 입력/저장하고 지도검색시 주소까지는 검색이 되지만
검색한 주소를 클릭했을때 해당 주소 지도가 나오지 않습니다.
조언 좀 해주세요 ㅠㅠ
php파일 하나 만드셔서 외부페이지로 XE에 집어넣으시면 됩니다. php소스는 검색(네이버지도api php소스 뭐 이런식으로)하시면 많이 있습니다... 하나 찾아온 거 아래에 입력해 놓을께요. 문제되면 삭제하겠습니다.
------------------------------>아래소스
<?php
$map_width =960; // 지도의 폭
$map_height = 535; // 지도의 높이
$map_zoom = 0; // 지도의 축적 1~11 사이의 자연수. 1에 가까울 수록 지도가 확대
// 네이버 지도api 키값
$map_key = "여기에키값을입력하시면됩니다" ;
// 쿼리 돌릴 주소
$map_query= str_replace(" ","",'여기나오고자하는주소입력하시구요'); //$map_query='경기도성남시정자1동5-1';
// 여기부터 주소 검색 xml 파싱
$pquery = $map_key. "&query=". $map_query;
$fp = fsockopen ("maps.naver.com", 80, $errno, $errstr, 30);
if (!$fp) {
echo "$errstr ($errno)";
} else {
fputs($fp, "GET /api/geocode.php?");
fputs($fp, $pquery);
fputs($fp, " HTTP/1.1\r\n");
fputs($fp, "Host: maps.naver.com\r\n");
fputs($fp, "Connection: Close\r\n\r\n");
$header = "";
while (!feof($fp)) {
$out = fgets ($fp,512);
if (trim($out) == "") {
break;
}
$header .= $out;
}
$mapbody = "";
while (!feof($fp)) {
$out = fgets ($fp,512);
$mapbody .= $out;
}
$idx = strpos(strtolower($header), "transfer-encoding: chunked");
if ($idx > -1) { // chunk data
$temp = "";
$offset = 0;
do {
$idx1 = strpos($mapbody, "\r\n", $offset);
$chunkLength = hexdec(substr($mapbody, $offset, $idx1 - $offset));
if ($chunkLength == 0) {
break;
} else {
$temp .= substr($mapbody, $idx1+2, $chunkLength);
$offset = $idx1 + $chunkLength + 4;
}
} while(true);
$mapbody = $temp;
}
$map_cquery =iconv("utf-8","euc-kr","$map_query");
fclose ($fp);
}
// 여기까지 주소 검색 xml 파싱
// 여기부터 좌표값 변수에 등록
$map_x_point_1=explode("<x>", $mapbody);
$map_x_point_2=explode("</x>", $map_x_point_1[1]);
$map_x_point=$map_x_point_2[0];
$map_y_point_1=explode("<y>", $mapbody);
$map_y_point_2=explode("</y>", $map_y_point_1[1]);
$map_y_point=$map_y_point_2[0];
// 여기까지 좌표값 변수에 등록
//php코드는 여기까지이구요
?>
<!-- 네이버 지도 키 값 -->
<scRIPT LANGUAGE="Javascript" src="">http://maps.naver.com/js/naverMap.naver?<?=$map_key?>"></scRIPT>
<!-- 네이버 지도 키 값 끝 -->
<style type="text/css">
<!--
.style1 {
color: #FF6600;
font-weight: bold;
}
.style4 {color: #0033FF}
-->
</style>
<table cellpadding="0" cellspacing="1" bgcolor="cccccc" >
<tr>
<td><span class="style1">지도를 확대 혹은 축소해서 보시려면 <span class="style4">지도 왼쪽 상단의 조절막대를 아래/위로 조작</span>하십시오. 마우스를 드랙하시면서 위치를 파악하셔도 됩니다.</span></td>
</tr>
<tr><td height="10" bgcolor="ffffff"></td></tr>
<tr>
<td>
<!-- 지도 출력 -->
<div id='mapContainer'></div>
<!-- 지도 출력 끝 -->
</td>
</tr>
</table>
<scRIPT LANGUAGE="Javascript">
<!--
var x_point = <? echo $map_x_point; ?>;
var y_point = <? echo $map_y_point; ?>;
var icon = new NIcon("../images/flag_blue.png", new NSize(80,23)); // 아이콘파일을 계정에 만드시고(지정된 위치에 표시되는 아이콘입니다) 이미지 주소 및 크기를 변경해주세요
var loc_Point = new NPoint(x_point,y_point); // 포인트 표시
var map_mark = new NMark(loc_Point, icon ); // 지도에 아이콘 표시
var mapObj = new NMap(document.getElementById('mapContainer'),<? echo $map_width; ?>,<? echo $map_height; ?>); // 지도창
var infowin = new NInfoWindow();
var zoom = new NZoomControl();
var zoomlevel = 2
mapObj.addOverlay(map_mark); // 지도에 마크표시
mapObj.setCenterAndZoom(loc_Point,zoomlevel); // 지도 중앙
mapObj.addOverlay(infowin);
zoom.setAlign("left"); // 줌 조절 버튼 왼쪽에 위치
zoom.setValign("top"); // 줌 조절 버튼 아래에 위치
//mapObj.enableWheelZoom(); 지도 안에서 휠로 줌 조절 가능하게 하려면 주석을 풀어주세요
mapObj.addControl(zoom);
//-->
</scRIPT>