let lang = 'null';

var owsLayer, owsStyle = '';
var dataVector;
var defaultFeature;
var seismicStatusChart;

var layer_info = {
		
	grid_pop_stats_1: {
		'layer': 'final_attribute', 'style': 'a_0_200', 'title': '격자기반 인구통계 - 인구구조',
		'owsType': 'WMS'
	},
	grid_pop_stats_2: {
		'layer': 'final_attribute', 'style': 'pop_old_r', 'title': '격자기반 인구통계 - 고령 인구 비율',
		'owsType': 'WMS'
	},
	grid_pop_stats_3: {
		'layer': 'final_attribute', 'style': 'pop_chng', 'title': '격자기반 인구통계 - 인구 변화율',
		'owsType': 'WMS'
	},
	
	grid_bldg_stats_1: {
		'layer': 'final_attribute', 'style': 'bld_old_r', 'title': '격자기반 건물통계 - 노후 건축물 비율',
		'owsType': 'WMS'
	},
	grid_bldg_stats_2: {
		'layer': 'final_attribute', 'style': 'avg_arch_a', 'title': '격자기반 건물통계 - 평균 건물 면적',
		'owsType': 'WMS'
	},
	grid_bldg_stats_3: {
		'layer': 'final_attribute', 'style': 'resi_rate', 'title': '격자기반 건물통계 - 주거용 건물 비율',
		'owsType': 'WMS'
	},
	
	demographic_diagnosis: {
		'layer': 'final_demographic', 'style': 'demographic_diagnosis', 'title': '인구 쇠퇴 정도',
		'owsType': 'WMS'
	},
	
	physical_diagnosis: {
		'layer': 'final_physical', 'style': 'physical_diagnosis', 'title': '물리적 노후 정도',
		'owsType': 'WMS'
	},
	
	declined_diagnosis: {
		'layer': 'final_declined', 'style': 'declined_diagnosis', 'title': '쇠퇴지역의 산출',
		'owsType': 'WMS'
	},
	
	regeneration_newdeal_area: {
		'layer': 'regeneration_newdeal_area', 'style': '', 'title': '현행 도시재생뉴딜 시범사업지구와의 비교',
		'owsType': 'WFS'
	},
	
	earthquake_bldg: {
		'layer': 'eq_buld_grid', 'style': 'eq_buld_grid', 'title': '내진설계 건축물 비율',
		'owsType': 'WMS'
	}
};

var boundaryRaster = new ol.layer.Tile({
	title: '시도 경계',
	visible: false,
	source: new ol.source.TileWMS({
		url: GISSERVER_URL,
		params: {
			format: 'image/png', 
			version: '1.3.0',
			tiled: true,
			//layers: 'pinogio:bnd_sido_pg_2016',
			layers: 'pinogio:tl_scco_ctprvn_201904'//,
			//styles: 'bnd_sido_pg_2016'
		}
	})
});

var boundaryVector = new ol.layer.Vector({
	title: '시도 영역',
	renderMode : 'image',
	source : new ol.source.Vector({
		//url : PROXY_URL + GISSERVER_URL + '?service=WFS&version=1.0.0&request=GetFeature&typeName=pinogio:bnd_sido_pg_2016&maxFeatures=50&outputFormat=application%2Fjson',
		url : PROXY_URL + GISSERVER_URL + '?service=WFS&version=1.0.0&request=GetFeature&typeName=pinogio:tl_scco_ctprvn_201904_s&outputFormat=application/json',
		format : new ol.format.GeoJSON()
	})
});
var boundarySelect = new ol.interaction.Select({
	condition: ol.events.condition.pointerMove,
	layers: [boundaryVector]
});


var tiledWMS = new ol.layer.Tile({
	title: '격자기반 인구통계',
	visible: false,
	opacity: .7,
	source: new ol.source.TileWMS({
		url: GISSERVER_URL,
		params: {
			format: 'image/png', 
			version: '1.3.0',
			tiled: true
			//layers: 'pinogio:final_attribute',
			//styles: 'a_0_200',
			//_t: new Date().getTime()
		}
	})
});

var map = new ol.Map({
	target : 'map',
	layers : [
		BASEMAP_GROUP,
		boundaryVector,
		boundaryRaster,
		tiledWMS
	],
	controls: ol.control.defaults({attribution: false}).extend([
		new ol.control.Attribution({
			collapsible: false
		})
		//, new ol.control.LayerSwitcher()
	]),
	interactions: ol.interaction.defaults({
		doubleClickZoom: false,
		mouseWheelZoom: true,
		dragPan: true,
		pinchZoom: true
	}).extend([
		boundarySelect
	]),
	view : new ol.View({
		center : ol.proj.transform([ 128.0292, 36.6332 ], 'EPSG:4326', 'EPSG:3857'),
		zoom : 7,
		enableRotation: false
	})
});

function basemapSwitcher(id) {
	var array = map.getLayerGroup().getLayers().getArray();
	for (var i in array) {
		if (array[i].get('id') == 'baseGroup') {
			array = array[i].getLayers().getArray();
			for (var j in array) {
				if (array[j].get('id') == id) {
					array[j].setVisible(true);
				} else {
					array[j].setVisible(false);
				}
			}
			break;
		}
	}
}
$('.pg-basemap-item').on('click', function(e) {
	basemapSwitcher(e.currentTarget.value);
});

//$('#map').data('map', map);
//var map = $('#map').data('map');



// 버튼 새로고침
function reload() {
	window.location.reload();
}

/**
 * 경계데이터 선택 이벤트
 * @param e
 * @returns
 */
 function boundarySelectEvt(e) {
	var features = boundarySelect.getFeatures().getArray();
	if (features.length > 0) {
		var sidoCd = features[0].getProperties().ctprvn_cd;
		//var sidoCd = features[0].getProperties().sido_cd;
		
		$("#mapBndSidoSelect").val(sidoCd).prop("selected", true);
		$("#mapBndSidoSelect").change();
	}
}
function boundarySelectOn() {
	map.on('click', boundarySelectEvt);
}
function boundarySelectUn() {
	map.un('click', boundarySelectEvt);
}


