브이월드란?	오픈플랫폼?
연혁/로드맵
제공데이터
운영기구소개
서비스소개	지도 소개
오픈API 소개
데이터정보 소개
참여 소개
3D데스크톱 소개
커뮤니티매핑 소개
활용사례	활용사례
공모전 수상작
정책	이용약관
개인정보처리방침
이메일무단수집거부
사이트맵

지도보기	지도 보기
영문지도 보기
사용방법	사용방법안내
오류해결방안
설치방법	플러그인 설치
최소/권장사양

오픈API	오픈API안내
2D지도 API레퍼런스
3D지도 API레퍼런스
배경지도 API레퍼런스
WMS/WFS API레퍼런스
WMTS/TMS API 레퍼런스
데이터 API레퍼런스
지도검색 API레퍼런스
Static Map API레퍼런스
2D모바일 API레퍼런스
3D모바일 API레퍼런스
3D데스크톱 API레퍼런스
인증키	인증키발급
인증키관리
제한사용초과요청
활용	인기 활용 사례
전체 활용 검색
나의 활용
정책	오픈API 이용약관

서비스소개	참여란?
개인 참여방법
참여지도	내참여
개인참여
정책	운영정책

서비스 소개	데이터정보 소개
운영정책
법적고지
데이터 검색	등록자료 조회
나의 관심자료 조회
등록자료 갱신 조회
스토리지 서비스	스토리지서비스 안내
공간정보 현황 관리
공간정보 등록
공간정보 등록 이력 조회
서비스 URL 관리
오류신고	절차안내
나의 오류신고

소개	3D데스크톱 이란?
다운로드	다운로드
최소권장사양
설치/삭제안내
출시노트
사용방법 안내	지도 조작법안내
기본 사용법(2.0)안내
기본 사용법(3.0)안내

서비스소개	커뮤니티란?
커뮤니티 참여방법
운영정책	운영정책
커뮤니티 참여	커뮤니티참여

알림마당	공지사항
FAQ
Q&A
나의 Q&A
자료실
공간정보소식
건의사항
나의 건의사항

Static Map API 2.0 레퍼런스

Static Map API 2.0 레퍼런스입니다.

소개

Static Map API는 자바스크립트에 의존하지 않고 오픈플랫폼의 배경지도 및 영상지도, 하이브리드 지도를 이용하여 위치표시 및 정보공유가 가능하도록 구현한 API입니다. 현재는 요청횟수에 제한은 없으나 API사용량 및 서버 과부하 여부에 따라 변동될수 있습니다.

요청형식

요청형식
http://api.vworld.kr/req/image?service=image&request=getmap&key=인증키&[요청파라미터]
Get 방식 요청 IE 브라우저 주소창으로 요청시는 브라우저 자체의 문자열 제한으로 2000자 까지만 요청할수 있습니다. IE 이외의 브라우저는 문자열 제한이 없습니다. HTML IMG 태그의 src 경로를 이용할시에는 모든 브라우저에서 문자열 제한이 없습니다.

요청파라미터

요청파라미터
파라미터	선택	설명	유효값
service	O/1	요청 서비스명	image(기본값)
version	O/1	요청 서비스 버전	2.0(기본값)
request	M/1	요청 서비스 오퍼레이션	GetMap
key	M/1	발급받은 api key
format	O/1	응답결과 포맷	png(기본값), jpeg, bmp
errorFormat	O/1	에러 응답결과 포맷 파라미터 값이 image일 경우 format 파라미터에 지정된 포맷으로 설정	json(기본값), xml, image, blank
basemap	O/1	지도 유형	NONE : 없음(흰배경) GRAPHIC(기본값) : 기본지도 GRAPHIC_GRAY : 회색지도 GRAPHIC_NIGHT : 야간지도 PHOTO : 영상지도 PHOTO_HYBRID : 영상시설물지도
center	M/1	지도 중심 좌표	포맷 : x,y
crs	O/1	center의 좌표계	지원좌표계표 참고, EPSG:4326(기본값)
zoom	M/1	지도 줌 레벨	6 ~ 18
size	M/1	이미지 크기	포맷 : width,height 최대값 : 1024,1024
layers	O/n	요청지도에 Overlay할 주제도의 목록 스타일은 브이월드에 정의되어 있는 스타일을 사용	WMS/WFS 레퍼런스 참고
styles	O/n	레이어스타일	WMS/WFS 레퍼런스 참고
marker	O/n	GetMap으로 Static Map 요청시 마커를 표시할 수 있음 [marker 서브 파라미터 참고]
route	O/n	GetMap으로 Static Map 요청시 마커를 표시할 수 있음 [route 서브 파라미터 참고]

