blog life expectancy

100%

blog life expectancy

✓ Published0🌍 Public

Last edited Mar 8, 2024

Created on Mar 8, 2024

This chart shows life expectancy growth from 1890 to 2010 for five North American countries: the United States, Canada, Mexico, Guatemala, and Cuba. Each country appears as a colored line, with gray circles marking individual data points. The chart uses a black background with white axes and labels, and the color scheme comes from the ColorBrewer Accent palette. The code loads simplified data from a GitHub-hosted CSV via `d3.csv`, applies `d3.scaleLinear` for both axes, and draws lines with `d3.line`. It builds the SVG output using `d3.select` and `d3.append`, while the legend is generated with `d3.scaleOrdinal` from the d3-legend library.

AI-generated description

A line chart with five lines, using color scale with color brewer 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…

d3 line chart (5 lines)

This line chart shows life expectancy growth from 1990 to 2010 for five North American countries, using colorbrewer’s Accent palette to distinguish each country. Built with D3 v7, the visualization draws five separate line paths using `d3.line()`, with gray circles marking individual yearly data points. The chart uses linear scales for both axes, with an ordinal color scale for the legend. The data is loaded from a CSV file via `d3.csv()` and simplified from the original global development dataset. The black background and white labels create high contrast, while the legend is added using the d3-legend plugin.

AAndrew

83% match

Loading thumbnail…

Line Chart

This line chart shows the life expectancy of the USA from 1800 to 2016, with the years on the x-axis and expectancy values on the y-axis. The React-based visualization uses D3 v5 scales and the `d3.line` generator to create the SVG path, with axes rendered via `d3.axisBottom` and `d3.axisLeft`. Data is loaded from a CSV file using `d3.csv` and parsed with `d3.timeParse`. Gridlines, axis labels, and a green stroke line are styled through CSS.

SSonuSriN

76% match

Loading thumbnail…

Area Chart

This area chart displays the life expectancy of the USA over time, with a blue line tracing the trend and an orange filled area beneath it, using a smooth curve. The visualization loads CSV data from a GitHub gist and renders as SVG via D3 v5, employing `scaleTime`, `scaleLinear`, `csv`, `area`, and `line` generators with `curveBasis`. It includes labeled axes for year and life expectancy, gridlines via tick sizes, and formatted tick labels.

SSonuSriN

75% 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

75% match

Loading thumbnail…

Area chart

This area chart displays the life expectancy of the USA across years, with a smooth curve filling the space beneath the line. The data is loaded from a CSV file via a GitHub gist. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `area`, and `curveBasis` functions within an SVG rendering, including labeled axes and a title. The y-axis tick labels are formatted using `format`, and the chart includes grid lines via axis tick sizing.

SSonuSriN

74% match

Loading thumbnail…

7q3

This example visualizes life expectancy across countries as a line chart, with each country plotted along the horizontal axis and life expectancy on the vertical axis, which is fixed between 60 and 90 years. The chart is rendered as an SVG using D3 v7, fetching CSV data from a GitHub gist. The code uses `d3.csvParse` to load the data, `d3.scaleBand` and `d3.scaleLinear` for positioning, and `d3.line` to draw the path. Axis labels are rotated for readability, and the line is styled in steelblue.

Kktvgs25@gmail.com

74% 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

73% match

Loading thumbnail…

A6 Diverging Color Scale Bar Chart

This example visualizes life expectancy in 1960 for a selection of countries using a diverging color scale bar chart. The bars are colored on a green-to-red gradient via a sequential scale with an RdYlGn interpolator, where higher life expectancies appear greener and lower ones redder. The chart uses D3 v7 to load data from a CSV file, create SVG bars with band and linear scales, and render axes with tick labels. A custom legend and axis titles are added using D3’s selection and axis methods, while the underlying data is sourced from a shortened TidyTuesday dataset.

AAllen Jake Polintan

73% match