$.ajax({
	url: CONTEXT_PATH + '/api/bndSidoList.json',
	success:function(res) {
		try {
			for (i = 0; i < res.data.length; i++) {
				$('#mapBndSidoSelect').append(
					'<option value="'+ res.data[i].sidoCd +'">'+ res.data[i].sidoNm +'</option>'
				);
			}
		} catch (e) {
		}
	}
});


// 메뉴 변경시 이벤트
var onSelectedMenuFnc = function(e) {
	
//	if (overlay != null) {
//		overlay.setPosition(undefined);
//		closer.blur();
//	}
	
	if (e == undefined) {
		e = $('#dmr-menubar button[data-menutype=' + storyType + ']');
	}
	
	$('.dmr-menubar button').removeClass('btn-info');
	$('.dmr-menubar button').addClass('btn-outline-light');
	e.removeClass('btn-outline-light');
	e.addClass('btn-info');
	
	var selectedMenu = e.data('menutype');
	
	var pageURL = '';
	var owsLayerInfo = null;
	//현행 도시재생뉴딜시범사업지구와의 비교에서 쇠퇴지역 격자를 보기 위한 레이어 정
	var declinedInfo = null;
	
	if (highlightOverlay != null) {
		highlightOverlay.getSource().clear();
	}
	
	$('#mapIdentifyContentView').html('<center>격자를 선택하여 정보를 확인하세요.</center>');
	$('.mapIdentifyContentArea').hide();
	
	if (selectedMenu == 'grid_pop_stats') {
		pageURL = CONTEXT_PATH + '/declined/sub/gridPopStatsPage';
		owsLayerInfo = layer_info.grid_pop_stats_1;
		storyType  = 'grid_pop_stats';
		storyTypeSub = 'grid_pop_stats_1';
		
	} else if (selectedMenu == 'grid_bldg_stats') {
		pageURL = CONTEXT_PATH + '/declined/sub/gridBldgStatsPage';
		owsLayerInfo = layer_info.grid_bldg_stats_1;
		storyType  = 'grid_bldg_stats';
		storyTypeSub  = 'grid_bldg_stats_1';
		
	} else if (selectedMenu == 'demographic_diagnosis') {
		pageURL = CONTEXT_PATH + '/declined/sub/demographicDiagnosisPage';
		owsLayerInfo = layer_info.demographic_diagnosis;
		storyType  = 'demographic_diagnosis';
		
	} else if (selectedMenu == 'physical_diagnosis') {
		pageURL = CONTEXT_PATH + '/declined/sub/physicalDiagnosisPage';
		owsLayerInfo = layer_info.physical_diagnosis;
		storyType  = 'physical_diagnosis';
		
	} else if (selectedMenu == 'declined_diagnosis') {
		pageURL = CONTEXT_PATH + '/declined/sub/declinedDiagnosisPage';
		owsLayerInfo = layer_info.declined_diagnosis;
		storyType  = 'declined_diagnosis';
		
	} else if (selectedMenu == 'regeneration_newdeal_area') {
		pageURL = CONTEXT_PATH + '/declined/sub/regenerationNewdealAreaPage';
		owsLayerInfo = layer_info.regeneration_newdeal_area;
		storyType  = 'regeneration_newdeal_area';
		
		declinedInfo = layer_info.declined_diagnosis;
	} //else if (selectedMenu == 'earthquake_bldg') {
		//pageURL = CONTEXT_PATH + '/declined/sub/regenerationNewdealAreaPage';
		//owsLayerInfo = layer_info.regeneration_newdeal_area;
		//storyType  = 'earthquake_bldg';
	//}
	
	if (pageURL == '') {
		return;
	} else {
		window.history.pushState('', '', CONTEXT_PATH + '/declined/report?story_type=' + selectedMenu);
	}
	
	$.ajax({
		url: pageURL,
		success:function(data) {
			try {
				$('#content').html(data);
				
				if (owsLayerInfo.owsType == 'WMS') {
					
					tiledWMS.set('title', owsLayerInfo.title);
					tiledWMS.getSource().updateParams({
						'LAYERS': owsLayerInfo.layer, 'STYLES': owsLayerInfo.style
					});
					
					sidoNm == '' ? tiledWMS.setVisible(false) : tiledWMS.setVisible(true);
					sidoNm == '' ? boundaryVector.setVisible(true) : boundaryVector.setVisible(false);
					
					if (dataVector != undefined) {
						dataVector.setVisible(false);
					}
					
					$('.mapLegend > .card-body').empty();
					$('.mapLegend > .card-body').append('<img src="'
						+ GISSERVER_URL
						+ '?service=WMS&request=GetLegendGraphic&format=image%2Fpng&width=20&height=20&layer='
						+ owsLayerInfo.layer
						+ '&style='
						+ owsLayerInfo.style
						+ '&LEGEND_OPTIONS=forceLabels:on'
						+ '" />');
					$('.mapLegend').show();
		
				} else if (owsLayerInfo.owsType == 'WFS') {
					$('.mapLegend > .card-body').empty();
					$('.mapLegend').hide();
					
					boundaryVector.setVisible(false);
					tiledWMS.setVisible(false);
					
					//현행 도시재생뉴딜 시범사업지구와의 비교에서 쇠퇴지역 격자 표현을 위하여 추가
					if(owsLayerInfo.layer == 'regeneration_newdeal_area'){
						tiledWMS.set('title', declinedInfo.title);
						tiledWMS.getSource().updateParams({
							'LAYERS': declinedInfo.layer, 'STYLES': declinedInfo.style
						});
						
						sidoNm == '' ? tiledWMS.setVisible(false) : tiledWMS.setVisible(true);
						sidoNm == '' ? boundaryVector.setVisible(true) : boundaryVector.setVisible(false);
						
						//if (dataVector != undefined) {
						//	dataVector.setVisible(false);
						//}
						
						$('.mapLegend > .card-body').empty();
						$('.mapLegend > .card-body').append('<img src="'
							+ GISSERVER_URL
							+ '?service=WMS&request=GetLegendGraphic&format=image%2Fpng&width=20&height=20&layer='
							+ declinedInfo.layer
							+ '&style='
							+ declinedInfo.style
							+ '&LEGEND_OPTIONS=forceLabels:on'
							+ '" />');
						$('.mapLegend').show();
					}
				}
				
			} catch (e) {
				console.log(e);
				alert('문제가 발생하였습니다. 페이지를 다시 로드해주세요.')
			}
		}
	});
}

