Skip to main content
100%

Reusable scatter plot with axis labels and tooltip

✓ Published4🌍 Public
YYiorgos Bagakis
Last edited Nov 11, 2022
Created on Nov 7, 2022

This reusable D3.js scatter plot visualizes the relationship between urban population percentage and fertility rate for EU countries in 2022, sourced from Worldometer population data. Written as a modular `scatterPlot()` function, it uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to render axes with red labels, while circles display tooltips on hover via a styled HTML `div` that shows each country's name. The SVG output adapts to the full window size, and the code includes commented-out logic for animated cycling through data columns, though that feature is not active.

AI-generated description

Reusable scatter plot with axis labels and tooltip inspired by Towards Reusable Charts.

Shows the Countries in the EU by population (2022) table of data.

MIT Licensed

Similar vizzes