marker 서브 파라미터

marker 서브 파라미터
파라미터	선택	설명	유효값
point	M/n	마커의 포인트 좌표	포맷(WKT Style) : pointX1 pointY1[,pointX2 pointY2]
label	O/1	마커의 라벨
color	O/1	라벨 색상	label이 있을 경우에만 유효
font	O/1	라벨 글꼴	label이 있을 경우에만 유효
size	O/1	라벨 크기(px)	label이 있을 경우에만 유효
image	O/1	마커의 이미지 URL http://를 제외한 URL만 입력	map.vworld.kr/images/maps/marker.png(기본값)

marker 예제1. 스타일이 같은 마커들 : 한 개의 marker 파라미터로 여러 개의 포인트를 표현하여 처리
marker=point:x1 y1, x2 y2,x3 y3|label:마커라벨테스트|color:blue|image:map.vworld.kr/images/maps/marker.png
marker 예제2. 스타일이 다른 마커들 : 여러 개의 marker 파라미터로 각각의 포인트를 표현하여 처리
marker=point:x1 y1, x2 y2|label:마커라벨테스트|color:red&marker=point:x3 y3|label:마커라벨테스트2|color:blue|image:map.vworld.kr/images/maps/marker.png

route 서브 파라미터

route 서브 파라미터
파라미터	선택	설명	유효값
point	M/n	경로의 포인트 좌표	포맷(WKT Style) : pointX1 pointY1,pointX2 pointY2[,pointX3 pointY3]
color	O/1	선 색상
width	O/1	선 너비
style	O/1	선 패턴	solid(기본값), dash, dot, dashdot, dashdotdot, longdash, longdashdot

route 예제1. 스타일이 같은 경로들 : 한 개의 route 파라미터로 여러 개의 포인트를 표현하여 처리
route=point:x1 y1, x2 y2, x3 y3|color:red|width:1|style:dot
route 예제2. 스타일이 다른 경로들 : 여러 개의 route 파라미터로 각각의 포인트를 표현하여 처리
route=point:x1 y1, x2 y2, x3 y3|color:red|width:1|style:dot&route=point:x4 y4, x5 y5|color:blue|width:3|style:solid

지원좌표계

오퍼레이션
좌표계	설명
WGS84 경위도	EPSG:4326
GRS80 경위도	EPSG:4019
Google Mercator	EPSG:3857, EPSG:900913
서부원점(GRS80)	EPSG:5180(50만), EPSG:5185
중부원점(GRS80)	EPSG:5181(50만), EPSG:5186
제주원점(GRS80, 55만)	EPSG:5182
동부원점(GRS80)	EPSG:5183(50만), EPSG:5187
동해(울릉)원점(GRS80)	EPSG:5184(50만), EPSG:5188
UTM-K(GRS80)	EPSG:5179

오류 응답결과

오류 응답결과
항목명		타입	설명
service		문자	요청 서비스 정보 Root
	name	문자	요청 서비스명
	version	숫자	요청 서비스 버전
	operation	문자	요청 서비스 오퍼레이션 이름
	time	숫자	응답결과 생성 시간
status		문자	처리 결과의 상태 표시, 유효값 : OK(성공), NOT_FOUND(결과없음), ERROR(에러)
error		문자	에러 정보 Root
	level	숫자	에러 레벨
	code	문자	에러 코드
	text	문자	에러 메시지

오류메세지