// 리포트 메뉴 클릭시 이벤트
$('.dmr-menubar button').on('click', function(e) {
	onSelectedMenuFnc($(this));
});

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

// 시도 선택시 위치 이동
$('#mapBndSidoSelect').on('change', function(e) {
	GetFunctionLog('sei', '우리 동네 내진설계 건물현황', '시도별 내진설계 정보 조회', '총 건축물 수,내진설계 건축물 비율,내진설계 건축물 수,내진설계 미대상 건축물 수,내진설계 판정불가 건축물 수,총 인구 수');
	
	sidoCd = e.target.value;
	sidoNm = $('#mapBndSidoSelect :selected').text();
	
	if (highlightOverlay != null) {
		if (highlightOverlay.getSource().getFeatures().length > 0) {
			highlightOverlay.getSource().clear();
		}
	}
	
	if (sidoNm == '전국') {
		boundarySelectOn();
		gridIdentifyUn();
		map.getView().fit(boundaryVector.getSource().getExtent(), map.getSize());
		tiledWMS.setVisible(false);
		boundaryVector.setVisible(true);
		
		boundaryRaster.getSource().updateParams({
			'cql_filter':  null
		});
		boundaryRaster.setVisible(false);

	} else {
		boundarySelectUn();
		gridIdentifyOn();
		var features = boundaryVector.getSource().getFeatures();
		for (i = 0; i < features.length; i++) {
			//if (features[i].getProperties().sido_nm == sidoNm) {
			if (features[i].getProperties().ctp_kor_nm == sidoNm) {
				map.getView().fit(features[i].getGeometry().getExtent(), map.getSize());
				boundaryVector.setVisible(false);
				
				boundaryRaster.getSource().updateParams({
					'cql_filter':  "ctp_kor_nm = '"+ sidoNm +"'"
				});
				boundaryRaster.setVisible(true);
				
				tiledWMS.setVisible(true);
				
				if (storyType != 'earthquake_bldg') {
					tiledWMS.getSource().updateParams({
						'cql_filter':  "sido_nm = '"+ sidoNm +"'"
					});
				} else {
					tiledWMS.getSource().updateParams({
						'cql_filter':  "sd_kor_nmf = '"+ sidoNm +"'"
					});
				}
				
				
				break;
			}
		}
	}
	
	if (storyType == 'regeneration_newdeal_area') {
		//현행 도시재생뉴딜 시범사업지구와의 비교에서 쇠퇴지역 격자 표현을 위하여 주석처리
		//boundaryVector.setVisible(false);
		//tiledWMS.setVisible(false);
	}
	
//	if (overlay != null) {
//		overlay.setPosition(undefined);
//		closer.blur();
//	}
	
	
	if (storyType == 'grid_pop_stats') {
		
		if (storyTypeSub == 'grid_pop_stats_1') {
			if ( $('#myChart1').length > 0 ) {
				chart.destroy();
			}
			
			if (sidoNm == '전국') {
				makePopChart();
			} else {
				makePopChart(sidoNm);
			}
		} else if (storyTypeSub == 'grid_pop_stats_2') {
			showChart('', sidoNm, [], ['popChng', 'popOldR'], ['인구변화율', '고령인구비율'], '인구통계', true);
			
		} else if (storyTypeSub == 'grid_pop_stats_3') {			
			showChart('', sidoNm, [], ['popChng', 'popOldR'], ['인구변화율', '고령인구비율'], '인구통계', true);
		}

	} else if (storyType == 'grid_bldg_stats') {
		
		showChart('', sidoNm, [], ['resiRate', 'avgArchA', 'bldOldR'], 
				['주거용건물비율', '평균건물면적', '노후건축물비율'], '건물통계', true);
		
		if (storyTypeSub == 'grid_bldg_stats_1') {
		} else if (storyTypeSub == 'grid_bldg_stats_2') {
		} else if (storyTypeSub == 'grid_bldg_stats_3') {
		}

	} else if (storyType == 'demographic_diagnosis') {
		
		showChart2('demographicArea.json', '인구 쇠퇴 지역 면적 비율', 'demographic_per');
		showChart('', sidoNm, [], ['popChng', 'popOldR'], ['인구변화율', '고령인구비율'], '인구통계', true);	
		
	} else if (storyType == 'physical_diagnosis') {
		
		showChart2('physicalArea.json', '건물 노후 지역 면적 비율', 'physical_per');
		showChart('', sidoNm, [], ['avgArchA', 'bldOldR'], 
				['평균건물면적', '노후건축물비율'], '건물 노후 지역 통계', true);
		
	} else if (storyType == 'declined_diagnosis') {
		
		showDeclinedChart(sidoNm);
		
	} else if (storyType == 'regeneration_newdeal_area') {
		
	} else if (storyType == 'earthquake_bldg') { //시도별 내진설계 건축물 비율 통계
		
		$('#seismicGridStatus').hide();
		
		if(sidoNm == '전국'){
			$('#seismicSidoStatus .currentSidoName').html('-');
			var tbody = $('#seismicSidoStatus .resultSidoStats');
			tbody.empty();
			
			$('#seismicSidoStatus').hide();
			$('#seismicChartStatus').hide();			
			return;
		}
		
		// 선택 시군구 통계
		$.ajax({
			url: CONTEXT_PATH + '/api/seismic/sidoStats.json',
			method: 'get',
			data: {
				sidoNm: sidoNm
			},
			success:function(res) {
				try {
					
					if(res.data.length < 1)
						return;
					
					var seismicStat;
					var seismicTotalStat;
					
					for(var i = 0; i < res.data.length; i++){
						if(res.data[i].sd_kor_nmf == '전국')
							seismicTotalStat = res.data[i];
						else
							seismicStat = res.data[i];
					}
					
					$('#seismicSidoStatus .currentSidoName').html(seismicStat.sd_kor_nmf);
					$('#seismicSidoStatus .resultSidoStats').empty();
					
					var tbody = $('#seismicSidoStatus .resultSidoStats');
					tbody.empty();

					tbody.append(
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">총 건축물 수</span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(seismicStat.arc_all) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 건축물 비율	<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-arr2-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numeral(seismicStat.seism_arr2).format('0.00') +'%</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 건축물 수	<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-arc-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(seismicStat.seism_arc) +'</span></th>'+
						'</tr>'+
							'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 미대상 건축물 수<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-n-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(seismicStat.seism_n) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 판정불가 건축물 수<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-null-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(seismicStat.seism_null) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">총 인구 수	</span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(seismicStat.population) +'</span></th>'+
						'</tr>'
					);
					
					$('#seismicSidoStatus').show();
					
					//내진설계 건축물 차트
					var chartData = {
						datasets: [{
							data: [
								seismicTotalStat.seism_arr2
							],
							backgroundColor: [
								window.chartColors.green, '#f8f9fa'
							],
							hoverBackgroundColor: [
								window.chartColors.green, '#f8f9fa'
						    ]
						}, {
							data: [
								seismicStat.seism_arr2
							],
							backgroundColor: [
								window.chartColors.blue, '#f8f9fa'
							],
							hoverBackgroundColor: [
								window.chartColors.blue, '#f8f9fa'
						    ]
						}]
					};
					
					if (seismicStatusChart != null) {
						seismicStatusChart.destroy();
					}
					
					seismicStatusChart = new Chart(document.getElementById("seismicChartStatus.chart"), {
						type: 'horizontalBar',
						data: chartData,
						options: {
							title: {
								display: true
							},
							legend: {
								display: false
							},
							tooltips: {
								enabled: true,
								callbacks: {
									label: function(item, data) {
										if (item.index == 0) {
											if (item.datasetIndex == 0) {
												return '전국비율 : ' + numeral(data.datasets[item.datasetIndex].data[item.index]).format('0.00') + '%';
											} else if (item.datasetIndex == 1) {
												return '시도비율 : ' + numeral(data.datasets[item.datasetIndex].data[item.index]).format('0.00') + '%';
											} else if (item.datasetIndex == 2) {
												return '선택격자비율 : ' + numeral(data.datasets[item.datasetIndex].data[item.index]).format('0.00') + '%';
											} else {
												return;
											}
										} else {
											return;
										}
									}
								}
							},
							layout: {
								padding: {
								    left: 0, right: 0, top: 0, bottom: 0
								}
					        },
							animation: {
								animateRotate: true,
								animateScale: false
							}
						}
					});
					
					$('#seismicChartStatus').show();
					$('#seismicChartStatus .legend-grid').hide();
					
				} catch(e) {
				}
			}
		});
	}
	
});



