Renamed colors; added district colors

index.js

@@ -1,65 +1,114 @@
 const svg = d3.select("svg")
-const map1 = new Map();
+const map1 = new Map()
 
-const color1 = "#75d795" // Tamil
+const tamilColor = "#75d795" // Tamil
-const color2 = "#ff7c7c" // Malayalam
+const malayalamColor = "#ff7c7c" // Malayalam
-const color3 = "#ffe77c" // Kannada
+const kannadaColor = "#ffe77c" // Kannada
-const color4 = "#7c9dff" // Telugu
+const teluguColor = "#7c9dff" // Telugu
-const color5 = "#e0ff7c" // Marathi
+const marathiColor = "#e0ff7c" // Marathi
-const color6 = "#9b7cff" // Konkani
+const konkaniColor = "#9b7cff" // Konkani
-const color7 = "#d17cff" // Hindi
+const hindiColor = "#d17cff" // Hindi
-const color8 = "#" // Gujarati
+const gujaratiColor = "#7cffee" // Gujarati
-const color9 = "#" // Marwari
+const marwariColor = "#7bc4c9" // Marwari
-const color10 = "#" // Oriya
+const oriyaColor = "#9bcc9f" // Oriya
-const color11 = "#" // Bengali
+const bengaliColor = "#bf9a77" // Bengali
-const color12 = "#" // Punjabi
+const punjabiColor = "#e84a35" // Punjabi
-const color13 = "#" // Mizo
+const mizoColor = "#a6a4de" // Mizo
-const color14 = "#" // Assamese
+const AssameseColor = "#c9535b" // Assamese
-const color15 = "#" // Bhojpuri
+const bhojpuriColor = "#b3b876" // Bhojpuri
-const color16 = "#" // Manipuri
+const manipuriColor = "#c9afad" // Manipuri
-const color17 = "#" // Dogri (near Kashmir)
+const dogriColor = "#9595e6" // Dogri (near Kashmir)
-
+const nepaliColor = "#71998e" // Nepali
-
+const urduColor = "#3fa179" // Urdu
-const color13 = "#" // Tulu
+const tuluColor = "#dedc52" // Tulu
+const maithaliColor = "#4472a6" // Maithali
 
 // Credit: https://www.artcraftblend.com/blogs/colors/shades-of-pastel
 const colorMap = {
-		"Tamil Nadu": color1,
+		"Tamil Nadu": tamilColor,
-		"Kerala": color2,
+		"Kerala": malayalamColor,
-		"Karnataka": color3,
+		"Karnataka": kannadaColor,
-		"Andhra Pradesh": color4,
+		"Andhra Pradesh": teluguColor,
-		"Telangana": color4,
+		"Telangana": teluguColor,
-		"Maharashtra": color5,
+		"Maharashtra": marathiColor,
-		"Goa": color2,
+		"Goa": konkaniColor,
-		"Odisha": color10,
+		"Odisha": oriyaColor,
-		"Gujarat": color8,
+		"Gujarat": gujaratiColor,
-		"Rajasthan": color9,
+		"Rajasthan": marwariColor,
-		"Chhattisgarh": colorr7,
+		"Chhattisgarh": hindiColor,
-		"Jharkhand": color2,
+		"Jharkhand": hindiColor, // DEFAULT
-		"West Bengal": color11,
+		"West Bengal": bengaliColor,
-		"Assam": color14,
+		"Assam": AssameseColor,
-		"Meghalaya": color3,
+		"Meghalaya": hindiColor, // DEFAULT
-		"Tripura": color4,
+		"Tripura": bengaliColor,
-		"Mizoram": color14,
+		"Mizoram": mizoColor,
-		"Manipur": color16,
+		"Manipur": manipuriColor,
-		"Nagaland": color1,
+		"Nagaland": hindiColor, // DEFAULT
-		"Arunachal Pradesh": color4,
+		"Arunachal Pradesh": hindiColor, // DEFAULT
-		"Sikkim": color2,
+		"Sikkim": nepaliColor,
-		"Bihar": color3,
+		"Bihar": bhojpuriColor,
-		"Madhya Pradesh": color7,
+		"Madhya Pradesh": hindiColor,
-		"Uttar Pradesh": color7,
+		"Uttar Pradesh": hindiColor,
-		"Uttarakhand": color2,
+		"Uttarakhand": hindiColor, // DEFAULT
-		"Haryana": color1,
+		"Haryana": hindiColor, // DEFAULT
-		"Punjab": color12,
+		"Punjab": punjabiColor,
-		"Himachal Pradesh": color3,
+		"Himachal Pradesh": hindiColor, // DEFAULT
-		"Ladakh": color1,
+		"Ladakh": dogriColor,
-		"Jammu and Kashmir": color2,
+		"Jammu and Kashmir": dogriColor,
 }
 