오류메세지
코드	레벨	메세지	비고
PARAM_REQUIRED	1	필수 파라미터인 <%S1>가 없어서 요청을 처리할수 없습니다.	%S1 : 파라미터 이름
INVALID_TYPE	1	<%S1> 파라미터 타입이 유효하지 않습니다. 유효한 파라미터 타입 : <%S2> 입력한 파라미터 값 : <%S3>	%S1 : 파라미터 이름 %S2 : 유효한 파라미터 값의 유형 %S3 : 입력한 파라미터 값
INVALID_RANGE	1	<%S1> 파라미터의 값이 유효한 범위를 넘었습니다. 유효한 파라미터 타입 : <%S2> 입력한 파라미터 값 : <%S3>	%S1 : 파라미터 이름 %S2 : 유효한 파라미터 값의 범위 %S3 : 입력한 파라미터 값
INVALID_KEY	2	등록되지 않은 인증키입니다.
INCORRECT_KEY	2	인증키 정보가 올바르지 않습니다. (ex. 인증키 발급 시 입력한 도메인이 다를경우)
UNAVAILABLE_KEY	2	임시로 인증키를 사용할 수 없는 상태입니다.
OVER_REQUEST_LIMIT	2	서비스 사용량이 일일 제한량을 초과하여 더 이상 서비스를 사용할 수 없습니다.
SYSTEM_ERROR	3	시스템 에러가 발생하였습니다.
UNKNOWN_ERROR	3	알 수 없는 에러가 발생하였습니다.

사용예제

<!DOCTYPE html>
<html>
<head>
<title>(예제)StaticMap API 2.0</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">

<script type="text/javascript" src="//map.vworld.kr/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="//map.vworld.kr/js/map/proj4js.js"></script>
<script type="text/javascript" src="//map.vworld.kr/js/map/OpenLayers-2.13/OpenLayers.js"></script>

