From 06c05b9ff5dc5aeef8aa35023eac1f3f122210e4 Mon Sep 17 00:00:00 2001 From: Mustafa Rasheed Date: Sun, 14 Jan 2024 20:42:51 -0500 Subject: [PATCH] edited csv to align with geojson and fixed map proportions --- version2/map.js | 18 +++++++++--------- version2/whoiswinning.csv | 14 +++++++------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/version2/map.js b/version2/map.js index 54592f5..7194f9c 100644 --- a/version2/map.js +++ b/version2/map.js @@ -10,7 +10,7 @@ function getData(countryName, csvData, selectedOption) { function getColor(d, csvData, selectedOption, colorScale) { const dataValue = getData(d.properties.ADMIN, csvData, selectedOption); if (dataValue === null) { - return 'black'; // Color for countries with no data + return 'grey'; // Color for countries with no data } return colorScale(dataValue); // Use a color scale for data values } @@ -41,12 +41,12 @@ function loadMap() { // Create the SVG element for the map with a white background const svg = d3.select("#map-container").append("svg") .attr("width", 960) - .attr("height", 600) - .style("background-color", "white"); // Set background color to white + .attr("height", 610) + .style("background-color", "#E9c46a"); // Set background color to white // Define a projection and path generator const projection = d3.geoNaturalEarth1() - .scale(153) + .scale(170) .translate([480, 300]); const path = d3.geoPath().projection(projection); @@ -121,11 +121,11 @@ function loadMap() { // Function to add a legend to the map function addLegend(svg, colorScale) { // Define dimensions and position for the legend - const legendWidth = 900; - const legendHeight = 20; + const legendWidth = 800; + const legendHeight = 15; const legendMargin = { top: 30, right: 30, bottom: 30, left: 30 }; const legendX = (960 - legendWidth) / 2; // Center the legend horizontally - const legendY = 570 - legendHeight - legendMargin.bottom; // Position legend at the bottom + const legendY = 590 - legendHeight - legendMargin.bottom; // Position legend at the bottom // Create a group element for the legend const legend = svg.append("g") @@ -167,8 +167,8 @@ function addLegend(svg, colorScale) { legend.append("text") .attr("x", 0) - .attr("y", legendHeight + 40) - .text("Note: Countries with black-fill do not have data available on the selected indicator") + .attr("y", legendHeight + 30) + .text("Note: Countries with grey-fill do not have data available on the selected indicator") .style("fill", "black"); } diff --git a/version2/whoiswinning.csv b/version2/whoiswinning.csv index fe73e00..17facb9 100644 --- a/version2/whoiswinning.csv +++ b/version2/whoiswinning.csv @@ -11,7 +11,7 @@ Aruba,11.1,21.42,40012.08,,,,,,,,,,,,,420, Australia,1.2,35.13,53113.79,31753.72,1828000,3700000,2200000,"1,058",8263951308,8.93,7.095,84.5,12.7,"49,238",0.073,134005100,33.22 Austria,0.33,49.08,56729.96,3825.33,15091000,766000,0,209,323088171,11.51,7.097,81.6,12.3,"53,619",0.053,3899150,77.32 Azerbaijan,30.46,35.56,14963.43,2703.18,796000,,,10,102961,24.64,,69.4,10.5,"14,257",0.294,1131770,6.34 -Bahamas,-14.18,21.23,34743.2,,,,,,,5.2,,71.6,12.6,"30,486",0.329,509860, +The Bahamas,-14.18,21.23,34743.2,,,,,,,5.2,,71.6,12.6,"30,486",0.329,509860, Bahrain,9.06,23.47,49191.62,1381.38,1909000,,,1,19130,51.82,6.173,78.8,11,"39,497",0.181,700, Bangladesh,-4.06,8.74,6733.53,4882.6,,,,15,475338,45.99,4.282,72.4,7.4,"5,472",0.53,1883400,1.91 Barbados,-10.79,29.06,14701.55,,,,,1,1105,9.79,,77.6,9.9,"12,306",0.268,6300, @@ -62,14 +62,13 @@ France,-1.71,53.62,47788.45,56647,117109000,7600000,14900000,"4,253",21089734238 Gabon,1.19,17.43,15389.55,311.45,,,,1,23866,26.29,5.035,65.8,9.4,"13,367",0.541,23530600, Gambia,-15.02,16.84,2230.43,14.71,,,,,,39.1,4.279,62.1,4.6,"2,172",0.611,242670, Georgia,-3.13,26.87,17144.66,302.14,1513000,,,33,4368627,19.06,5.109,71.7,12.8,"14,664",0.28,2822400,76.19 -Germany,4.2,47.08,54046.73,56017.03,12449000,10600000,15200000,"2,053",11035157672,10.73,6.892,80.6,14.1,"54,534",0.073,11419000,43.48 Germany,4.2,47.08,54046.73,56017.03,12449000,10600000,15200000,15,29573980,10.73,6.892,80.6,14.1,"54,534",0.073,11419000,43.48 Ghana,-2.25,15.63,5741.53,298.35,,,,11,406799,46.04,4.605,63.8,8.3,"5,745",0.529,7985710, Greece,-9.68,51.53,31258.86,8079.94,7406000,657000,608000,101,84287917,14.62,5.931,80.1,11.4,"29,002",0.119,3901800,43.17 Grenada,-17.74,33.78,15885.85,,217000,,,,,10.08,,74.9,9,"13,484", ,17700, Guatemala,1.84,12.84,8489.05,341.78,594000,,,9,1069363,20.75,6.15,69.2,5.7,"8,723",0.481,3527800, Guinea,-6.21,13.1,2548.89,244.56,,,,,,37.57,5.072,58.9,2.2,"2,481",0.621,6189000, -Guinea-Bissau,-5.85,16.04,2449,26.34,,,,1,0,34.85,,59.7,3.6,"1,908",0.627,, +Guinea Bissau,-5.85,16.04,2449,26.34,,,,1,0,34.85,,59.7,3.6,"1,908",0.627,, Guyana,27.27,15.37,36162.44,70.7,86400,,,,,11.11,,65.7,8.6,"22,465",0.454,18415340, Haiti,-2.34,8.01,2677.36,20.91,,,,7,41873,9.69,,63.2,5.6,"2,848",0.635,347300, Honduras,-3.43,25.11,5786.05,438.11,669000,,,1,0,18.93,6.023,70.1,7.1,"5,298",0.431,6359260, @@ -154,7 +153,7 @@ San Marino,4.35,22.02,63803,,,,,,,9.85,,80.9,10.8,"52,654", ,, Sao Tome and Principe,-13.78,31.88,3983.57,,,,,,,33.75,,67.6,6.2,"4,021",0.494,, Saudi Arabia,13.79,30.57,52345.98,55564.27,,,,22,18043536,57.16,6.463,76.9,11.3,"46,112",0.247,, Senegal,-16,20.74,3494.56,473.97,,,,20,6642683,38.21,4.855,67.1,2.9,"3,344",0.53,8068160, -Serbia,-6.86,43.38,20258.03,1270.78,446000,,,61,18883910,21.74,6.144,74.2,11.4,"19,123",0.131,2722650,27.91 +Republic of Serbia,-6.86,43.38,20258.03,1270.78,446000,,,61,18883910,21.74,6.144,74.2,11.4,"19,123",0.131,2722650,27.91 Seychelles,-7.26,31.88,31411.05,22.82,124500,,,,,16.96,,71.3,10.3,"25,831", ,33700, Sierra Leone,-10.26,19.32,1681.63,27.27,,,,1,0,39.42,3.138,60.1,4.6,"1,622",0.633,, Singapore,19.33,15.85,108036.11,11115.32,2742000,,,39,43494364,13.33,6.587,82.8,11.9,"90,919",0.04,15570,2.41 @@ -174,7 +173,7 @@ Switzerland,9.84,33.82,71700.8,5738.4,,554000,1793000,287,700177642,8.97,7.24,84 Syria,,,,,,,,13,212604,25.14,,72.1,5.1,"4,192",0.477,522080, Taiwan ,13.36,15.58,58565,,,,,,,,,,,,,, Tajikistan,6.22,27.52,4185.98,81.71,,,,5,1776779,53.65,5.33,71.6,11.3,"4,548",0.285,423800, -Tanzania,-4.57,14.97,2874.31,742.34,,,,9,27694,15.36,3.694,,,,,45745000, +United Republic of Tanzania,-4.57,14.97,2874.31,742.34,,,,9,27694,15.36,3.694,,,,,45745000, Thailand,-3.26,20.06,17914.65,6604.53,,,,146,231340275,24.64,5.843,78.7,8.7,"17,030",0.333,19873000,15.47 Timor-Leste,-4.7,26.4,4639.85,39.22,,,,,,20.47,,67.7,5.4,"4,461",0.378,, Togo,-2.84,17.82,2182.33,113.95,482000,,,,,35.66,4.137,61.6,5,"2,167",0.58,1209270, @@ -188,7 +187,7 @@ Uganda,-8.11,14.93,2563.2,1066.56,473000,,,7,61510,31.31,4.432,62.7,5.7,"2,181", Ukraine,5.68,53.24,10722.11,5942.78,3382000,4984000,7630000,85,106302954,13.51,5.071,71.6,11.1,"13,256",0.2,9690000,15.83 United Arab Emirates,11.75,35.4,70909.85,,8084000,,,50,539368692,41.75,6.571,78.7,12.7,"62,574",0.049,, United Kingdom,-5.55,38.88,46406.96,68366.44,11101000,13000000,12000000,"4,455",55920874223,9.52,6.796,80.7,13.4,"45,225",0.098,, -United States,-3.63,32.99,64660.93,800672.2,45037000,69929000,74059000,"24,328",631243223863,7.18,6.894,77.2,13.7,"64,765",0.179,, +United States of America,-3.63,32.99,64660.93,800672.2,45037000,69929000,74059000,"24,328",6.31E+11,7.18,6.894,77.2,13.7,"64,765",0.179,, Uruguay,-2.46,26.92,23058.63,1257.92,,,,55,169200779,8.48,6.494,75.4,9,"21,269",0.235,2031000,85.81 Uzbekistan,1.44,29.44,8159.45,,,,,4,270968,40.98,6.014,70.9,11.9,"7,917",0.227,3689660,7.74 Vanuatu,-2.18,38.06,2447.51,,82400,,,2,574050,8.42,,70.4,7.1,"3,085", ,442300, @@ -197,4 +196,5 @@ Vietnam,-0.88,18.27,11250.46,,3837000,,,,,20.89,5.763,73.6,8.4,"7,867",0.296,146 West Bank and Gaza,-12.45,27.57,5393.48,,,,,,,,4.908,73.5,9.9,"6,583", ,, Yemen,-9.63,10.94,1711.91,,,,,5,2466867,41.61,,63.8,3.2,"1,314",0.82,549000, Zambia,2.36,20.83,3257.1,282.58,502000,,,1,0,16.9,3.982,61.2,7.2,"3,218",0.54,44814030, -Zimbabwe,0.81,15.96,2136.73,65.8,639000,,,1,25038,13.08,3.204,59.3,8.7,"3,810",0.532,17444580, \ No newline at end of file +Zimbabwe,0.81,15.96,2136.73,65.8,639000,,,1,25038,13.08,3.204,59.3,8.7,"3,810",0.532,17444580, +Greenland,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0