Skip to main content
SimilarExport ZIP
100%

Fork of d3 line chart

✓ Published0🌍 Public
Aalexis
Last edited Aug 14, 2024
Created on Aug 14, 2024
Forked from d3 line chart

This line chart displays population growth rates for the United States, Canada, and Mexico from 1890 to 2010, using data from the CORGIS Global Development dataset. The visualization plots three colored lines, each representing a country, with gray markers for individual data points. Built with d3.v7, the chart uses d3.line to generate the paths, d3.scaleLinear for the x and y axes, and d3.axisBottom and d3.axisLeft to render the axes. An interactive tooltip appears on mouseover, showing the country, year, and exact growth value.

AI-generated description

A line chart in D3

BTW: The data was simplified to help with creating this visualization.

Link to original dataset: https://corgis-edu.github.io/corgis/csv/global_development/

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of d3 line chart

A multi-line chart shows population growth rates for the United States, Canada, and Mexico from 1890 to 2010, using data simplified from the CORGIS Global Development dataset. Three colored paths, generated with `d3.line()` and `d3.scaleLinear`, represent each country over time. Hovering over any gray circle reveals a tooltip with the exact country, year, and growth value via mouse events. The chart uses D3 v7 to render an SVG with axes, a legend, and a black background.

Rrobertotienonyaranga@gmail.com
97% match
Loading thumbnail…

Fork of d3 line chart

A multi-line chart shows population growth rates for the United States, Canada, and Mexico from 1890 to 2010, using data simplified from the CORGIS Global Development dataset. Three colored paths, generated with `d3.line()` and `d3.scaleLinear`, represent each country over time. Hovering over any gray circle reveals a tooltip with the exact country, year, and growth value via mouse events. The chart uses D3 v7 to render an SVG with axes, a legend, and a black background.

Rrobertotienonyaranga@gmail.com
97% match
Loading thumbnail…

Fork of d3 line chart

A multi-line chart shows population growth rates for the United States, Canada, and Mexico from 1890 to 2010, using data simplified from the CORGIS Global Development dataset. Three colored paths, generated with `d3.line()` and `d3.scaleLinear`, represent each country over time. Hovering over any gray circle reveals a tooltip with the exact country, year, and growth value via mouse events. The chart uses D3 v7 to render an SVG with axes, a legend, and a black background.

Rrobertotienonyaranga@gmail.com
97% match
Loading thumbnail…

d3 line chart

This visualization shows population growth in the United States, Canada, and Mexico from 1890 to 2010, with each country represented by a colored line and gray circles for individual data points. Hovering over a circle displays a tooltip with the country, year, and population growth value. The chart uses d3.line and d3.scaleLinear to generate SVG paths, with data loaded from a simplified CSV derived from the Corgis global development dataset. Interactive mouseover, mousemove, and mouseout events control the tooltip's visibility and content.

AAndrew
94% match
Loading thumbnail…

d3 time series small multiples

This example visualizes population growth in the top five North American countries from 1990 to 2010 using small multiples, with each of the 15 charts representing a unique country-year combination. It shows the trends and comparisons of population growth rates across these nations. The visualization uses D3 v7 with SVG rendering, employing a color scale from ColorBrewer for country distinction and a legend from Susie Lu’s d3-legend library. The data comes from the Global Development dataset, simplified for clarity. Each small multiple displays a line chart with axes, and a tooltip provides interactive details on hover.

AAndrew
80% match
Loading thumbnail…

d3 scatterplot matrix

This scatterplot matrix visualizes North American population-health indicators, comparing fertility rate, life expectancy, and population growth across the United States, Canada, and Mexico. Each of the nine charts plots one variable against another, with data points colored by country using a d3.scaleOrdinal color scale and a legend rendered in SVG. The code loads data from a CSV file via d3.csv, filters incomplete records, and uses d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.extent to build axes and scale the plots.

AAndrew
79% match
Loading thumbnail…

Fork of Line Chart

This visualization presents a line chart of population over time for different countries, with the year on the x-axis and current population on the y-axis. The code uses d3.csv to load population data from a GitHub gist, then applies d3.scaleTime and d3.scaleLinear to map the data, and d3.line to generate the path. The SVG rendering includes axis labels and a title, with the line path styled in red via CSS. The example demonstrates a straightforward data-driven chart using D3 v5.

0057SatvikDamera
78% match
Loading thumbnail…

d3 bubble chart

A bubble chart visualizes the relationship between urban population growth and total mobile cellular subscriptions for the US, Canada, and Mexico, with each bubble’s radius encoding subscriptions per 100 people. The D3 v7 code loads CSV data, filters to three North American countries, and uses a log-scaled y-axis with d3.scaleLog. Circles are rendered as SVG elements with tooltips, using d3.axisBottom and d3.axisLeft for axes. Data comes from the Global Development dataset hosted on GitHub.

AAndrew
77% match