Exercise Module 3

Exercise Module 4

This graphic shows the 2014 unemployment rate for Spanish regions as a horizontal bar chart, with regions sorted from highest to lowest and the national average highlighted in a darker shade. It uses a linear scale for the value axis and an ordinal scale with range bands for the categorical region axis. The visualization is built with D3 v3, referencing the CSV data file for unemployment statistics, and uses SVG rendering with custom axes, hover tooltips, and a color scheme that emphasizes the national total.

Exercise Module 4

Exercise Module 3

This example shows the unemployment rate in 2014 for Spanish regions, ordered from highest to lowest, with bar lengths proportional to the rate and tooltips revealing the exact value per region. The chart uses d3.csv to load the data, d3.descending for sorting, and d3.select to append SVG rectangles with title elements for interactivity. The data is sourced from a CSV file containing regional unemployment statistics, and the visualization is rendered as a simple SVG bar chart.

Exercise Module 3

A horizontal bar chart displays the 2014 unemployment rate for each Spanish region, sorted from highest to lowest with grey bars sized proportionally to the rate. The visualization highlights that southern regions have higher unemployment while northern ones are lower, with hover tooltips revealing exact percentages. The code uses d3.csv to load region data and d3.selectAll with data joins to append SVG rect elements, scaling bar widths by multiplying the rate by eight.

Exercise Module 5

A scatterplot shows the correlation between regional unemployment rates and the percentage of people reporting difficulty making ends meet across Spanish regions in 2014. Each circle represents a region, with the national average highlighted in darker gray. The visualization loads data from a CSV using `d3.csv`, sorts regions by unemployment rate, and animates circle radii from zero to five pixels via `transition.attr`. Axes are rendered with `d3.svg.axis`, and hover tooltips are added using SVG `title` elements. Data comes from the Spanish Statistical Office (INE).

88% match

Unemployment in Spain

This visualization shows the trajectory of unemployment rates across Spanish regions from 2007 to 2014, with a focus on the 2014 overall rate, youth unemployment, and long-term unemployment. Each region is represented as a circle positioned on a scatter plot, using the active population and total unemployed count for 2014 as axes. The code uses `d3.forceSimulation` and `d3.geoPath` to place the circles, while the CSV data is loaded and parsed with `d3.csv`. The chart also colors regions by unemployment rate and adds a text label for each region.

84% match

Line Chart with Multiple Lines

This visualization displays the evolution of unemployment rates across Spanish regions from 2007 to 2014, with the national average highlighted in a darker gray. Each region appears as a separate line, and hovering over any path highlights it in red. The chart uses D3.js v3 with SVG rendering, utilizing `d3.svg.line`, `d3.time.scale`, and `d3.svg.axis` to map yearly data loaded from a CSV file. Data originates from Spain’s Economically Active Population Survey (INE).

83% match