$('#mapIdentifyBtn').on('click', function(e){
	$('.mapIdentifyContentArea').toggle();
});

// 페이지 최초 로딩시 이벤트
onSelectedMenuFnc();
boundarySelectOn();

//------------------------------

var chart;
var chart2;
var chart3;
var parser = new ol.format.GeoJSON();
//var container = document.getElementById('popup');
//var content = document.getElementById('popup-content');
//var closer = document.getElementById('popup-closer');

//var overlay = new ol.Overlay({
//	element: container,
//	autoPan: true,
//	autoPanAnimation: {
//		duration: 250
//	}
//});
//map.addOverlay(overlay);

var highlightStyle = new ol.style.Style({
	stroke: new ol.style.Stroke({
		color: '#000000',
		width: 2
	}),
	fill: new ol.style.Fill({
		color: '#756bb1'
	})
});

var highlightOverlay = new ol.layer.Vector({
	style: highlightStyle,
	source: new ol.source.Vector({
		format: new ol.format.GeoJSON()
	}),
	map: map
});

var makePopChart = function(sidoNm) {
	
	var url = '';
	var chartTitle = '';
	
	if (sidoNm != undefined && sidoNm != '' && sidoNm != null && sidoNm != '전국') {
		url = CONTEXT_PATH + '/api/cmpstnPopulation.json?sido_nm=' + sidoNm;
		chartTitle = sidoNm + ' 인구구조 그래프';
	} else {
		url = CONTEXT_PATH + '/api/cmpstnPopulation.json';
		chartTitle = '시도별 인구구조 그래프';
	}
	
	if (chart != null) {
		if (chart.canvas != null) {
			chart.destroy();
		}
	}
	
		
	$.ajax({
		url: url
	}).done(function (jsonData) {
		var jsonData = jsonData.data;
		
		 $('#myChart1')[0].getContext('2d').canvas.height = (jsonData.length*15) + 100;

		var datasets = [];
		var color = Chart.helpers.color;
		var colorNames = Object.keys(window.chartColors);
		var sido = [];
		var a014per = [];
		var a1564per = [];
		var a65200per = [];
		var a0200sum = [];		

		jsonData.forEach(function (d, i) {

			var colorName = colorNames[i % colorNames.length];;
			var dsColor = window.chartColors[colorName];
			
			if (sidoNm != undefined && sidoNm != '' && sidoNm != null) {
				sido.push(d.sgg_nm);
			} else {
				sido.push(d.sido_nm);
			}
			
			a014per.push(numeral(d.a_0_14_per).format('0.00'));
			a1564per.push(numeral(d.a_15_64_per).format('0.00'));
			a65200per.push(numeral(d.a_65_200_per).format('0.00'));
			a0200sum.push(numeral(d.a_0_200_sum).format('0.00'));
		});
		
		for (i=0; i<3; i++) {
			var colorName = colorNames[i % colorNames.length];;
			var dsColor = window.chartColors[colorName];
			var label = '유소년인구비율';
			var tempData = a014per;

			if (i == 1) {
				label = '생산가능인구비율';
				tempData = a1564per;
			} else if (i == 2) {
				label = '고령인구비율';
				tempData = a65200per;
			}
			
			datasets.push({
				label: label,
				backgroundColor: color(dsColor).alpha(0.5).rgbString(),
				borderColor: dsColor,
				data: tempData
			});
		}

		var ctx = document.getElementById('myChart1').getContext('2d');
		chart = new Chart(ctx, {
			// The type of chart we want to create
			type: 'horizontalBar',

			// The data for our dataset
			data: {
				labels: sido,
				datasets: datasets
			},

			// Configuration options go here
			options: {
				title:{
					display:true,
					text: chartTitle
				},
				tooltips: {
					mode: 'index',
					intersect: false
				},
				responsive: false,
				maintainAspectRatio: false,
				scales: {
					xAxes: [{
						stacked: true,
						ticks: {
							min: 0,
							max: 100,
							stepSize: 10
						 },
					}],
					yAxes: [{
						stacked: true
					}]
				},
				legend: {
					position: 'bottom'
				}
			}
		});
	});	 
};


