PHP 로 XML 파싱하는 부분은 따로 없다. 그저 CCCV 했을 뿐... (CodeIgniter 로 포팅할때 관련 함수를 사용해보도록하자. 하지만 지금은 테스트니까...)
네이버 지도 API 키를 발급받고 한페이지 안에서 검색과 지도 표시를 같이 담았다.
- 소스 코드
INDEX.PHP
<?php
// 지도의 폭과 높이
$map_width = 600;
$map_height = 400;
// 지도의 축적 1~11 사이의 자연수. 1에 가까울 수록 지도가 확대
$map_zoom = 2;
// 네이버 지도api 키값
$map_key = "key=0000000000";
if (!$map_query) $map_query = "서울시 강남구 삼성동";
// 여기부터 주소 검색 xml 파싱
$pquery = $map_key. "&query=". str_replace(" ","",$map_query);
$fp = fsockopen ("map.naver.com", 80, $errno, $errstr, 30);
if (!$fp) {
echo "$errstr ($errno)";
//exit;
} else {
fputs($fp, "GET /api/geocode.php?");
fputs($fp, $pquery);
fputs($fp, " HTTP/1.1\r\n");
fputs($fp, "Host: map.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;
}
//header("Content-Type: text/xml; charset=utf-8");
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];
// 여기까지 좌표값 변수에 등록
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Weddies - 네이버 지도 API 연동</title>
<script type="text/javascript" src="http://map.naver.com/js/naverMap.naver?<?=$map_key?>"></script>
<script type="text/javascript">
function clearText() {
WedMap.map_query.value = "";
}
</script>
<style>
.clear {
clear: both;
}
.search {
}
</style>
</head>
<body>
<h1>TITLE 1</h1>
<h2>네이버 지도 API 테스트 페이지</h2>
<hr class="clear">
<div id='mapContainer' style='width: <?=$map_width?>px; height: <?=$map_height?>px; padding: 5px; border-style: solid; border-width: 5px; border-color: orange;'>
<script type="text/javascript">
<!--
/*지도 개체 생성 */
var opts = {width:<?=$map_width?>, height:<?=$map_height?>, mapMode:1};
var mapObj = new NMap(document.getElementById('mapContainer'),opts);
var x_point = <?=$map_x_point?>;
var y_point = <?=$map_y_point?>;
var zoom_level = <?=$map_zoom?>;
/* 지도 좌표, 축적 수 준 초기화 */
var loc_Point = new NPoint(x_point,y_point); // 포인트 표시
mapObj.setCenterAndZoom(loc_Point,zoom_level);
/* 지도 컨트롤 생성 */
var zoom = new NZoomControl();
zoom.setAlign("right");
zoom.setValign("top");
mapObj.addControl(zoom);
/* 지도 모드 변경 버튼 생성 */
var mapBtns = new NMapBtns();
mapBtns.setAlign("right");
mapBtns.setValign("top");
mapObj.addControl(mapBtns);
//-->
</script>
</div>
<hr class="clear">
<div class="search">
<form name="WedMap" method="post">
<input type="text" id="addr" name="map_query" value="검색할 주소를 입력하세요" size="80" maxLength="100" onclick="clearText();" tabindex="1">
<input type="submit" value="검색">
</form>
</div>
<hr class="clear">
<div>
<ul>
<dt>주소</dt>
<dd><?=$map_query?></dd>
<dt>좌표</dt>
<dd><?=$map_x_point?></dd>
<dd><?=$map_y_point?></dd>
</ul>
</div>
</body>
</html>
/* END OF INDEX.PHP */
지도가 잘 보여서 기쁘다.
'Development' 카테고리의 다른 글
| 아키텍트가 하는 일 (0) | 2010.06.10 |
|---|---|
| 객체지향 개발론과 반복의 과정 (0) | 2010.06.10 |
| 포스트백 스크롤 문제 (0) | 2009.09.17 |
| 환경점검 (0) | 2009.09.14 |
| 개발 개요 및 데이터베이스 구현 (0) | 2009.09.14 |
