Weapons export worldwide_step4

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Data on weapons exports in the world</title>
		<script type="text/javascript" src="https://d3js.org/d3.v3.js"></script>
		<style type="text/css">
			h1,h2,p {
				font-family:"Helvetica";
			}
			
			.axis path,
			.axis line {
				fill: none;
				stroke: black;
				shape-rendering: crispEdges;
			}
			
			.axis text {
				font-family: sans-serif;
				font-size: 11px;
			}

.y.axis path,
			.y.axis line {
				opacity: 0;
			}
		
		</style>
	
	
	</head>
	<body>
		<h1>Who is exporting weapons worldwide?</h1>
		<h2>Data about weapons exports</h2>
		
		<script type="text/javascript">
		
			//Defines a bunch of variables to be used later in the chart, makes life easier when wanting to change some stuff
			
				//1 width and height of the svg element
			var w = 700;
			var h = 1800;
			
				//2 padding variables, defines various white spaces in the chart
			var padding = [ 20, 10, 30, 120 ];  //Top, right, bottom, left
			
				//3 creates the scale for axis, the scale needs to be created before the axis itself
					//linear scale, basically a scale for continuous numbers,range defines the length of the scale
			var widthScale = d3.scale.linear()
								.range([ 0, w-padding[1]-padding[3]]);
			
			//console.log(widthScale);
			
					//ordinal scale, basically a scale for categories,rangeRoundBands defines the position of the top and bottom cat. of the scale, O.1 the space
			var heightScale = d3.scale.ordinal()
								.rangeRoundBands([ padding[0], h - padding[2]], 0.1);
			
				//4 creates both axis
			var xAxis = d3.svg.axis()
							.scale(widthScale)
							.orient("top");

svg.append("g")
					.attr("class", "y axis")
					.attr("transform", "translate(" + padding[3] + ",0)")
					.call(yAxis);
			});
			/* */
			
			
		</script>

</body>
</html>

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

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