var showChart = function (code, sidoNm, yValue, subject, labels, title, isDestroy) {

	if (sidoNm == '') {
		sidoNm = '전국';
	}
	

	$.ajax({
		url: CONTEXT_PATH + '/api/attributeStats.json'
	}).done(function (jsonData) {
		
		jsonData = jsonData.data;
		
		if (isDestroy && chart != null) {
			if (chart.canvas != null) {
				chart.destroy();
				
				var canvas = $('#myChart1');
				canvas[0].getContext('2d').canvas.height = 250;
			}
		}
		
		if (chart != null && chart.canvas != null) {
			updateChart(sidoNm, code, yValue);
			
		} else {
			
			var datasets = [];
			var color = Chart.helpers.color;
			var colorNames = Object.keys(window.chartColors);

			jsonData.forEach(function (d, i) {
				if (d.sidoNm == '전국' || d.sidoNm == sidoNm) {

					var colorName = colorNames[i % colorNames.length];
					if (d.sidoNm != '전국' && colorName == 'red') {
						colorName = colorNames[(i+1) % colorNames.length];
					}
					
					var dsColor = window.chartColors[colorName];
					var tempData = [];

					subject.forEach(function (sub, index) {
						//tempData.push(d[sub]);
						tempData.push(numeral(d[sub]).format('0.00'));
					});
					
					datasets.push({
						label: d.sidoNm,
						backgroundColor: color(dsColor).alpha(0.5).rgbString(),
						borderColor: dsColor,
						data: tempData
					});
				} else return;
			});

			var colorName = colorNames[datasets.length % colorNames.length];
			var dsColor = window.chartColors[colorName];

			if (datasets.length > 1) {
				if (datasets[1].borderColor == dsColor) {
					colorName = colorNames[(datasets.length+1) % colorNames.length];
					dsColor = window.chartColors[colorName];
				}
			}

			if (code != undefined && code != '' && code != null) {
				datasets.push({
					label: '격자(' + code + ')',
					backgroundColor: color(dsColor).alpha(0.5).rgbString(),
					borderColor: dsColor,
					data: yValue
				});				
			}

			var ctx = document.getElementById('myChart1').getContext('2d');
			chart = new Chart(ctx, {
				// The type of chart we want to create
				type: 'horizontalBar',

				// The data for our dataset
				data: {
					labels: labels,
					datasets: datasets
				},

				// Configuration options go here
				options: {
					title: {
						display: true,
						text: title
					},
					legend: {
						position: 'bottom'
					}
				}
			});
		}
	});
	
	if (highlightOverlay.getSource().getFeatures().length != 0) {
		var highlightGird = highlightOverlay.getSource().getFeatures()[0];
		selectGrid(highlightGird);
	}
};

var updateChart = function (sidoNm, label, data) {
	
	var updateData = data;
	
	data.forEach(function(d, i) {
		if (d == -9999 || d == 9999 || d == -100) {
			if (chart.data.labels[i] == '인구변화율') {
				updateData[i] = 0;
			}
			
		} else if ( d == -1 ) {
			if (chart.data.labels[i] == '고령인구비율' || 
					chart.data.labels[i] == '주거용건물비율' || 
					chart.data.labels[i] == '노후건축물비율') {
				
				updateData[i] = 0;
			}
		}
	});
	
	//현재 차트에 전국단위만 표시
	if (chart.data.datasets.length == 1) {
		
	} else if (chart.data.datasets.length == 2) { //전국, 시도단위
		
		var color = Chart.helpers.color;
		var colorNames = Object.keys(window.chartColors);
		var colorName = colorNames[chart.data.datasets.length % colorNames.length];
		var dsColor = window.chartColors[colorName];
		
		
		if (chart.data.datasets[1].borderColor == dsColor) {
			colorName = colorNames[(chart.data.datasets.length+1) % colorNames.length];
			dsColor = window.chartColors[colorName];
		}
		
		chart.data.datasets.push({
			label: '격자(' + label + ')',
			backgroundColor: color(dsColor).alpha(0.5).rgbString(),
			borderColor: dsColor,
			data: updateData
		});
		
	} else {
		
		var temp = '';
		
		for (let i=0; i<chart.data.datasets.length; i++) {
			temp = chart.data.datasets[i].label;
			if (temp.indexOf('격자') != -1) {
				chart.data.datasets.splice(i, 1);
				
				if (data.length > 0) {
					var color = Chart.helpers.color;
					var colorNames = Object.keys(window.chartColors);
					var colorName = colorNames[chart.data.datasets.length % colorNames.length];;
					var dsColor = window.chartColors[colorName];
					
					if (chart.data.datasets[1].borderColor == dsColor) {
						colorName = colorNames[(chart.data.datasets.length+1) % colorNames.length];
						dsColor = window.chartColors[colorName];
					}
					
					chart.data.datasets.push({
						label: '격자(' + label + ')',
						backgroundColor: color(dsColor).alpha(0.5).rgbString(),
						borderColor: dsColor,
						data: updateData
					});				
				}
			}
		}		
	}
	
	chart.update();
};


