finished

app.js

@@ -2,23 +2,21 @@ const width = 960;
 const height = 490;
 
 d3.select('svg')
-    .attr('width', width)
-    .attr('height', height);
+	.attr('width', width)
+	.attr('height', height);
 
 const worldProjection = d3.geoEquirectangular();
+const dAttributeFunction = d3.geoPath()
+	.projection(worldProjection);
 
 d3.select('svg').selectAll('path')
-    .data(map_json.features)
+	.data(map_json.features)
 	.enter()
-    .append('path')
-    .attr('fill', '#099');
-
-const dAttributeFunction = d3.geoPath()
-    .projection(worldProjection);
-
-d3.selectAll('path').attr('d', dAttributeFunction);
+	.append('path')
+	.attr('fill', '#099')
+	.attr('d', dAttributeFunction);
 
-const dragBehavior = d3.drag() //create a drag behavior
+const dragBehavior = d3.drag()
 	.on('start', (event) => {
 		d3.select('table tr:nth-child(2) td:first-child')
 			.html(worldProjection.invert([event.x, event.y])[0])
@@ -47,14 +45,14 @@ d3.select('form').on('submit', (event) => {
 
 	d3.selectAll('rect').remove();
 
-	const lat1 = d3.select('input:first-child').node().value
-	const lng1 = d3.select('input:nth-child(2)').node().value
+	const lat1 = d3.select('input:first-child').property('value');
+	const lng1 = d3.select('input:nth-child(2)').property('value');
 	const location1 = worldProjection([lat1, lng1]);
 	const x1 = location1[0];
 	const y1 = location1[1];
 
-	const lat2 = d3.select('input:nth-child(4)').node().value
-	const lng2 = d3.select('input:nth-child(5)').node().value
+	const lat2 = d3.select('input:nth-child(4)').property('value');
+	const lng2 = d3.select('input:nth-child(5)').property('value');
 	const location2 = worldProjection([lat2, lng2]);
 	const x2 = location2[0];
 	const y2 = location2[1];