-//const districtColorMap = { // Should override state colors
+const districtColorMap = { // Should override state colors
-//	"Dakshina Kannada": 
+	"Dakshina Kannada": tuluColor,
+
+	"Muzaffarpur": maithaliColor,
+	"West Champaran": maithaliColor,
+	"East Champaran": maithaliColor,
+	"Vaishali": maithaliColor,
+	"Sitamarhi": maithaliColor,
+	"Sheohar": maithaliColor,
+	"Saharsa": maithaliColor,
+	"Madhepura": maithaliColor,
+	"Supaul": maithaliColor,
+	"Araria": maithaliColor,
+	"Katihar": maithaliColor,
+	"Kishanganj": maithaliColor,
+	"Purnia": maithaliColor,
+	"Banka": maithaliColor,
+	"Bhagalpur": maithaliColor,
+	"Munger": maithaliColor,
+	"Begusarai": maithaliColor,
+	"Jamui": maithaliColor,
+	"Khagaria": maithaliColor,
+	"Sheikhpura": maithaliColor,
+	"Lakhisarai": maithaliColor,
+	"Godda": maithaliColor,
+	"Deoghar": maithaliColor,
+	"Dumka": maithaliColor,
+	"Jamtara": maithaliColor,
+	"Sahibganj": maithaliColor,
+	"Pakur": maithaliColor,
+	"Darbhanga": maithaliColor,
+	"Madhubani": maithaliColor,
+	"Samastipur:": maithaliColor,
 
-const colors9 = ["#75d795", "#EFDFD8", "#D5F6FB", "#E5ECF8", "#F0EBD8", "#F7DFC2", "#B4D9EF", "#F8C57C", "#A4D8D8"]
+	"Moradabad": urduColor,
+	"Rampur": urduColor,
+	"Bijnor": urduColor,
+	"Amroha": urduColor,
+	"Meerut": urduColor,
+	"Ghaziabad": urduColor,
+	"Bulandshahr": urduColor,
+	"Aligarh": urduColor,
+	"Budaun": urduColor,
+	"Bareilly": urduColor,
+	"Sambhal": urduColor,
+	"Muzaffarnagar": urduColor,
+	"Saharanpur": urduColor,
+	"Shamli": urduColor,
+	"Hapur": urduColor,
+
+
+}
 
 function drawMap(world) {
 	const mapWidth = document.getElementById("indiaMap").getAttribute("width")
@@ -75,12 +124,11 @@ function drawMap(world) {
 	states.append("path")
 		.attr("d", path)
 		.attr("class", "state")
-		.attr("fill", d => colorMap[d.properties.st_nm])
+		.attr("fill", d => districtColorMap.hasOwnProperty(d.properties.district) ?
+								districtColorMap[d.properties.district] :
+								colorMap[d.properties.st_nm])
 		.append("title") // Tooltip
-		.text(d => d.properties.district)
+		.text(d => d.properties.district);
-		.each(function(d) {
-			map1.set(d.properties.district, d3.geoCentroid(d));
-		});
 
 	states.append("text")
       .attr("x", d => projection(d3.geoCentroid(d))[0])