CmWorld 2D Maps API

지도

기본예제

레이어 추가

다양한 오픈 지도

기타

GIS 컨트롤(툴바)

지도 확대/축소 컨트롤

지도 확대/축소 슬라이더

그림도구 컨트롤

거리계산

면적계산

색인지도

스케일바

마우스 위치 표시

GIS 동작 이벤트

마우스 이벤트

확대 이벤트

컨트롤 이벤트

객체

마커

라인

사각형

다각형

이미지 추가

객체 정보보기

객체 보이기/숨기기

벡터레이어 (CmWorldLayer)

벡터레이어 추가 (시도경계)

대용량 레이어

레이어 보이기/숨기기

벡터 스타일 설정

다양한 파일 지원

파일 불러오기

파일 저장하기

Sample다양한 파일 지원 파일 불러오기Shape 불러오기

Shape 불러오기

GIS의 데이터 포맷인 SHP 파일을 업로드하여 도형객체와 속성정보를 지도위에 가시화 합니다.
사용하는 라이브러리는 shp.js이며, 한글 인코딩 처리를 하기 위해 encoding-indexes.js, encoding.js를 사용합니다.

javascript

// 업로드한 shp 파일을 실행하여 지도 위에 가시화 하는 함수 입니다
function openShpFile(url) {
	var lineColor = {"color": "#0F2FFD","weight": 2,"opacity": 0.65}; // 선과 면 색상을 지정합니다
	       
	// geoJson 객체를 생성합니다
	var geo = L.geoJson({features:[]},{onEachFeature:function popUp(f,l){
		var out = [];
		if (f.properties){ 
			for(var key in f.properties){   
				out.push(key+": "+f.properties[key]);
			}    
			l.bindPopup(out.join("<br />"));
		}  
	}, style : lineColor}).addTo(mymap);
	       
	// shp 파일을 실행하여 데이터를 조회합니다
	shp(url).then(function(data){
		var geoDataLen = data.features.length; // 실행한 shp 파일의 객체 수를 저장합니다
		     
		if(geoDataLen != 0){  
			// 지도 영역에 지리적 경계를 추가하여 설정합니다
			mymap.fitBounds([  
				[37.3550, 126.97777777],          
				[37.7300, 126.99999999]   
			]);
		}    
		
		// geoJson 객체에 shp 객체를 추가하여 지도위에 가시화 합니다
		geo.addData(data);
	});
}
License지원브라우저Tel: 02-578-5101E-mail: master@cmworld.co.kr

© 2017. CmWorld INC all right reserved.