diff --git a/index.js b/index.js index a23502e..1a22667 100644 --- a/index.js +++ b/index.js @@ -232,20 +232,42 @@ function drawMap(world) { if (stateOrDistrictOrLanguage(d) == "language") { rtv = projection(d3.geoCentroid(d))[0]; if (d.properties.lang_name == "Kannada") { - rtv -= 10; + rtv -= 20; } + if (d.properties.lang_name == "Tamil") { + rtv += 20; + } + if (d.properties.lang_name == "Maithali") { + rtv += 10; + } return rtv } }) .attr("y", function(d) { if (stateOrDistrictOrLanguage(d) == "language") { - return projection(d3.geoCentroid(d))[1] + rtv = projection(d3.geoCentroid(d))[1] + if (d.properties.lang_name == "Kannada") { + rtv += 15; + } + if (d.properties.lang_name == "Tamil") { + rtv -= 20; + } + if (d.properties.lang_name == "Gujarati") { + rtv -= 10; + } + if (d.properties.lang_name == "Mizo") { + rtv += 20; + } + if (d.properties.lang_name == "Nepali") { + rtv -= 10; + } + + return rtv } }) .attr("text-anchor", "middle") - .attr("font-size", "12px") .attr("fill", "black") - .attr("class", "languageText") + .attr("class", "translationText") .attr("id", function(d) { if (stateOrDistrictOrLanguage(d) == "language") { return d.properties.lang_code+"Text" @@ -261,15 +283,15 @@ function drawMap(world) { } }); + // Romanization states.append("text") .attr("x", d => stateOrDistrictOrLanguage(d) == "language" ? document.getElementById(d.properties.lang_code + "Text").getAttribute("x") : projection(d3.geoCentroid(d))[0]) .attr("y", d => stateOrDistrictOrLanguage(d) == "language" ? - parseFloat(document.getElementById(d.properties.lang_code + "Text").getAttribute("y")) + parseFloat(getComputedStyle(document.getElementsByClassName('languageText')[0]).getPropertyValue('font-size')) : + parseFloat(document.getElementById(d.properties.lang_code + "Text").getAttribute("y")) + parseFloat(getComputedStyle(document.getElementsByClassName('translationText')[0]).getPropertyValue('font-size')) : projection(d3.geoCentroid(d))[1]) .attr("text-anchor", "middle") - .attr("font-size", "12px") .attr("fill", "black") .attr("class", "romanizationText") .attr("id", function(d) { @@ -285,6 +307,37 @@ function drawMap(world) { } }); + // Language + states.append("text") + .attr("x", d => stateOrDistrictOrLanguage(d) == "language" ? + document.getElementById(d.properties.lang_code + "Text").getAttribute("x") : + projection(d3.geoCentroid(d))[0]) + .attr("y", d => stateOrDistrictOrLanguage(d) == "language" ? + parseFloat(document.getElementById(d.properties.lang_code + "Text").getAttribute("y")) - parseFloat(getComputedStyle(document.getElementsByClassName('translationText')[0]).getPropertyValue('font-size')) : + projection(d3.geoCentroid(d))[1]) + .attr("text-anchor", "middle") + .attr("fill", "black") + .attr("class", "languageText") + .attr("id", function(d) { + if (stateOrDistrictOrLanguage(d) == "language") { + return d.properties.lang_code+"Language" + } else { + d3.select(this).remove() + } + }) + .each(function(d) { + if (!stateOrDistrictOrLanguage(d) == "language") { + d3.select(this).remove() // Only add this attribute if the element is a language + } + }) + .text(function(d) { + if (stateOrDistrictOrLanguage(d) == "language") { + return d.properties.lang_name; + } else { + d3.select(this).remove() // Only add this attribute if the element is a language + } + }); + let allLangs = [] const coordinates = [77.69916967457782,23.389970772934166];