|
|
|
|
@ -1,5 +1,4 @@
|
|
|
|
|
const svg = d3.select("svg")
|
|
|
|
|
const colorToDistrict = new Map()
|
|
|
|
|
|
|
|
|
|
const tamilColor = "#75d795" // Tamil
|
|
|
|
|
const malayalamColor = "#ff7c7c" // Malayalam
|
|
|
|
|
@ -14,7 +13,7 @@ const oriyaColor = "#9bcc9f" // Oriya
|
|
|
|
|
const bengaliColor = "#bf9a77" // Bengali
|
|
|
|
|
const punjabiColor = "#e84a35" // Punjabi
|
|
|
|
|
const mizoColor = "#a6a4de" // Mizo
|
|
|
|
|
const AssameseColor = "#c9535b" // Assamese
|
|
|
|
|
const assameseColor = "#c9535b" // Assamese
|
|
|
|
|
const bhojpuriColor = "#b3b876" // Bhojpuri
|
|
|
|
|
const manipuriColor = "#c9afad" // Manipuri
|
|
|
|
|
const dogriColor = "#9595e6" // Dogri (near Kashmir)
|
|
|
|
|
@ -25,109 +24,122 @@ const maithaliColor = "#4472a6" // Maithali
|
|
|
|
|
|
|
|
|
|
const unavailLangColor = "#555555"
|
|
|
|
|
|
|
|
|
|
const languages = {
|
|
|
|
|
tamil: {name: "Tamil", color: tamilColor, districts: []},
|
|
|
|
|
malayalam: {name: "Malayalam", color: malayalamColor, districts: []},
|
|
|
|
|
kannada: {name: "Kannada", color: kannadaColor, districts: []},
|
|
|
|
|
telugu: {name: "Telugu", color: teluguColor, districts: []},
|
|
|
|
|
marathi: {name: "Marathi", color: marathiColor, districts: []},
|
|
|
|
|
konkani: {name: "Konkani", color: konkaniColor, districts: []},
|
|
|
|
|
hindi: {name: "Hindi", color: hindiColor, districts: []},
|
|
|
|
|
gujarati: {name: "Gujarati", color: gujaratiColor, districts: []},
|
|
|
|
|
marwari: {name: "Marwari", color: marwariColor, districts: []},
|
|
|
|
|
oriya: {name: "Oriya", color: oriyaColor, districts: []},
|
|
|
|
|
bengali: {name: "Bengali", color: bengaliColor, districts: []},
|
|
|
|
|
punjabi: {name: "Punjabi", color: punjabiColor, districts: []},
|
|
|
|
|
mizo: {name: "Mizo", color: mizoColor, districts: []},
|
|
|
|
|
assamese: {name: "Assamese", color: assameseColor, districts: []},
|
|
|
|
|
bhojpuri: {name: "Bhojpuri", color: bhojpuriColor, districts: []},
|
|
|
|
|
manipuri: {name: "Manipuri", color: manipuriColor, districts: []},
|
|
|
|
|
dogri: {name: "Dogri", color: dogriColor, districts: []},
|
|
|
|
|
nepali: {name: "Nepali", color: nepaliColor, districts: []},
|
|
|
|
|
urdu: {name: "Urdu", color: urduColor, districts: []},
|
|
|
|
|
tulu: {name: "Tulu", color: tuluColor, districts: []},
|
|
|
|
|
maithali: {name: "Maithali", color: maithaliColor, districts: []},
|
|
|
|
|
unavail: {name: "Unavailable", color: unavailLangColor, districts: []},
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// Credit: https://www.artcraftblend.com/blogs/colors/shades-of-pastel
|
|
|
|
|
const colorMap = {
|
|
|
|
|
"Tamil Nadu": tamilColor,
|
|
|
|
|
"Kerala": malayalamColor,
|
|
|
|
|
"Karnataka": kannadaColor,
|
|
|
|
|
"Andhra Pradesh": teluguColor,
|
|
|
|
|
"Telangana": teluguColor,
|
|
|
|
|
"Maharashtra": marathiColor,
|
|
|
|
|
"Goa": konkaniColor,
|
|
|
|
|
"Odisha": oriyaColor,
|
|
|
|
|
"Gujarat": gujaratiColor,
|
|
|
|
|
"Rajasthan": marwariColor,
|
|
|
|
|
"Chhattisgarh": hindiColor,
|
|
|
|
|
"Jharkhand": hindiColor, // DEFAULT
|
|
|
|
|
"West Bengal": bengaliColor,
|
|
|
|
|
"Assam": AssameseColor,
|
|
|
|
|
"Meghalaya": unavailLangColor, // DEFAULT
|
|
|
|
|
"Tripura": bengaliColor,
|
|
|
|
|
"Mizoram": mizoColor,
|
|
|
|
|
"Manipur": manipuriColor,
|
|
|
|
|
"Nagaland": unavailLangColor, // DEFAULT
|
|
|
|
|
"Arunachal Pradesh": unavailLangColor, // DEFAULT
|
|
|
|
|
"Sikkim": nepaliColor,
|
|
|
|
|
"Bihar": bhojpuriColor,
|
|
|
|
|
"Madhya Pradesh": hindiColor,
|
|
|
|
|
"Uttar Pradesh": hindiColor,
|
|
|
|
|
"Uttarakhand": hindiColor, // DEFAULT
|
|
|
|
|
"Haryana": hindiColor, // DEFAULT
|
|
|
|
|
"Punjab": punjabiColor,
|
|
|
|
|
"Himachal Pradesh": hindiColor, // DEFAULT
|
|
|
|
|
"Ladakh": dogriColor,
|
|
|
|
|
"Jammu and Kashmir": dogriColor,
|
|
|
|
|
}
|
|
|
|
|
const state2lang = {
|
|
|
|
|
"Tamil Nadu": languages["tamil"],
|
|
|
|
|
"Kerala": languages["malayalam"],
|
|
|
|
|
"Karnataka": languages["kannada"],
|
|
|
|
|
"Andhra Pradesh": languages["telugu"],
|
|
|
|
|
"Telangana": languages["telugu"],
|
|
|
|
|
"Maharashtra": languages["marathi"],
|
|
|
|
|
"Goa": languages["konkani"],
|
|
|
|
|
"Odisha": languages["oriya"],
|
|
|
|
|
"Gujarat": languages["gujarati"],
|
|
|
|
|
"Rajasthan": languages["marwari"],
|
|
|
|
|
"Chhattisgarh": languages["hindi"],
|
|
|
|
|
"Jharkhand": languages["hindi"], // DEFAULT
|
|
|
|
|
"West Bengal": languages["bengali"],
|
|
|
|
|
"Assam": languages["assamese"],
|
|
|
|
|
"Meghalaya": languages["unavail"], // DEFAULT
|
|
|
|
|
"Tripura": languages["bengali"],
|
|
|
|
|
"Mizoram": languages["mizo"],
|
|
|
|
|
"Manipur": languages["manipuri"],
|
|
|
|
|
"Nagaland": languages["unavail"], // DEFAULT
|
|
|
|
|
"Arunachal Pradesh": languages["unavail"], // DEFAULT
|
|
|
|
|
"Sikkim": languages["nepali"],
|
|
|
|
|
"Bihar": languages["bhojpuri"],
|
|
|
|
|
"Madhya Pradesh": languages["hindi"],
|
|
|
|
|
"Uttar Pradesh": languages["hindi"],
|
|
|
|
|
"Uttarakhand": languages["hindi"], // DEFAULT
|
|
|
|
|
"Haryana": languages["hindi"], // DEFAULT
|
|
|
|
|
"Punjab": languages["punjabi"],
|
|
|
|
|
"Himachal Pradesh": languages["hindi"], // DEFAULT
|
|
|
|
|
"Ladakh": languages["dogri"],
|
|
|
|
|
"Jammu and Kashmir": languages["dogri"],
|
|
|
|
|
|
|
|
|
|
"Dadra and Nagar Haveli and Daman and Diu": languages["gujarati"],
|
|
|
|
|
"Puducherry": languages["tamil"],
|
|
|
|
|
"Lakshadweep": languages["malayalam"],
|
|
|
|
|
"Andaman and Nicobar Islands": languages["unavail"],
|
|
|
|
|
"Delhi": languages["hindi"],
|
|
|
|
|
"Chandigarh": languages["hindi"]
|
|
|
|
|
|
|
|
|
|
const districtColorMap = { // Should override state colors
|
|
|
|
|
"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,
|
|
|
|
|
|
|
|
|
|
"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,
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Assuming 'features' is your array of GeoJSON polygon features
|
|
|
|
|
function getOuterBoundary(features) {
|
|
|
|
|
// Merge all polygons into a single multipolygon
|
|
|
|
|
const merged = turf.union(turf.featureCollection(features));
|
|
|
|
|
|
|
|
|
|
// If we have a multipolygon, extract its coordinates
|
|
|
|
|
const coordinates = merged.geometry.type === 'MultiPolygon'
|
|
|
|
|
? merged.geometry.coordinates
|
|
|
|
|
: [merged.geometry.coordinates];
|
|
|
|
|
|
|
|
|
|
// Extract just the outer ring of each polygon (first ring in each polygon)
|
|
|
|
|
const outerRings = coordinates.map(polygon => polygon[0]);
|
|
|
|
|
|
|
|
|
|
// Create a new Feature with a MultiLineString geometry containing the outer rings
|
|
|
|
|
const boundary = turf.multiLineString(outerRings);
|
|
|
|
|
|
|
|
|
|
console.log(boundary);
|
|
|
|
|
return boundary;
|
|
|
|
|
const district2lang = { // Should override state colors
|
|
|
|
|
"Dakshina Kannada": languages["tulu"],
|
|
|
|
|
|
|
|
|
|
"Muzaffarpur": languages["maithali"],
|
|
|
|
|
"West Champaran": languages["maithali"],
|
|
|
|
|
"East Champaran": languages["maithali"],
|
|
|
|
|
"Vaishali": languages["maithali"],
|
|
|
|
|
"Sitamarhi": languages["maithali"],
|
|
|
|
|
"Sheohar": languages["maithali"],
|
|
|
|
|
"Saharsa": languages["maithali"],
|
|
|
|
|
"Madhepura": languages["maithali"],
|
|
|
|
|
"Supaul": languages["maithali"],
|
|
|
|
|
"Araria": languages["maithali"],
|
|
|
|
|
"Katihar": languages["maithali"],
|
|
|
|
|
"Kishanganj": languages["maithali"],
|
|
|
|
|
"Purnia": languages["maithali"],
|
|
|
|
|
"Banka": languages["maithali"],
|
|
|
|
|
"Bhagalpur": languages["maithali"],
|
|
|
|
|
"Munger": languages["maithali"],
|
|
|
|
|
"Begusarai": languages["maithali"],
|
|
|
|
|
"Jamui": languages["maithali"],
|
|
|
|
|
"Khagaria": languages["maithali"],
|
|
|
|
|
"Sheikhpura": languages["maithali"],
|
|
|
|
|
"Lakhisarai": languages["maithali"],
|
|
|
|
|
"Godda": languages["maithali"],
|
|
|
|
|
"Deoghar": languages["maithali"],
|
|
|
|
|
"Dumka": languages["maithali"],
|
|
|
|
|
"Jamtara": languages["maithali"],
|
|
|
|
|
"Sahibganj": languages["maithali"],
|
|
|
|
|
"Pakur": languages["maithali"],
|
|
|
|
|
"Darbhanga": languages["maithali"],
|
|
|
|
|
"Madhubani": languages["maithali"],
|
|
|
|
|
"Samastipur": languages["maithali"],
|
|
|
|
|
|
|
|
|
|
"Moradabad": languages["urdu"],
|
|
|
|
|
"Rampur": languages["urdu"],
|
|
|
|
|
"Bijnor": languages["urdu"],
|
|
|
|
|
"Amroha": languages["urdu"],
|
|
|
|
|
"Meerut": languages["urdu"],
|
|
|
|
|
"Ghaziabad": languages["urdu"],
|
|
|
|
|
"Bulandshahr": languages["urdu"],
|
|
|
|
|
"Aligarh": languages["urdu"],
|
|
|
|
|
"Budaun": languages["urdu"],
|
|
|
|
|
"Bareilly": languages["urdu"],
|
|
|
|
|
"Sambhal": languages["urdu"],
|
|
|
|
|
"Muzaffarnagar": languages["urdu"],
|
|
|
|
|
"Saharanpur": languages["urdu"],
|
|
|
|
|
"Shamli": languages["urdu"],
|
|
|
|
|
"Hapur": languages["urdu"],
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getOuterBoundaryPolygon(features) {
|
|
|
|
|
@ -171,16 +183,13 @@ function drawMap(world) {
|
|
|
|
|
states.append("path")
|
|
|
|
|
.attr("d", path)
|
|
|
|
|
.attr("class", d => stateOrDistrict(d))
|
|
|
|
|
.attr("fill", d => districtColorMap.hasOwnProperty(d.properties.district) ?
|
|
|
|
|
districtColorMap[d.properties.district] :
|
|
|
|
|
colorMap[d.properties.st_nm])
|
|
|
|
|
.attr("fill", d => district2lang.hasOwnProperty(d.properties.district) ?
|
|
|
|
|
district2lang[d.properties.district].color :
|
|
|
|
|
state2lang[d.properties.st_nm].color)
|
|
|
|
|
.each(function(d) {
|
|
|
|
|
if (stateOrDistrict(d) == "district") {
|
|
|
|
|
if (!colorToDistrict.hasOwnProperty(this.getAttribute("fill"))) {
|
|
|
|
|
colorToDistrict[this.getAttribute("fill")] = [d]
|
|
|
|
|
} else {
|
|
|
|
|
colorToDistrict[this.getAttribute("fill")].push(d)
|
|
|
|
|
}
|
|
|
|
|
districtLang = district2lang.hasOwnProperty(d.properties.district) ? district2lang[d.properties.district] : state2lang[d.properties.st_nm];
|
|
|
|
|
districtLang.districts.push(d)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.append("title") // Tooltip
|
|
|
|
|
@ -197,27 +206,30 @@ function drawMap(world) {
|
|
|
|
|
.text(d => d.properties.district);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// for (const lang of languages) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Example usage
|
|
|
|
|
let geojson = {
|
|
|
|
|
"type": "FeatureCollection",
|
|
|
|
|
"features": colorToDistrict[hindiColor]
|
|
|
|
|
"features": languages["kannada"].districts
|
|
|
|
|
};
|
|
|
|
|
console.log(geojson)
|
|
|
|
|
|
|
|
|
|
console.log(getOuterBoundaryPolygon(geojson.features));
|
|
|
|
|
let outerBound = getOuterBoundaryPolygon(geojson.features)
|
|
|
|
|
outerBound["id"] = "langKannada"
|
|
|
|
|
outerBound.properties["lang_name"]= "Kannada"
|
|
|
|
|
console.log(outerBound)
|
|
|
|
|
console.log(JSON.stringify(outerBound, null, 2));
|
|
|
|
|
|
|
|
|
|
// Draw the boundary
|
|
|
|
|
svg.append("path")
|
|
|
|
|
.datum(getOuterBoundaryPolygon(geojson.features))
|
|
|
|
|
.datum(outerBound)
|
|
|
|
|
.attr("d", path)
|
|
|
|
|
.attr("fill", "none")
|
|
|
|
|
.attr("stroke", "red")
|
|
|
|
|
.attr("stroke-width", 2);
|
|
|
|
|
|
|
|
|
|
const bbox = turf.bbox(getOuterBoundaryPolygon(geojson.features));
|
|
|
|
|
console.log("Bounding box:", bbox);
|
|
|
|
|
|
|
|
|
|
//
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
