Visu_Part3

100%

✓ Published0🌍 Public

Last edited Jan 9, 2018

Created on Jan 8, 2018

This visualization shows unemployment rates across French regions from 2013 to 2017 as animated multi-line charts. Users can toggle between viewing all regions at once or selecting individual regions via radio buttons and legend clicks. The D3 v4 code loads CSV data, nests values by region, and draws SVG paths using `d3.line` with color-coded strokes. Legend text elements respond to clicks to toggle line opacity, while animated transitions update the display based on user selection.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

projet_DataViz

The visualization shows the evolution of TER (regional express train) traffic quality across French regions from 2013 to 2017, mapping monthly percentage values onto a choropleth of France. The view is updated via a slider that changes the displayed month. The code uses D3 v4 with `d3.geoConicConformal` for the map projection, `d3.geoPath` to render region outlines, and a quantized color scale. Region values are loaded from the CSV file containing a row per region and columns for each month, then joined to the GeoJSON regions by matching region names.

AAminaSGitHub

78% match

Loading thumbnail…

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.

GGloriaYL

77% match

Loading thumbnail…

Vizu_Part1_Map

This interactive map visualizes regional TER train flow quality across France from 2013 to 2017. Users adjust two sliders to select a specific month and year, and the map updates its choropleth coloring accordingly, with a legend and hover tooltips showing precise values. The visualization uses D3 v4's `d3.geoConicConformal` projection and `d3.geoPath` to render the regions, while a color scale (`d3.scaleQuantize`) encodes the data from the provided CSV file.

AAminaSGitHub

76% match

Loading thumbnail…

Line Chart with Multiple Lines

This visualization examines unemployment across Spanish regions with two interactive SVG charts. The first chart displays 2014 unemployment rates as a horizontal bar chart, while the second tracks the evolution of these rates from 2007 to 2014 using a multi-line chart. The line chart uses d3.time.scale and d3.svg.axis to render annual data points, with hover effects that highlight individual paths. Regional CSV data is loaded and sorted via d3.csv, with the darkest bar representing the national total.

GGloriaYL

76% match

Loading thumbnail…

Line Chart with Multiple Lines

The visualization presents unemployment trends across Spanish regions from 2007 to 2014, with a supplementary bar chart detailing 2014 rates by region. It uses D3.js v3 to render SVG elements, including animated line paths that traverse the time series for each region, allowing hover highlighting to emphasize individual trends. The data is loaded from CSV files containing yearly unemployment percentages, with axes and scales built using d3.svg.axis and d3.time.scale.

GGloriaYL

76% match

Loading thumbnail…

V3_tp4_DataViz_V3

This visualization is a choropleth map of France showing influenza cases across administrative regions. It displays the spread and intensity of the disease over time, with a slider allowing viewers to step through weekly data. The map uses a five-color sequential scale, from light green to dark green, to represent the number of reported cases. The visualization is built with D3.js v3, using `d3.geo` for map projection and path rendering. It reads geographic data from a GeoJSON file (`region.txt`) and time-series data from CSV files (`GrippeFrance2014.csv`). A `d3.scale.threshold` maps case counts to colors.

AAminaSGitHub

75% match

Loading thumbnail…

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.

GGloriaYL

75% match

Loading thumbnail…

Gist a566cb49aea3e3fbdee61ae74d9fe99f

This visualization tracks the weekly incidence of influenza-like illness across French regions from 2003 to 2015, using a multi-line chart rendered in SVG with D3.js. Each line represents a region’s weekly reported case counts over time, revealing seasonal peaks and comparing regional patterns across more than a decade of epidemiological data. The chart includes a legend to identify regions and an interactive hover behavior that highlights the nearest data point and displays its value and date. The visualization effectively communicates the recurring yearly spikes in flu cases and the relative magnitude across regions, with France as a whole included for comparison. The line chart is complemented by a date-based x-axis and numeric y-axis, making temporal trends and regional differences easy to read.

FFrancoisDEAVEIRO

75% match