DanielleW

@DanielleW·5 public vizzes

GDP per capita of 10 largest economies

The chart displays the GDP per capita of the ten largest economies from 1960 to 2014, using a multi-line time series. The United States, Japan, and China are highlighted in red to stand out, while the remaining countries are shown with default styling. The data is loaded from a CSV file, and each country's yearly values are reshaped into an array of year-amount pairs. The visualization is built with D3 v3, utilizing `d3.time.scale` for the x-axis, `d3.scale.linear` for the y-axis, and `d3.svg.line` to draw each country’s trajectory as an SVG path.

Apr 26, 2015

Loading thumbnail…

Scatterplot - Internet Access by Mean Years of Schooling

This scatterplot shows the relationship between the percentage of a country’s population with internet access and its mean years of schooling, using data from the HDR2014.csv file. Each point represents a country and is colored by region. The visualization uses d3.csv to load the data, d3.scale.linear for the axes, and d3.svg.axis to render them. Circles are sorted and animated with a transition that increases their radius. Hovering reveals tooltips with country-specific details via SVG title elements.

Apr 19, 2015

Loading thumbnail…

Loading My CSV Data with D3

This visualization loads a CSV of 2014 Human Development Index data and renders it as a scatterplot using D3 v3 with SVG. Each country is represented by a circle plotted by Life Expectancy on the x-axis and Mean Schooling on the y-axis, with country size encoding GNI per capita. Points are colored by region (Europe, Asia, North America, etc.) and labeled with country names. The chart includes axis labels, a legend for regional colors, and a title. A drop-down menu allows viewers to select different data columns to map to the x- and y-axes, dynamically updating the circles and tooltips. The visualization emphasizes the relationship between health, education, and income across countries, using D3’s data-join and scales to bind the CSV data to SVG circles and text elements.

Apr 13, 2015

Loading thumbnail…

Loading My CSV Data with D3

This example demonstrates the initial step of loading a CSV dataset (the HDR 2014 Human Development Report) into a web page using d3.csv in D3.js version 3. The SVG canvas displays static decorative shapes—colored rectangles, circles, lines, and text—alongside the data-loading routine, with the loaded data only logged to the browser’s console. The code uses the jQuery-like callback pattern of d3.csv to parse the CSV file, which contains country-level indicators like HDI and internet access, and the rendering relies on inline SVG elements.

Mar 31, 2015

Loading thumbnail…

UN - Human Development Report Data

This visualization plots United Nations Human Development Index (HDI) data for 2013, mapping countries along axes of life expectancy, schooling, GNI per capita, and internet usage. Each country is represented as a point, with its position and size reflecting its development metrics. The scatterplot uses the HDI value as a color scale, highlighting the relationship between income, health, education, and technology access across nations. The chart is built from a Gist by DanielleW, encoding six quantitative variables for each of the 58 countries shown.

Mar 25, 2015