var showChart2 = function(optionUrl, title, subject) {
	
	var url = CONTEXT_PATH + '/api/' + optionUrl;
	var area = 'sido_nm';
	var chartTitle = '';

	if (sidoNm != '전국' && sidoNm != '') {
		url += '?sido_nm=' + sidoNm;
		area = 'sgg_nm';
		chartTitle = sidoNm + ' ' + title;
	} else {
		chartTitle = '전국 시도별 ' + title;
	}
	
	if (chart2 != null) {
		if (chart2.canvas != null) {
			chart2.destroy();
			$('#myChart2')[0].getContext('2d').canvas.height = 250;
		}
	}
	
	$.ajax({
		url: url  
	}).done(function (jsonData) {
		jsonData = jsonData.data;
		var labels = [];
		var data = [];
		var color = Chart.helpers.color;
		
		jsonData.forEach(function (d, i) {
			labels.push(d[area]);
			data.push(numeral(d[subject]).format('0.00'));
		});
		
		$('#myChart2')[0].getContext('2d').canvas.height = (jsonData.length*15) + 100;
		
		var barChartData = {
			labels: labels,
			datasets: [{
				label: '면적 비율',
				backgroundColor: color(window.chartColors.blue).alpha(0.5).rgbString(),
				borderColor: window.chartColors.blue,
				borderWidth: 1,
				data: data
			}]
		};
		
		
		var ctx = document.getElementById("myChart2").getContext("2d");
		chart2 = new Chart(ctx, {
			type: 'horizontalBar',
			data: barChartData,
			options: {
				responsive: false,
				maintainAspectRatio: false,
				legend: {
					display: false,
				},
				title: {
					display: true,
					text: chartTitle
				},
				scales: {
					xAxes: [{
						ticks: {
							autoSkip: false,
							minRotation: 90
						}
					}]
				}
			}
		});
		
	});
}

var showDeclinedChart = function(sidoNm) {
	
	var url = CONTEXT_PATH + '/api/declinedArea.json';
	var subject = 'sido_nm';
	var title = '시도별 쇠퇴지역 비율';
	
	if (sidoNm != '' && sidoNm != '전국') {
		url = url + '?sido_nm=' + sidoNm;
		subject = 'sgg_nm';
		title = sidoNm + ' 쇠퇴지역 비율';
	}
	
	if (chart2 != null) {
		if (chart2.canvas != null) {
			chart2.destroy();
			$('#myChart2')[0].getContext('2d').canvas.height = 250;
		}
	} else {
		$('#myChart2')[0].getContext('2d').canvas.height = 250;
	}
	
	
	$.ajax({
		url: url
	}).done(function (jsonData) {
		jsonData = jsonData.data;
		var labels = [];
		var data = [];
		var color = Chart.helpers.color;
		
		var maxValue = 0;
		jsonData.forEach(function (d, i) {
			labels.push(d[subject]);
			data.push(numeral(d.declined_per).format('0.00'));
			maxValue = d.declined_per > maxValue ? d.declined_per : maxValue;
		});
		
		$('#myChart2')[0].getContext('2d').canvas.height = (jsonData.length*15) + 100;
		
		var barChartData = {
			labels: labels,
			datasets: [{
				label: '면적 비율',
				backgroundColor: color(window.chartColors.blue).alpha(0.5).rgbString(),
				borderColor: window.chartColors.blue,
				borderWidth: 1,
				data: data
			}]
		};
		
		var ctx = document.getElementById("myChart2").getContext("2d");
		
		chart2 = new Chart(ctx, {
			type: 'horizontalBar',
			data: barChartData,
			options: {
				responsive: false,
				maintainAspectRatio: false,
				legend: {
					display: false,
				},
				title: {
					display: true,
					text: title
				},
				scales: {
					xAxes: [{
						ticks: {
							autoSkip: false,
							minRotation: 90
						}
					}],
					yAxes: [{
						stacked: true,
						ticks: {
							min: 0,
							max: Math.round(maxValue) + 1,
							stepSize: 1
						 },
					}]
				}
			}
		});
		
	});
}


/**
 * 격자 정보보기 클릭 이벤트
 */
