GDP AND Unemployment

100%

GDP AND Unemployment

✓ Published3🌍 Public

Kkfhujosefsson@dons.usfca.edu

Last edited Apr 29, 2025

Created on Apr 24, 2025

This dashboard compares GDP annual change and unemployment rates for Sweden, Norway, and Denmark from 2020 to 2024. Two side-by-side line charts show each country’s trends, with interactive legends that fade or highlight series on click and a hover tooltip for precise values. Built with D3.js, the visualization loads CSV data from external gists and uses scales, axes, and SVG line paths to render the time-series.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

DEMO of connect d3 visulization

This interactive dashboard displays GDP annual percentage change and unemployment rate trends for Sweden, Norway, and Denmark from 2020 to 2024. Two side-by-side line charts, rendered as SVG elements using D3.js (v7.8.5), allow comparison across the three countries, with interactive highlighting and faded lines activated by clicking legend items. A hover tooltip reveals exact values. Data is loaded from remote CSV files using `d3.csv`, with axes configured via `d3.scaleOrdinal` and `d3.timeParse`, and the visualization supports animation through D3’s transition mechanisms.

Hhxu51@usfca.edu

87% match

Loading thumbnail…

DEMO

This dashboard compares social and economic indicators across Scandinavian countries, showing GDP annual percentage change and unemployment rate annual change for Sweden, Norway, and Denmark. Two side-by-side line charts display time-series trends from 2020–2024, with interactive legends that fade or highlight country lines on click. Tooltips reveal exact values on hover. The visualization uses D3.js (v7) with SVG rendering and animation, loading data from two CSV sources via `Promise.all` and `d3.csv`, with axes, grid lines, and color encoding managed through D3 scales.

Kkfhujosefsson@dons.usfca.edu

87% match

Loading thumbnail…

TESTER

This interactive dashboard visualizes social and economic indicators for Scandinavian countries from 2020 to 2024, displaying GDP annual change, unemployment rates, and hospital occupancy for Denmark, Norway, and Sweden. Three separate line charts show each country's hospital occupancy, while a combined chart aggregates the data for comparison. The visualization uses D3.js to create SVG line charts with hover tooltips and interactive legends that highlight or fade individual country lines. Users can click legend items to filter specific countries across the economic indicators, with hover tooltips revealing exact values for each data point.

Kkfhujosefsson@dons.usfca.edu

83% match

Loading thumbnail…

Fork of Fork of Line Chart - Covid Cases per day in Sweden October 2020

This line chart shows global unemployment rate trends from 1991 to 2023, plotting yearly averages calculated from monthly or quarterly data grouped by year. The visualization uses d3.csv to load data from a Gist URL, d3.group with d3.mean to aggregate values per year, and d3.scaleLinear with d3.line and curveMonotoneX to render a smooth SVG path. Axes are generated with d3.axisBottom and d3.axisLeft, including percentage formatting for the y-axis and rotated tick labels for the x-axis.

Kkfhujosefsson@dons.usfca.edu

76% match

Loading thumbnail…

Fork of Line Chart - Covid Cases per day in Sweden October 2020

This line chart visualizes the global unemployment rate trend from 1991 to 2023, using yearly averages calculated from raw data loaded via `d3.csv` from a Gist URL. The chart displays a smooth monotone curve (`d3.curveMonotoneX`) in steelblue, with an x-axis for years and a y-axis labeled with percentages. The implementation uses `d3.scaleLinear` for both axes, `d3.axisBottom` and `d3.axisLeft` for tick marks, and `d3.group` with `d3.mean` to aggregate monthly rates by year. The SVG rendering is responsive, with the chart width adapting to the viewport.

Kkfhujosefsson@dons.usfca.edu

75% match

Loading thumbnail…

Main

This dashboard visualizes socioeconomic trends across Nordic countries using animated line charts and a mortality-rate slider. It compares Denmark, Norway, and Sweden with interactive legends that highlight or fade each line. The mortality chart uses D3 v7’s data binding and SVG transitions to animate dots and trails over time. Tooltips display exact values, while CSS-styled grids and axes enhance readability. The background image and custom HTML structure frame the charts, with a slider controlling the displayed year.

Kkfhujosefsson@dons.usfca.edu

74% match

Loading thumbnail…

CovidCases

This visualization shows the cumulative number of COVID-19 cases in Sweden, Denmark, and Norway over time, displayed on a geographic map of Scandinavia. A date slider lets viewers scrub through the timeline, with each country colored according to a sequential orange-red scale that encodes case counts. The implementation uses d3-geo and d3.geoPath with a Mercator projection to render the map, while d3.scaleSequential and d3.interpolateOrRd handle the color mapping. Data comes from a JSON world geometry file and a CSV of daily case totals, grouped by date and country. Hovering over a country reveals a tooltip, though its text is not populated.

Kkfhujosefsson@dons.usfca.edu

72% match

Loading thumbnail…

Multiline chart

This interactive multiline chart visualizes the GDP of 19 European countries from 2006 to 2023, using D3.js (v7.8.5) to render SVG line paths and an animated legend. Users toggle country visibility via checkboxes, with a tooltip displaying formatted GDP values. The data is fetched from a GitHub gist and parsed as CSV using `d3.csvParse`. A color scale from `d3.schemeCategory10` assigns distinct hues, and the chart includes dashed gridlines and an SVG-based legend for clarity.

Kkfhujosefsson@dons.usfca.edu

70% match