Gonzalo Montañés

@gonzalomontanes·7 public vizzes

Global Live Coronavirus Deaths Over Time

A line chart visualizes global cumulative COVID-19 deaths over time using a logarithmic y-axis. The chart loads daily global death totals from a Johns Hopkins University CSV dataset, parses the data with `d3.csv` and `timeParse`, and renders an SVG line using `d3.line`, `scaleTime`, and `scaleLog`. Red strokes mark the trend, with gridlines and labeled axes generated by `axisBottom` and `axisLeft`. The React component updates as new data becomes available.

Dec 5, 2021

Loading thumbnail…

Foreign Population in Germany by Selected Citizenships and Years

This example shows the foreign population in Germany by selected citizenships and years, using a streamgraph to display changes across six categories. It uses d3.stack with the stackOffsetWiggle and stackOrderInsideOut settings, and renders the chart with SVG paths generated via d3.area. The data comes from two CSV files, merged and aggregated by the code before rendering. The visualization includes major and minor time axes, and uses d3.scaleOrdinal with a category color scheme to differentiate the series.

Dec 5, 2021

Loading thumbnail…

A Week of Temperatures Around the World Various Lines Chart

This line chart displays one week of temperature readings in Celsius across multiple cities, with each city represented as a distinct colored line. The visualization uses a nested data grouping to organize city series and sorts them by their final temperature value. Built with d3 v5, the code employs scaleTime and scaleLinear for axes, a line generator with curveBasis for smooth paths, and an ordinal color scale from schemeCategory10. The visualization renders to SVG and pulls its data from the Data Canvas - Sense Your City dataset.

Dec 3, 2021

Loading thumbnail…

Top Countries By Population Bar Chart

This bar chart displays the top 10 most populous countries for 2020, using horizontal bars to compare population sizes. The chart is built with React and D3 v5, using `scaleBand` for the categorical y-axis and `scaleLinear` for the population x-axis. Data comes from the United Nations World Population Prospects 2019, loaded via D3's `csv` function. The SVG rendering includes custom axes and marks, with tooltips formatted using D3's `format` function to show values in billions.

Nov 22, 2021

Loading thumbnail…

Global Suicide Rates Linked Views with Fast Brushing

A world map displays suicide rates as red circles, sized by the number of suicides per location, with a time-series histogram beneath it. Brushing a time range in the histogram filters the circles displayed on the map. The visualization combines a React frontend with D3 v5 for SVG rendering, using `d3.geoNaturalEarth1` for the projection, `d3.geoPath` for geographic features, and `d3.brushX` for interactive filtering. Data comes from a CSV of city-level suicide statistics.

Nov 13, 2021

Loading thumbnail…

Distribution of Religions in Germany in 2014

Three pie charts show the distribution of Protestant, Roman Catholic, and other religious populations across total, urban, and rural areas of Germany in 2014. Using D3.js version 3.5.5, the visualization employs `d3.layout.pie` and `d3.svg.arc` to generate the slices, with `d3.scale.ordinal` positioning each chart along a shared x-axis. A categorical color scale and a D3 legend component distinguish the religions, while data from UN Data is loaded from a CSV file. The SVG rendering includes custom axes and labels.

Nov 12, 2021

Loading thumbnail…

Migrants Missing Worldwide Linked Views with Fast Brushing

This visualization displays migrant deaths and missing persons worldwide using a linked view of a bubble map and a date histogram. The map shows individual events as red circles sized by the total dead and missing count, while the histogram displays monthly totals over time. Users can brush on the histogram to filter the map's displayed events. The example uses React with D3 v5, employing `geoNaturalEarth1` projection for the map, `brushX` for interactive filtering, and reads data from a CSV of the Missing Migrants Dataset.

Nov 11, 2021