Unemployment rate in Poland

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<script type="text/javascript" src="https://d3js.org/d3.v3.js"></script>
	<link rel="stylesheet" type="text/css" href="main.css">
	<title>Unemployment Rate in Poland</title>
</head>

<body>
<div id="wrapper">
	
		
		<div class="text">
			<h1>Unemployment Rate in Poland - 2010-2014</h1>
		</div>

<div class="text">
			<p>
			This chart shows monthly average of unemployment rate in Poiland.
			</p>

<p>
			<strong>Data description</strong><br />
				The Unemployment - LFS adjusted seriesis a collection of monthly, quarterly and annual series based on the quarterly results of the EU Labour Force Survey (EU-LFS).<br /><br />
				<strong>Statistical concepts and definitions</strong><br />
				<strong>Unemployed persons</strong> are all persons 15 to 74 years of age who were not employed during the reference week, had actively sought work during the past four weeks and were ready to begin working immediately or within two weeks.	The <strong>unemployment rate</strong> is the number of people unemployed as a percentage of the labour force. The labour force is the total number of people employed and unemployed.
			</p>
			<p>
				Data source: <a href="https://ec.europa.eu/eurostat/data/database" target="	_blank">Eurostat</a>
			</p>
		</div>
		
	<script type="text/javascript">

var w = 800;
			var h = 600;
			var padding = [20, 30, 45, 50];

d3.select("div", "#wrapper")
				.append("div")
				.attr("id", "col");

var svg = d3.select("#col")
				.append("svg")
				.attr("width", w)
				.attr("height", h);

var dateFormat = d3.time.format("%m-%Y");

var xScale = d3.time.scale()
								.range([ padding[3], w - padding[1] - padding[3] ]);
			
			var yScale = d3.scale.linear()
								.range([ padding[0], h - padding[2] ]);

var xAxis = d3.svg.axis()
							.scale(xScale)
							.orient("bottom")
							.ticks(10)
							.tickFormat(function(d) {
								return dateFormat(d);
							});

var yAxis = d3.svg.axis()
							.scale(yScale)
							.orient("left")
							.tickFormat(function(d) {
								return d + "%";
							});

var line = d3.svg.line()
				.x(function(d) {
					return xScale(dateFormat.parse(d.date));
				})
				.y(function(d) {
					return yScale(d.total);
				});
			
			d3.csv("une_rt_pl.csv", function(data) {

xScale.domain([ 
					d3.min(data, function(d) {
						return dateFormat.parse(d.date);
					}),
					d3.max(data, function(d) {
						return dateFormat.parse(d.date);
					})
				]);

yScale.domain([ 
					d3.max(data, function(d) {
						return +d.total;
					}),
					0
				]);

svg.data([ data ])
					.append("path")
					.attr("class", "line total")
					.attr("d", line)
					.attr("fill", "none")
					.attr("stroke", "red")
					.attr("stroke-width", 2);

svg.append("g")
					.attr("class", "x axis")
					.attr("transform", "translate(0," + (h - padding[2] + 10) + ")")
					.call(xAxis);

svg.append("g")
					.attr("class", "y axis")
					.attr("transform", "translate(" + (padding[3] - 10) + ",0)")
					.call(yAxis);

});

</script>

</div>
</body>
</html>

Modified http://d3js.org/d3.v3.js to a secure url

https://d3js.org/d3.v3.js