var identifyEvt = function(evt) {

	var view = map.getView();
	var viewResolution = view.getResolution();
	var source = tiledWMS.getSource();
	var url = source.getGetFeatureInfoUrl(
		evt.coordinate, viewResolution, view.getProjection(),
		{'INFO_FORMAT': 'application/json'});
	
	$.ajax({
		url: PROXY_URL + url	
	}).done(function (jsonData) {
		
		if (jsonData.features.length > 0) {
			if (sidoNm != '전국' && sidoNm != '') {
				var feature = jsonData.features[0].properties;
				updateGridChart(feature);
				
				selectGrid(parser.readFeature(jsonData.features[0]));
				
				//var coordinate = evt.coordinate;
				//시도별 내진설계 건축물 비율 통계 중 격자별 정보 가져오기 
				if(storyType == 'earthquake_bldg'){
					$('#seismicGridStatus .currentGridName').html(feature.sd_kor_nmf + ' ' + feature.sig_kor_nm + '(' + feature.grid_id + ')');
					$('#seismicGridStatus .resultGridStats').empty();
					
					var tbody = $('#seismicGridStatus .resultGridStats');
					tbody.empty();

					tbody.append(
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">총 건축물 수</span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(numeral(feature.arc_all).format('0,0')) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 건축물 비율	<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-arr2-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numeral(feature.seism_arr2).format('0.00') +'%</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 건축물 수	<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-arc-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(numeral(feature.seism_arc).format('0,0')) +'</span></th>'+
						'</tr>'+
							'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 미대상 건축물 수<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-n-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(numeral(feature.seism_n).format('0,0')) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">내진설계 판정불가 건축물 수<img src="./img/icon/if_question.png" style="width:15px;height:15px;" data-toggle="modal" data-target="#pg-null-modal"></span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(numeral(feature.seism_null).format('0,0')) +'</span></th>'+
						'</tr>'+
						'<tr>'+
							'<th scope="row" class="text-left"><span class="font-weight-bold">총 인구 수	</span></th>'+
							'<th class="text-right align-middle"><span>'+ numberWithCommas(numeral(feature.population).format('0,0')) +'</span></th>'+
						'</tr>'
					);
					
					$('#seismicGridStatus').show();
					
					if (seismicStatusChart != null) {
						
						// GRID가 추가되어 있는지 확인 후 제거
						if (seismicStatusChart.data.datasets.length > 2) {
							seismicStatusChart.data.datasets.pop();
						}
						
						var gridDataset = {
							data: [
								feature.seism_arr2
							],
							backgroundColor: [
								window.chartColors.orange, window.chartColors.gray
							],
							hoverBackgroundColor: [
								window.chartColors.orange, window.chartColors.gray
						    ]
						};
						
						seismicStatusChart.data.datasets.push(gridDataset);
						seismicStatusChart.update();
					}
					
					$('#seismicChartStatus').show();
					$('#seismicChartStatus .legend-grid').show();
				}
				else{
					updatePopup(feature);
					$('.mapIdentifyContentArea').show();
				}
				
				//overlay.setPosition(coordinate);
			} 
				
		} else {
			//updateGridChart(null);
			selectGrid(null);
			
			if(storyType == 'earthquake_bldg'){
				$('#seismicGridStatus').hide();
				//$('#seismicChartStatus').hide();
				if (seismicStatusChart != null) {
					// GRID가 추가되어 있는지 확인 후 제거
					if (seismicStatusChart.data.datasets.length > 2) {
						seismicStatusChart.data.datasets.pop();
						seismicStatusChart.update();
						$('#seismicChartStatus .legend-grid').hide();
					}
				}
			}
			else{
				$('#mapIdentifyContentView').html('<center>정보를 확인할 수 없습니다.</center>');
				$('.mapIdentifyContentArea').hide();
			}
		}
	});
};
function gridIdentifyOn() {
	map.on('click', identifyEvt);
}
function gridIdentifyUn() {
	map.un('click', identifyEvt);
}