<style type="text/css">
*, body {font-family:NanumGothic, 돋움, Dotum, 나눔고딕;font-weight:normal;font-size:13px;}
input[type=button]{padding:2px 10px;line-height:24px;height:26px;min-width:100px; cursor:pointer;}
input[type=text],select{color:red;font-weight:bold;padding:2px 10px;line-height:22px;height:24px;border:solid 1px #e3e3e3;min-width:400px;}
textarea {color:blue;font-weight:bold;padding:2px 10px;line-height:22px;height:24px;border:solid 1px #e3e3e3;width:95%;height:150px;}
#requesturl, #resultbody {color:black;font-weight:normal; border: solid 1px #e3e3e3; width:95%; height:70px; overflow-x:hidden; overflow-y:auto; word-break:break-all; }
#resultbody { height: 150px;}
input:read-only {color:blue;}
input[readonly] {color:blue;}
input[type=file] {padding:2px 8px;/*line-height:24px;height:24px;*/border:solid 1px #e3e3e3;width:300px;}
select {padding-right:0px;min-width:100px;color:black;}
#toolbar{line-height:30px;min-height:30px;top:0px;font-weight:bold;}
div.mandatory label {min-width:200px; margin-right:10px;}
div.temporary b {font-weight:bold;color:blue;}
div.maintitle {width:95%;height:50px;font-size:18px;line-height:50px;background-color:#004080;color:white;font-weight:bold;padding-left:20px;}
#resultbox img {min-width:350px;min-height:150px;}
</style>
<script type="text/javascript">
$(document).ready(function() {
	//
	Proj4js.defs["EPSG:4019"] = "+proj=longlat +ellps=GRS80 +no_defs";
	Proj4js.defs["EPSG:3857"] = "+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";
	Proj4js.defs["EPSG:900913"] = "+proj=merc +a=6378137 +b=6378137 +lat_ts=0.0 +lon_0=0.0 +x_0=0.0 +y_0=0 +k=1.0 +units=m +nadgrids=@null +no_defs";
	
	//UTM-K
	Proj4js.defs["EPSG:5179"] = "+proj=tmerc +lat_0=38 +lon_0=127.5 +k=0.9996 +x_0=1000000 +y_0=2000000 +ellps=GRS80 +units=m +no_defs";
	//중부원점(50만)
	Proj4js.defs["EPSG:5181"]="+proj=tmerc +lat_0=38 +lon_0=127 +k=1 +x_0=200000 +y_0=500000 +ellps=GRS80 +units=m +no_defs";
	//서부원점
	Proj4js.defs["EPSG:5185"] = "+proj=tmerc +lat_0=38 +lon_0=125 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs";
	//중부원점-o
	Proj4js.defs["EPSG:5186"] = "+proj=tmerc +lat_0=38 +lon_0=127 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs";
	//동부원점
	Proj4js.defs["EPSG:5187"] = "+proj=tmerc +lat_0=38 +lon_0=129 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs";
	//동해(울릉)원점
	Proj4js.defs["EPSG:5188"] = "+proj=tmerc +lat_0=38 +lon_0=131 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs";
	$("#result_img, #resultbody").hide();
});
function execute(newWin){
	// api.vworld.kr도메인 외 다른 도메인에 사용시 proxy를 사용해야 합니다.
	var hosturl = location.protocol+'//'+location.hostname+(location.port ? ':'+location.port: '');
	var url = hosturl + $("#url").val();
	var requestStr = url;
	var dataType = $.trim($("#format").val()).toLowerCase();
	var param = "";
	$("#requestbody, #resultbody").empty();
	$("#result_img, #resultbody").hide();
	$("#result_img").attr("src","");
	$(".mandatory input[type=text]").each(function(){
		var val = $.trim($(this).val());
		var id = $(this).attr("id").toLowerCase();
		if (id == 'marker' || id == 'route') {val = encodeURIComponent(val);}
		if (id != "url" && val != ''){
			param = param + "&"+id + "=" + val;
		}
	});
	
	requestStr += param.substring(1);
	$("#requesturl").text(requestStr);

window.open("about:blank","responsewindow").location.href = requestStr;
}

function changeFormat(formatval){
	$("#format").val(formatval);
}

function changeValue(id, value){
	var targetid = id.split("_")[0];	
	$("#" + targetid).val(value);
}

function changeCRS(id, value){
	var targetid = id.split("_")[0];	
	$("#" + targetid).val(value);
	setCurrentCoord();
}

function setCurrentCoord(){
	try {
		var value = $("#crs").val();
		var scrs = $("#scrs").val();
		var epsg = value.toUpperCase();

if(value == scrs){
			$("#center").val($("#lon").val() + "," + $("#lat").val());
		}else{
			var lonlat = new OpenLayers.LonLat($("#lon").val(),$("#lat").val());
			var SCRS = new OpenLayers.Projection(scrs);
			var TCRS = new OpenLayers.Projection(epsg);
			var point = lonlat.transform(SCRS, TCRS);
			$("#center").val(point.lon + "," + point.lat);
		}
	}catch(e){}
}
</script> 
</head> 
<body>
	<div id="desc" style="padding:0px 0px;">
		<div id="toolbar">	
			<div class="maintitle">(예제)StaticMap API 2.0</div>
			<div class="temporary">
			경위도 좌표와 입력좌표계를 입력 후<b>"좌표적용"</b>버튼을 클릭하면 요청좌표계(crs)에 맞는 좌표로 변환됩니다. 요청좌표계(crs) 선택시 <b>자동변환</b> 됩니다.
			<table>
				<colgroup>
				<col width="200px" >
				<col />
				</colgroup>
				<tr><th>경도(WGS84)</th><td><input type="text" id="lon" value="126.978275264" /> 예) 126.978275264 , 14135156.944223</td></tr>
				<tr><th>위도(WGS84)</th><td><input type="text" id="lat" value="37.566642192" /> 예) 37.566642192 , 4518386.4796013</td></tr>
				<tr><th>원본좌표계</th><td><input type="text" id="scrs" value="epsg:4326" readonly/>
					<select id="scrs_list" onchange="changeValue(this.id, this.value);">
					<option value="epsg:4326">WGS84 경위도</option>
					<option value="epsg:4019">GRS80</option>
					<option value="epsg:3857">Google Mercator</option>
					<option value="epsg:5181">중부원점(GRS80, 50만)</option>
					<option value="epsg:5185">서부원점(GRS80)</option>
					<option value="epsg:5186">중부원점(GRS80)</option>
					<option value="epsg:5187">동부원점(GRS80)</option>
					<option value="epsg:5188">동해(울릉)원점(GRS80)</option>
					<option value="epsg:5179">UTM-K(GRS80)</option>
					</select>
				</td></tr>
			</table>
			<input type="button" value="좌표적용" onclick="javascript:setCurrentCoord();" />
			* 입력한 경위도 좌표값들이 요청좌표계(crs)에 맞는 좌표로 변환됩니다.
			</div>
			<div class="mandatory">				
			<table class="board-write txt-left">
				<colgroup>
				<col width="200px" >
				<col width="50px" >
				<col />
				</colgroup>
				<tbody>
					<tr><th>요청URL</th><td></td><td><input type="text" id="url" value="/req/image?" readonly /></td></tr>
					<tr><th>서비스ID(service)</th><td>O/1</td><td><input type="text" id="service" value="image" readonly/></td></tr>
					<tr><th>서비스버전(version)</th><td>O/1</td><td><input type="text" id="version" value="2.0" readonly/></td></tr>
					<tr><th>오퍼레이션(request)</th><td>M/1</td><td><input type="text" id="request" value="getmap" readonly/>	</td></tr>
					<tr><th>인증키(key)</th><td>M/1</td><td><input type="text" id="key" value="483E0418-2F46-3223-80A1-F66D16A24685" readonly/></td></tr>
					<tr><th>결과포맷(format)</th><td>O/1</td><td><input type="text" id="format" value="png" readonly/>
						<select id="format_list" onchange="changeValue(this.id, this.value);">
						<option value="png">png</option>
						<option value="jpeg">jpeg</option>
						<option value="bmp">bmp</option>
						</select>
					</td></tr>
					<tr><th>오류결과포맷(errorFormat)</th><td>O/1</td><td><input type="text" id="errorformat" value="" readonly/>
						<select id="errorformat_list" onchange="changeValue(this.id, this.value);">
						<option value="">선택</option>
						<option value="xml">xml</option>
						<option value="json">json</option>
						<option value="image">요청이미지포맷</option>
						<option value="blank">빈이미지</option>
						</select>
					</td></tr>
					<tr><th>지도 유형(basemap)</th><td>O/1</td><td><input type="text" id="basemap" value="GRAPHIC" readonly/>
						<select id="basemap_list" onchange="changeValue(this.id, this.value);">
						<option value="GRAPHIC">기본지도</option>
						<option value="NONE">없음</option>
						<option value="GRAPHIC_GRAY">회색지도</option>
						<option value="GRAPHIC_NIGHT">야간지도</option>
						<option value="PHOTO">영상지도</option>
						<option value="PHOTO_HYBRID">영상시설물지도</option>
						</select>
					</td></tr>
					<tr><th>검색중심지점(center)</th><td>M/1</td><td><input type="text" id="center" value="126.978275264,37.566642192" />
					</td></tr>
					<tr><th>좌표계(crs)</th><td>O/1</td><td><input type="text" id="crs" value="epsg:4326" readonly/>
						<select id="crs_list" onchange="changeCRS(this.id, this.value);">
						<option value="epsg:4326">WGS84 경위도</option>
						<option value="epsg:3857">Google Mercator</option>
						<option value="epsg:4019">GRS80</option>
						<option value="epsg:5181">중부원점(GRS80, 50만)</option>
						<option value="epsg:5185">서부원점(GRS80)</option>
						<option value="epsg:5186">중부원점(GRS80)</option>
						<option value="epsg:5187">동부원점(GRS80)</option>
						<option value="epsg:5188">동해(울릉)원점(GRS80)</option>
						<option value="epsg:5179">UTM-K(GRS80)</option>
						</select>
					</td></tr>
					<tr><th>줌 레벨(zoom)</th><td>M/1</td><td><input type="text" id="zoom" value="16" /> 예)14(6~18 범위내 허용)</td></tr>
					<tr><th>이미지폭과 높이(size)</th><td>M/1</td><td><input type="text" id="size" value="400,400" />픽셀값(숫자)</td></tr>
					<tr><th>오버레이(layers)</th><td>O/1</td><td><input type="text" id="layers" value="" /> 예)LT_C_UQ111</td></tr>
					<tr class="max"><th>마커(marker)</th><td>O/1</td><td><input type="text" id="marker" style="width:95%;" value="" />
					<br/>label:마커테스트1|color:red|point:126.9760222 37.5682154,126.9808716 37.5678752,126.9804424 37.5650008,126.9770736 37.5668037</td></tr>
					<tr class="max"><th>경로(route)</th><td>O/1</td><td><input type="text" id="route" style="width:95%;" value="" />
					<br/>style:dash|color:red|width:3|point:126.9760222 37.5682154,126.9808716 37.5678752,126.9804424 37.5650008,126.9770736 37.5668037</td></tr>
				</tbody>
			</table>
			<div style="margin-bottom:5px;">
				요청구문은 다음과 같습니다 :
				<div id="requesturl">
				</div>
			</div>
			<input type="button" value="테스트요청" onclick="javascript:execute();" />
				
		</div>
		</div>
	</div>
</body>
</html>

예제파일 다운로드 예제파일 미리보기

로그인

포털

지도

오픈API

참여

데이터정보

3D데스크톱

커뮤니티

알림마당

오픈API

Static Map API 2.0 레퍼런스

브이월드