diff --git a/src/countries.ts b/src/countries.ts
new file mode 100644
index 0000000000000000000000000000000000000000..187ee3caffd1f531c92deb559d396f12bc8f7564
--- /dev/null
+++ b/src/countries.ts
@@ -0,0 +1,400 @@
+// Maps the three-letter country code to the german country name
+
+export const countries = [
+ {
+ "code": "GER",
+ "name": "Deutschland",
+ },
+ {
+ "code": "FRA",
+ "name": "Frankreich",
+ },
+ {
+ "code": "ITA",
+ "name": "Italien",
+ },
+ {
+ "code": "ENG",
+ "name": "England",
+ },
+ {
+ "code": "ESP",
+ "name": "Spanien",
+ },
+ {
+ "code": "USA",
+ "name": "Vereinigte Staaten",
+ },
+ {
+ "code": "CAN",
+ "name": "Kanada",
+ },
+ {
+ "code": "AUS",
+ "name": "Australien",
+ },
+ {
+ "code": "BRA",
+ "name": "Brasilien",
+ },
+ {
+ "code": "CHN",
+ "name": "China",
+ },
+ {
+ "code": "JPN",
+ "name": "Japan",
+ },
+ {
+ "code": "RUS",
+ "name": "Russland",
+ },
+ {
+ "code": "IND",
+ "name": "Indien",
+ },
+ {
+ "code": "MEX",
+ "name": "Mexiko",
+ },
+ {
+ "code": "ARG",
+ "name": "Argentinien",
+ },
+ {
+ "code": "ZAF",
+ "name": "Südafrika",
+ },
+ {
+ "code": "KOR",
+ "name": "Südkorea",
+ },
+ {
+ "code": "TUR",
+ "name": "Türkei",
+ },
+ {
+ "code": "EGY",
+ "name": "Ägypten",
+ },
+ {
+ "code": "SWE",
+ "name": "Schweden",
+ },
+ {
+ "code": "NOR",
+ "name": "Norwegen",
+ },
+ {
+ "code": "DNK",
+ "name": "Dänemark",
+ },
+ {
+ "code": "FIN",
+ "name": "Finnland",
+ },
+ {
+ "code": "CHE",
+ "name": "Schweiz",
+ },
+ {
+ "code": "AUT",
+ "name": "Österreich",
+ },
+ {
+ "code": "BEL",
+ "name": "Belgien",
+ },
+ {
+ "code": "NLD",
+ "name": "Niederlande",
+ },
+ {
+ "code": "POL",
+ "name": "Polen",
+ },
+ {
+ "code": "GRC",
+ "name": "Griechenland",
+ },
+ {
+ "code": "HUN",
+ "name": "Ungarn",
+ },
+ {
+ "code": "CZE",
+ "name": "Tschechien",
+ },
+ {
+ "code": "SVK",
+ "name": "Slowakei",
+ },
+ {
+ "code": "PRT",
+ "name": "Portugal",
+ },
+ {
+ "code": "IRL",
+ "name": "Irland",
+ },
+ {
+ "code": "ISL",
+ "name": "Island",
+ },
+ {
+ "code": "NZL",
+ "name": "Neuseeland",
+ },
+ {
+ "code": "SGP",
+ "name": "Singapur",
+ },
+ {
+ "code": "THA",
+ "name": "Thailand",
+ },
+ {
+ "code": "IDN",
+ "name": "Indonesien",
+ },
+ {
+ "code": "MYS",
+ "name": "Malaysia",
+ },
+ {
+ "code": "PHL",
+ "name": "Philippinen",
+ },
+ {
+ "code": "VNM",
+ "name": "Vietnam",
+ },
+ {
+ "code": "SAU",
+ "name": "Saudi-Arabien",
+ },
+ {
+ "code": "ISR",
+ "name": "Israel",
+ },
+ {
+ "code": "IRN",
+ "name": "Iran",
+ },
+ {
+ "code": "PAK",
+ "name": "Pakistan",
+ },
+ {
+ "code": "BGD",
+ "name": "Bangladesch",
+ },
+ {
+ "code": "NGA",
+ "name": "Nigeria",
+ },
+ {
+ "code": "ETH",
+ "name": "Äthiopien",
+ },
+ {
+ "code": "KEN",
+ "name": "Kenia",
+ },
+ {
+ "code": "UGA",
+ "name": "Uganda",
+ },
+ {
+ "code": "TZA",
+ "name": "Tansania",
+ },
+ {
+ "code": "GHA",
+ "name": "Ghana",
+ },
+ {
+ "code": "DZA",
+ "name": "Algerien",
+ },
+ {
+ "code": "MAR",
+ "name": "Marokko",
+ },
+ {
+ "code": "TUN",
+ "name": "Tunesien",
+ },
+ {
+ "code": "LBN",
+ "name": "Libanon",
+ },
+ {
+ "code": "JOR",
+ "name": "Jordanien",
+ },
+ {
+ "code": "IRQ",
+ "name": "Irak",
+ },
+ {
+ "code": "SYR",
+ "name": "Syrien",
+ },
+ {
+ "code": "KWT",
+ "name": "Kuwait",
+ },
+ {
+ "code": "QAT",
+ "name": "Katar",
+ },
+ {
+ "code": "ARE",
+ "name": "Vereinigte Arabische Emirate",
+ },
+ {
+ "code": "OMN",
+ "name": "Oman",
+ },
+ {
+ "code": "YEM",
+ "name": "Jemen",
+ },
+ {
+ "code": "AFG",
+ "name": "Afghanistan",
+ },
+ {
+ "code": "NPL",
+ "name": "Nepal",
+ },
+ {
+ "code": "BTN",
+ "name": "Bhutan",
+ },
+ {
+ "code": "LKA",
+ "name": "Sri Lanka",
+ },
+ {
+ "code": "MMR",
+ "name": "Myanmar",
+ },
+ {
+ "code": "KHM",
+ "name": "Kambodscha",
+ },
+ {
+ "code": "LAO",
+ "name": "Laos",
+ },
+ {
+ "code": "MNG",
+ "name": "Mongolei",
+ },
+ {
+ "code": "PRK",
+ "name": "Nordkorea",
+ },
+ {
+ "code": "KAZ",
+ "name": "Kasachstan",
+ },
+ {
+ "code": "UZB",
+ "name": "Usbekistan",
+ },
+ {
+ "code": "TKM",
+ "name": "Turkmenistan",
+ },
+ {
+ "code": "KGZ",
+ "name": "Kirgisistan",
+ },
+ {
+ "code": "TJK",
+ "name": "Tadschikistan",
+ },
+ {
+ "code": "ARM",
+ "name": "Armenien",
+ },
+ {
+ "code": "GEO",
+ "name": "Georgien",
+ },
+ {
+ "code": "AZE",
+ "name": "Aserbaidschan",
+ },
+ {
+ "code": "SRB",
+ "name": "Serbien",
+ },
+ {
+ "code": "HRV",
+ "name": "Kroatien",
+ },
+ {
+ "code": "SVN",
+ "name": "Slowenien",
+ },
+ {
+ "code": "BIH",
+ "name": "Bosnien und Herzegowina",
+ },
+ {
+ "code": "MKD",
+ "name": "Nordmazedonien",
+ },
+ {
+ "code": "ALB",
+ "name": "Albanien",
+ },
+ {
+ "code": "MNE",
+ "name": "Montenegro",
+ },
+ {
+ "code": "KOS",
+ "name": "Kosovo",
+ },
+ {
+ "code": "MLT",
+ "name": "Malta",
+ },
+ {
+ "code": "CYP",
+ "name": "Zypern",
+ },
+ {
+ "code": "EST",
+ "name": "Estland",
+ },
+ {
+ "code": "LVA",
+ "name": "Lettland",
+ },
+ {
+ "code": "LTU",
+ "name": "Litauen",
+ },
+ {
+ "code": "BLR",
+ "name": "Weißrussland",
+ },
+ {
+ "code": "UKR",
+ "name": "Ukraine",
+ },
+ {
+ "code": "MDA",
+ "name": "Moldawien",
+ },
+ {
+ "code": "GNB",
+ "name": "Guinea-Bissau",
+ },
+]
diff --git a/src/main.ts b/src/main.ts
index de991fb59dd0a5fbc8a4ea160965f58916c2c160..ed758ad906f9f134cb82602ac9c21b68ec19b0ff 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -2,6 +2,7 @@ import "@/styles/index.scss"; // imports the default styles
import {dsv} from "d3-fetch";
import BubbleChart, {BubbleChartConfigParam} from "@/charts/bubbleChart.ts";
import Search from "@/search.ts";
+import {countries} from "@/countries.ts";
// const radarChartWrapper = document.querySelector('#radar-chart-wrapper') as HTMLDivElement;
const bubbleChartWrapper = document.querySelector('#bubble-chart-wrapper') as HTMLDivElement;
@@ -28,7 +29,13 @@ groupBySetting.oninput = (event) => {
}
dsv(';', 'data/output.csv').then(data => {
- bubbleChart = new BubbleChart(data, {
+ const parsedData = data.map((d: any) => ({
+ ...d,
+ nation: countries.find(c => c.code === d.nation)?.name ?? d.nation,
+ })
+ )
+
+ bubbleChart = new BubbleChart(parsedData, {
parentElement: bubbleChartWrapper,
containerWidth: 1000,
containerHeight: 1000,
@@ -55,6 +62,6 @@ zoomOutButton.onclick = () => updateZoomLevel('-')
function updateZoomLevel(to: '+' | '-') {
if (bubbleChart) {
- to === '+' ? bubbleChart.zoomIn() : bubbleChart.zoomOut()
+ to === '+' ? bubbleChart.zoomIn() : bubbleChart.zoomOut()
}
}
\ No newline at end of file
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 12e690781c31774297ec960b2429941dba3b5551..ba132167b88605273eea529853d36a98516dd9bd 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -96,12 +96,16 @@ h1 {
position: absolute;
bottom: 1rem;
right: 0;
- width: 400px;
display: flex;
+ padding: 1rem;
+ border-radius: 0.5rem;
flex-direction: column;
align-items: flex-end;
justify-content: flex-end;
gap: 1rem;
+ background: rgba(255, 255, 255, 0.5);
+ box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
+ backdrop-filter: blur(10px);
> div {
align-items: center;