5. 최종 결과파일의 json 내부 구조

파일내용

{
	"type":"FeatureCollection", 
	"features": 
		[
			{
				"type":"Feature",
				"geometry":
						{
							"type":"Polygon",
							"coordinates":[[[127.00456669928406,37.6850798098906],[126.99731116844072,37.683466199044155],[126.99324726786291,37.67766063147003],[126.99407385261537,37.672761084765924],[126.99222451743371,37.66523164126402],[126.98727674268342,37.66060014276315],[126.97965811073921,37.656038640851065],[126.9839369285871,37.64961005099174],[126.98324715807719,37.64368349598156],[126.98591770163301,37.63578877786196],[126.99538884702677,37.6302463902108],[126.99926722791719,37.62619296024507],[127.00785594849995,37.62402173035871],[127.0100999324743,37.61685147969547],[127.01922788107193,37.61379782227062],[127.0221357173587,37.61138131436707],[127.03678035795565,37.61242636490713],[127.04973665620577,37.624266297591845],[127.03976492966157,37.63219659264972],[127.03283057435712,37.64140747532764],[127.02468223683896,37.6473431336609],[127.01769825349434,37.648576382648784],[127.0124440453936,37.65218369964303],[127.0157876686505,37.66703365006334],[127.01849458128332,37.67015573008051],[127.0094165443099,37.67957184291667],[127.00866351452741,37.68444952137286],[127.00456669928406,37.6850798098906]]]
 						},
				"properties":
						{
							"SIG_CD":"11305",
							"SIG_ENG_NM":"Gangbuk-gu",
							"SIG_KOR_NM":"강북구"
						}
			},
			{
				"type":"Feature",
				"geometry":
						{
							"type":"Polygon",
							"coordinates":[[[127.01508681387975,37.649288344708616],[127.02113000014923,37.648999889461315],[127.03283057574068,37.641407476479884],[127.03976493048613,37.632196593304954],[127.04391715717198,37.63347795164838],[127.04676649111323,37.639709397312146],[127.05582468233929,37.64704882421829],[127.05341541106257,37.65750206837999],[127.04818959927375,37.67047798122766],[127.05193848490198,37.68295123576437],[127.04863168161688,37.69406296483792],[127.0411085083828,37.6952997779213],[127.03676284873275,37.69263991970876],[127.03102613213113,37.69307452704253],[127.02928557651389,37.699291623344656],[127.01541510754204,37.701455279213995],[127.00966621339057,37.696699830791715],[127.00762076445166,37.69161848974774],[127.00941654559418,37.67957184401641],[127.01849458214141,37.67015573118018],[127.01578767003419,37.66703365071866],[127.01244404664422,37.65218370029841],[127.01508681387975,37.649288344708616]]]
						},
				"properties":
						{
							"SIG_CD":"11320",
							"SIG_ENG_NM":"Dobong-gu",
							"SIG_KOR_NM":"도봉구"
						}
			}
		]
}

이 JSON 파일을 파싱하는 코드

jQuery를 이용하여 파싱하는 방식을 사용하였음

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		
		$.getJSON("resources/only_seoul.json", function(geojson){	// json 파일관련 객체를 얻음
			
			var data = geojson.features; // 파일에서 key값이 "features"인 것의 value를 통으로 가져옴(이것은 여러지역에 대한 정보를 모두 담고있음)
			
			var coordinates = []; //좌표 저장할 배열
			var name = ''; // 지역 이름
			
			$.each(data, function(index, val){	// 1개 지역씩 꺼내서 사용함. val은 그 1개 지역에 대한 정보를 담음
				coordinates = val.geometry.coordinates; // 1개 지역의 영역을 구성하는 도형의 모든 좌표 배열을 가져옴 
				name = val.properties.SIG_KOR_NM;	// 1개 지역의 이름을 가져옴
				
				alert(name);
				displayArea(coordinates, name);
			});
		});
		
		
		function displayArea(coordinates, name){
			
		}
		
	});
</script>