var monat = ["2009-4","2009-5","2009-6","2009-7","2009-8","2009-9","2009-10","2009-11","2009-12","2010-1","2010-2","2010-3","2010-4","2010-5","2010-6","2010-7","2010-8","2010-9","2010-10","2010-11","2010-12","2011-1","2011-2","2011-3","2011-4","2011-5","2011-6","2011-7","2011-8","2011-9","2011-10","2011-11","2011-12","2012-1","2012-2","2012-3","2012-4","2012-5","2012-6","2012-7","2012-8","2012-9","2012-10","2012-11","2012-12","2013-1","2013-2","2013-3","2013-4","2013-5","2013-6","2013-7","2013-8","2013-9","2013-10","2013-11","2013-12","2014-1","2014-2","2014-3","2014-4","2014-5","2014-6","2014-7","2014-8","2014-9","2014-10","2014-11","2014-12","2015-1","2015-2","2015-3","2015-4","2015-5","2015-6","2015-7","2015-8","2015-9","2015-10","2015-11","2015-12","2016-1","2016-2","2016-3","2016-4","2016-5","2016-6","2016-7","2016-8","2016-9","2016-10","2016-11","2016-12","2017-1","2017-2","2017-3","2017-4","2017-5","2017-6","2017-7","2017-8","2017-9","2017-10","2017-11","2017-12","2018-1","2018-2","2018-3","2018-4","2018-5","2018-6","2018-7","2018-8","2018-9","2018-10","2018-11","2018-12","2019-1","2019-2","2019-3","2019-4","2019-5","2019-6","2019-7","2019-8","2019-9","2019-10","2019-11","2019-12","2020-1","2020-2","2020-3","2020-4","2020-5","2020-6","2020-7","2020-8","2020-9","2020-10","2020-11","2020-12","2021-1","2021-2","2021-3","2021-4","2021-5","2021-6","2021-7","2021-8","2021-9","2021-10","2021-11","2021-12","2022-1","2022-2","2022-3","2022-4","2022-5","2022-6","2022-7","2022-8","2022-9","2022-10","2022-11","2022-12","2023-1","2023-2","2023-3","2023-4","2023-5","2023-6","2023-7","2023-8","2023-9","2023-10","2023-11","2023-12","2024-1","2024-2","2024-3"];
var einwohner = [9401,9404,9410,9425,9428,9409,9391,9389,9381,9365,9354,9373,9358,9351,9369,9361,9345,9335,9333,9315,9308,9281,9288,9284,9275,9289,9297,9317,9317,9308,9302,9295,9298,9288,9286,9299,9285,9292,9314,9314,9314,9316,9300,9294,9298,9289,9270,9258,9264,9286,9283,9304,9324,9320,9314,9306,9320,9308,9296,9309,9310,9307,9297,9297,9289,9306,9291,9266,9272,9282,9275,9271,9277,9302,9315,9327,9384,9365,9389,9392,9385,9395,9418,9458,9450,9435,9446,9437,9429,9422,9427,9496,9499,9522,9511,9494,9494,9500,9493,9512,9515,9518,9521,9496,9492,9501,9492,9498,9497,9511,9531,9544,9558,9537,9534,9523,9510,9497,9518,9524,9539,9552,9552,9573,9591,9607,9605,9606,9629,9613,9621,9622,9631,9654,9652,9658,9664,9638,9673,9662,9665,9644,9648,9653,9659,9655,9656,9673,9681,9668,9669,9700,9698,9695,9699,9718,9715,9718,9742,9743,9791,9769,9748,9739,9770,9757,9759,9770,9765,9758,9734,9762,9753,9784,9799,9826,9836,9836,9867,9873];
var geboren = [5,6,4,3,6,3,4,4,5,5,3,2,3,3,9,10,4,8,4,2,4,1,6,6,4,3,8,14,6,4,4,4,5,2,3,5,4,6,5,5,1,6,3,5,6,8,6,3,6,6,5,5,8,3,9,7,3,7,5,0,5,3,2,4,6,5,2,3,7,3,3,7,4,5,7,10,4,7,5,4,7,4,10,5,5,1,7,7,6,4,10,9,3,9,5,4,7,7,6,4,7,8,6,5,7,12,7,5,7,6,5,11,9,8,9,7,7,11,6,6,2,6,7,12,12,10,1,6,4,7,9,9,8,4,10,8,10,14,11,9,9,5,5,6,8,2,14,8,9,8,10,7,11,8,9,6,5,3,6,7,18,2,12,5,11,9,8,4,4,5,4,11,15,6,10,11,10,9,11,3];
var gestorben = [-3,-6,-4,-2,-3,-6,-7,-4,-11,-10,-3,-8,-10,-6,-7,-4,-9,-8,-9,-10,-4,-7,-4,-4,-7,-5,-6,-5,-6,-8,-6,-10,-5,-10,-3,-8,-6,-5,-7,-4,-8,-5,-8,-9,-9,-15,-8,-10,-8,-7,-3,-5,-8,-4,-8,-4,-6,-5,-7,-3,-9,-7,-12,-9,-10,-5,-9,-4,-7,-7,-12,-10,-7,-3,-7,-8,-6,-8,-4,-5,-5,-7,-4,-5,-7,-9,-3,-8,-6,-10,-10,-9,-4,-7,-7,-14,-12,-5,-7,-9,-7,-7,-7,-10,-7,-11,-4,-7,-4,-9,-4,-4,-7,-6,-8,-6,-7,-10,-6,-9,-11,-5,-9,-11,-9,-17,-7,-7,-4,-8,-3,-10,-7,-9,-3,-8,-4,-13,-4,-13,-17,-11,-10,-16,-7,-12,-12,-9,-6,-7,-5,-15,-12,-14,-7,-10,-14,-12,-5,-9,-14,-6,-14,-15,-10,-12,-11,-11,-10,-7,-15,-9,-15,-8,-7,-13,-4,-11,-15,-3];
var zuzug = [44,30,50,43,47,53,40,44,34,41,22,51,27,34,47,36,37,49,49,30,25,35,42,38,28,49,47,39,35,50,55,33,42,36,48,33,43,42,72,59,48,56,47,44,40,56,33,27,42,53,39,59,55,65,46,25,37,51,42,43,53,39,54,52,47,57,45,24,29,65,46,67,52,54,58,66,116,61,91,59,47,62,59,90,44,48,58,31,42,60,68,121,55,75,42,63,60,55,41,70,53,50,64,39,40,74,48,49,51,65,61,51,61,31,64,51,56,60,72,52,58,47,46,79,47,66,48,61,57,31,37,33,34,67,48,64,46,40,76,44,40,40,47,65,33,52,48,61,60,48,40,89,36,49,44,80,79,86,86,52,92,28,37,71,76,62,56,64,41,48,52,82,46,97,77,79,55,64,90,45];
var wegzug = [-50,-27,-44,-29,-47,-69,-55,-46,-36,-52,-33,-26,-35,-38,-31,-50,-48,-59,-46,-40,-32,-56,-37,-44,-34,-33,-41,-28,-35,-55,-59,-34,-39,-38,-50,-17,-55,-36,-48,-60,-41,-55,-58,-46,-33,-58,-50,-32,-34,-30,-44,-38,-35,-68,-53,-36,-20,-65,-52,-27,-48,-38,-54,-47,-51,-40,-53,-48,-23,-51,-44,-68,-43,-31,-45,-56,-57,-79,-68,-55,-56,-49,-42,-50,-50,-55,-51,-39,-50,-61,-63,-52,-51,-54,-51,-70,-55,-51,-47,-46,-50,-48,-60,-59,-44,-66,-60,-41,-55,-48,-42,-45,-49,-54,-68,-63,-69,-74,-51,-43,-34,-35,-44,-59,-32,-43,-44,-59,-34,-46,-35,-31,-26,-39,-57,-58,-46,-67,-48,-51,-29,-55,-38,-50,-28,-46,-49,-43,-55,-62,-44,-50,-37,-46,-42,-57,-73,-74,-63,-49,-48,-46,-56,-70,-46,-72,-51,-46,-40,-53,-65,-56,-55,-64,-65,-50,-49,-64,-55,-39];
var ChartData = {
	labels: monat,
	datasets: [{
		type: 'line',
		fill: false,
		label: 'Einwohner',
		yAxisID: 'Einwohner',
		backgroundColor: 'rgba(0,0,0,1)',
		borderColor: 'rgba(0,0,0,1)',
		borderWidth: 5,
		data: einwohner
	}, {
		type: 'line',
		fill: true,
		stacked: true,
		label: 'Zuzüge',
		yAxisID: 'Bewegungen',
		backgroundColor: 'rgba(0,150,0,0.2)',
		borderColor: 'rgba(0,150,0,1)',
		borderWidth: 1,
		data: zuzug
	}, {
		type: 'line',
		fill: true,
		stacked: true,
		label: 'Wegzüge',
		yAxisID: 'Bewegungen',
		backgroundColor: 'rgba(150,0,0,0.2)',
		borderColor: 'rgba(150,0,0,1)',
		borderWidth: 1,
		data: wegzug
	}, {
		type: 'line',
		fill: true,
		stacked: true,
		label: 'Geburten',
		yAxisID: 'Bewegungen',
		backgroundColor: 'rgba(100,200,100,0.2)',
		borderColor: 'rgba(100,200,100,1)',
		borderWidth: 1,
		borderDash: [4, 4],
		data: geboren
	}, {
		type: 'line',
		fill: true,
		stacked: true,
		label: 'Todesfälle',
		yAxisID: 'Bewegungen',
		backgroundColor: 'rgba(250,50,50,0.2)',
		borderColor: 'rgba(250,50,50,1)',
		borderWidth: 1,
		borderDash: [4, 4],
		data: gestorben
	}]
};
var ChartOptions = {
	title: {
		display: true,
		text: 'Einwohnerzahlen mit Bewegungsdetails'
	},
	tooltips: {
		mode: 'label',
		backgroundColor: 'rgba(50,50,50,0.75)',

			callbacks: {
				// Use the footer callback to display the sum of the items showing in the tooltip
				footer: function(tooltipItems, data) {
					var sum = 0;

					tooltipItems.forEach(function(tooltipItem) {
						//alert(data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index]);
						if (data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index] < 1000) { //nicht die Einwohnerzahlen
							sum += data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];
						}
					});
					return 'Änderung: ' + sum;
				},
			},
			footerFontStyle: 'normal'
		
	},
	legend: {
		position: 'bottom'
	},
	responsive: true,
	pan: {
		enabled: true,
		mode: 'xy'
	},
	zoom: {
		enabled: true,
		mode: 'xy'
	},
	scales: {
		xAxes: [{
			display: true
		}],
		yAxes: [{
			type: 'linear',
			display: true,
			position: 'left',
			id: 'Einwohner',
			gridLines: {
				drawOnChartArea: false
			},
			scaleLabel: {
				display: true,
				labelString: 'Einwohner'
			}
		}, {
			type: 'linear',
			display: true,
			stacked: true,
			position: 'right',
			id: 'Bewegungen',
			gridLines: {
				drawOnChartArea: true
			},
			scaleLabel: {
				display: true,
				labelString: 'Bewegungen'
			}
		}]
	}
};
var ctx = document.getElementById('mycanvas-einwohner-slider').getContext('2d');
		var rs = new RangeSliderChart({
			chartData: ChartData,
			chartOpts: ChartOptions,
			chartType: 'line',
			chartCTX: ctx,
			class: 'my-chart-ranger',
			initial: [156, 180]
		});