Moved JS to separate file

index.js

@@ -0,0 +1,68 @@
+const svg = d3.select("svg")
+const map1 = new Map();
+
+const color1 = "#75d795"
+const color2 = "#ff7c7c"
+const color3 = "#ffe77c"
+const color4 = "#7c9dff"
+
+// Credit: https://www.artcraftblend.com/blogs/colors/shades-of-pastel
+const colorMap = {
+		"Tamil Nadu": color1,
+		"Kerala": color2,
+		"Karnataka": color3,
+		"Andhra Pradesh": color4,
+		"Maharashtra": color4,
+		"Goa": color2,
+		"Telangana": color2,
+		"Odisha": color3,
+		"Gujarat": color1,
+		"Rajasthan": color3,
+		"Chhattisgarh": color1,
+		"Jharkhand": color2,
+		"West Bengal": color1,
+		"Assam": color2,
+		"Meghalaya": color3,
+		"Tripura": color4,
+		"Mizoram": color1,
+		"Manipur": color3,
+		"Nagaland": color1,
+		"Arunachal Pradesh": color4,
+		"Sikkim": color2,
+		"Bihar": color3,
+		"Madhya Pradesh": color2,
+		"Uttar Pradesh": color4,
+		"Uttarakhand": color2,
+		"Haryana": color1,
+		"Punjab": color4,
+		"Himachal Pradesh": color3,
+		"Ladakh": color1,
+		"Jammu and Kashmir": color2,
+}
+
+const colors9 = ["#75d795", "#EFDFD8", "#D5F6FB", "#E5ECF8", "#F0EBD8", "#F7DFC2", "#B4D9EF", "#F8C57C", "#A4D8D8"]
+
+function drawMap(world) {
+	const projection = d3.geoMercator().fitSize([1000,600], world)
+	const path = d3.geoPath().projection(projection);
+
+	// Draw the map
+	svg.selectAll("path")
+		.data(world.features)
+		.enter()
+		.append("path")
+		.attr("d", path)
+		.attr("class", "state")
+		.attr("fill", d => colorMap[d.properties.name])
+		.append("title") // Tooltip
+		.text(d => d.properties.name)
+		.each(function(d) {
+			map1.set(d.properties.name, d3.geoCentroid(d));
+		})
+
+}
+
+// Load GeoJSON file
+d3.json("india.json").then(drawMap)
+
+console.log(map1)