Small Multiples Scatter Plot

100%

Small Multiples Scatter Plot

✓ Published0🌍 Public

Last edited Nov 30, 2017

Created on Nov 30, 2017

Small multiples of scatter plots show employment-population ratio against unemployment-population ratio for eight gender-age groups, based on 2015 OECD data. The grid is organized with age categories as columns and gender as rows. Each small chart encodes the same x/y scales so the facets can be compared directly. Dots are hollow circles with a subtle stroke; female subgroups are distinguished by a pinkish stroke. Hovering highlights the same country across all panels, enabling cross-comparison between demographics. Axes and labels are provided in each panel, using D3 v4 with SVG rendering.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/alex-rind/'>alex-rind</a>'s block: <a href='http://bl.ocks.org/alex-rind/4e767cec43faa8b1bd69603f40af9eb7'>Scatter Plot</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This scatter plot shows the relationship between employment-to-population and unemployment-to-population ratios across European countries for different age groups, using data from a CSV file. The visualization filters the data to display only the "Total" age group, with each circle representing a country. Circles are colored with pink strokes for women and blue strokes for men, and hovering over a circle highlights it in gray while displaying the country name as a tooltip. The x-axis maps the employed population ratio, the y-axis maps the unemployed population ratio, and axis labels clarify the variables. The plot uses fixed scales for both axes and is rendered as an SVG with D3 v4.

Aalex-rind

83% match

Loading thumbnail…

Working Hours Scatter Plot

A scatter plot displays the relationship between age and hours worked per week for individuals from the 1994 Census Income Data Set, with each point colored by gender. The visualization uses D3 v5's `scaleLinear`, `axisBottom`, and `axisLeft` APIs to construct the axes and gridlines, while `select` and `csv` load and bind the data. The SVG rendering applies a semi-transparent fill to each circle, and a legend distinguishes male and female data points. Hovering over a circle changes its fill to whitesmoke.

AAmar Nath Yogi

72% match

Loading thumbnail…

Scatterplot

A scatterplot shows the relationship between life expectancy at birth and unemployment rate for countries, with each circle representing a country and a tooltip revealing its name and exact values. The visualization animates circles from off-screen to their x-axis positions sorted by life expectancy, using d3.csv to load data from Countries.csv. It employs d3.svg.axis for labeled axes, d3.scale.linear for coordinate mapping, and transition with delay and duration to produce the staggered animation effect. Circle color changes on hover via CSS.

LLTymn

70% match

Loading thumbnail…

Countries Scatter plot

A scatter plot displays the relationship between fertility rate and urban population for 50 countries, with each circle representing a nation. The chart uses D3.js to create a linear x-scale for fertility rate and a reversed linear y-scale for urban population percentage. Grid lines extend from both axes, and axis labels clarify the variables. Data comes from a CSV file parsed with `d3.csv`, while the visualization is rendered as an SVG with circles styled in semi-transparent purple.

Aarieltonglet

70% match

Loading thumbnail…

Scatter Plot

A scatter plot displays the populations of the ten most populous countries, with circles positioned along a linear population axis and a point scale for country names. The visualization uses D3 v5 APIs including `scaleLinear`, `scalePoint`, `axisBottom`, and `axisLeft`, reading data from a CSV file. Population values are multiplied by 1000, formatted with ticks using `format('.3s')`, and rendered as steelblue circles in an SVG. Grid lines extend across the plot, with axes labels and a title.

SSamuel Elbaz

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

69% match

Loading thumbnail…

Scatter plots

This scatter plot displays population figures for five countries, with each circle positioned along a y-axis of country names and an x-axis of population values. The visualization uses d3.csv to load the data, converts population strings to numbers, and renders SVG circles scaled with d3.scaleLinear and d3.scalePoint. Axis creation relies on d3.axisLeft and d3.axisBottom, with tick formatting that replaces "G" with "B" for billion. The chart includes gridlines, axis labels, and a title, with styling applied via external CSS.

TTimothy sit

69% match

Loading thumbnail…

Scatter Plot

This scatter plot displays population data for ten countries, with each country positioned along the y-axis and its population plotted on the x-axis using a linear scale. The visualization uses D3 v6 with SVG rendering, employing `d3.scaleLinear` and `d3.scalePoint` for axes, while `d3.axisLeft` and `d3.axisBottom` generate ticks with a custom number formatter that converts large values to billions. Data comes from a CSV file showing 2018 population figures, which are multiplied by 1000 during processing. The chart includes a title, axis labels, and a steel-blue circle for each country.

CChristine Lanser

69% match