var updatePopup = function(feature) {
	
	if (feature.pop_chng == -9999 || feature.pop_chng == 9999 || feature.pop_chng == -100) {
		feature.pop_chng = '인구 없음';
	} else {
		feature.pop_chng = numeral(feature.pop_chng).format('0.00');
	}
	
	if (feature.pop_old_r == -1) {
		feature.pop_old_r = '인구 없음';
	} else {
		feature.pop_old_r = numeral(feature.pop_old_r).format('0.00');
	}
	
	if (feature.resi_rate == -1) {
		feature.resi_rate = '건물 없음';
	} else {
		feature.resi_rate = numeral(feature.resi_rate).format('0.00');
	}
	
	if (feature.bld_old_r == -1) {
		feature.bld_old_r = '건물 없음';
	} else {
		feature.bld_old_r = numeral(feature.bld_old_r).format('0.00');
	}
	
	if (feature.res_buld_r == -1) {
		feature.res_buld_r = '건축물 없음';
	} else {
		feature.res_buld_r = numeral(feature.res_buld_r).format('0.00');
	}
	
	if (feature.nres_bld_r == -1) {
		feature.nres_bld_r = '건축물 없음';
	} else {
		feature.nres_bld_r = numeral(feature.nres_bld_r).format('0.00');
	}
	
	if (feature.res_null_r == -1) {
		feature.res_null_r = '건축물 없음';
	} else {
		feature.res_null_r = numeral(feature.res_null_r).format('0.00');
	}
	
	if (feature.o_hous_r == -1) {
		feature.o_hous_r = '건축물 없음';
	} else {
		feature.o_hous_r = numeral(feature.o_hous_r).format('0.00');
	}
	
	var table = '<table class="table table-sm table-bordered">'
		+ '<thead class="thead-inverse">'
		+ '<tr><th colspan="2" style="text-align: center;">'+ feature.spo_no_cd + ' (' + feature.sido_nm + ' ' + feature.sgg_nm + ')</th></thead>'
		+ '<tbody>'
		+ '<tr><td>전체 인구 (2017)</td>'
		+ '<td width="52">' + numeral(feature.a_0_200).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>0-14세 인구 (2017)</td>'
		+ '<td>' + numeral(feature.a_0_14).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>15-64세 인구 (2017)</td>'
		+ '<td>' + numeral(feature.a_15_64).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>65-200세 인구 (2017)</td>'
		+ '<td>' + numeral(feature.a_65_200).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>노령인구 비율 (2017)</td>'
		+ '<td>' + numeral(feature.pop_old_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>전체 건물 수</td>'
		+ '<td>' + numeral(feature.tot_cnt).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>노후 건물 수</td>'
		+ '<td>' + numeral(feature.o_cnt).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>노후 건축물 비율</td>'
		+ '<td>' + numeral(feature.bld_old_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>평균 건물면적</td>'
		+ '<td>' + numeral(feature.avg_arch_a).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>전체 인구 (2015)</td>'
		+ '<td>' + numeral(feature.tot_pop).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>인구 변화율 (2015-2017)</td>'
		+ '<td>' + numeral(feature.pop_chng).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>주거용 건물 수</td>'
		+ '<td>' + numeral(feature.resi_bld).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>비 주거용 건물 수</td>'
		+ '<td>' + numeral(feature.non_r_bld).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>주거용 건물 비율</td>'
		+ '<td>' + numeral(feature.resi_rate).format('0.00') + '</td>'
		+ '</tr>'
		+ '</tbody>'
		+ '</table>';
	
	if (storyType == 'earthquake_bldg') {
		table = '<table class="table table-sm table-bordered">'
		+ '<thead class="thead-inverse">'
		+ '<tr><th colspan="2" style="text-align: center;">'+ feature.grid_id + ' (' + feature.sd_kor_nmf + ' ' + feature.sig_kor_nm + ')</th></thead>'
		+ '<tbody>'
		+ '<tr><td>내진설계 건축물 수</td>'
		+ '<td width="52">' + numeral(feature.res_buld).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>내진설계 미대상 건축물 수</td>'
		+ '<td>' + numeral(feature.nres_buld).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>내진설계 건축물 비율</td>'
		+ '<td>' + numeral(feature.res_buld_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>내진설계 미대상 건축물 비율</td>'
		+ '<td>' + numeral(feature.nres_bld_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>내진설계 판정불가 건축물 수</td>'
		+ '<td>' + numeral(feature.res_null).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>내진설계 판정불가 건축물 비율</td>'
		+ '<td>' + numeral(feature.res_null_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '<tr><td>전체 주택 수</td>'
		+ '<td>' + numeral(feature.tot_hous).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>노후 주택 수</td>'
		+ '<td>' + numeral(feature.old_hous).format('0,0') + '</td>'
		+ '</tr>'
		+ '<tr><td>노후 주택 비율</td>'
		+ '<td>' + numeral(feature.o_hous_r).format('0.00') + '</td>'
		+ '</tr>'
		+ '</tbody>'
		+ '</table>';
	}

	$('#mapIdentifyContentView').html(table);
};

var selectGrid = function(feature) {
	highlightOverlay.getSource().clear();
	if (feature != null) {
		highlightOverlay.getSource().addFeature(feature);
	}
};


/**
 * 격자 클릭 시 실행
 */
var updateGridChart = function(feature) {
	
	var spo = feature.spo_no_cd;
	var spoSido = feature.sido_nm;
	var yValue = [];
	
	if (storyType == 'grid_pop_stats') {
		yValue = [numeral(feature.pop_chng).format('0.00'), numeral(feature.pop_old_r).format('0.00')];
		
		if (storyTypeSub == 'grid_pop_stats_1') {

		} else if (storyTypeSub == 'grid_pop_stats_2') {
			updateChart(spoSido, spo, yValue);
			
		} else if (storyTypeSub == 'grid_pop_stats_3') {
			updateChart(spoSido, spo, yValue);
		}

	} else if (storyType == 'grid_bldg_stats') {
		
		//showChart('', sidoNm, [], ['resiRate', 'avgArchA', 'bldOldR'], 
		//		['주거용건물비율', '평균건물면적', '노후건축물비율'], '건물통계', true);
		
		yValue = [numeral(feature.resi_rate).format('0.00'), 
				numeral(feature.avg_arch_a).format('0.00'), numeral(feature.bld_old_r).format('0.00')];
		
		
		if (storyTypeSub == 'grid_bldg_stats_1') {
			updateChart(spoSido, spo, yValue);
		} else if (storyTypeSub == 'grid_bldg_stats_2') {
			updateChart(spoSido, spo, yValue);
		} else if (storyTypeSub == 'grid_bldg_stats_3') {
			updateChart(spoSido, spo, yValue);
		}

	} else if (storyType == 'demographic_diagnosis') {
		//차트 업데이트 및 통계 테이블 업데이트
		yValue = [numeral(feature.pop_chng).format('0.00'), numeral(feature.pop_old_r).format('0.00')];
		updateChart(spoSido, spo, yValue);
		updateTable(feature);
		
	} else if (storyType == 'physical_diagnosis') {
		//차트 업데이트 및 통계 테이블 업데이트		
		yValue = [numeral(feature.avg_arch_a).format('0.00'), numeral(feature.bld_old_r).format('0.00')];
		updateChart(spoSido, spo, yValue);
		updateTable(feature);
		
	} else if (storyType == 'declined_diagnosis') {
		updateTable(feature);
		
	} else if (storyType == 'regeneration_newdeal_area') {
	} else if (storyType == 'earthquake_bldg') {
	}
}

var updateTable = function(feature) {
	
	var spo = feature.spo_no_cd;
	var bldOldR = numeral(feature.bld_old_r).format('0.00');
	var avgArchA = numeral(feature.avg_arch_a).format('0.00');
	var popOldR = numeral(feature.pop_old_r).format('0.00'); 
	var popChng = numeral(feature.pop_chng).format('0.00');
	
	$('#table-spo').html(spo);
	$('#table-bldOldR').html(bldOldR);
	$('#table-avgArchA').html(avgArchA);
	$('#table-popOldR').html(popOldR);
	$('#table-popChng').html(popChng);
	
};

//closer.onclick = function() {
//	overlay.setPosition(undefined);
//	closer.blur();
//	return false;
//};