Reusable Scatter Plot

100%

Reusable Scatter Plot

✓ Published1🌍 Public

Last edited Oct 26, 2025

Created on Oct 26, 2025

This scatter plot visualizes population estimates by state and year, using a reusable d3.scalePoint for the x-axis, d3.scaleLinear for the y-axis, and d3.scaleOrdinal with d3.schemeTableau10 for color coding by year. Symbols vary by year through d3.symbol with circle, square, triangle, diamond, and star shapes. The SVG renders axes with d3.axisBottom and d3.axisLeft, includes rotated state labels and a legend, and pulls data from a CSV of Texas population estimates.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Population Scatter Plot

This scatter plot displays the population of each U.S. state along the horizontal axis, with state names on the vertical axis. Built with D3 v5, it uses `scaleLinear` for the population scale and `scalePoint` for the categorical state axis, rendering circles via SVG. Data is loaded from a CSV file using D3’s `csv` method, with axes created by `axisBottom` and `axisLeft`. Tick labels are formatted using `format` to abbreviate large numbers with "B" for billions, and the chart includes a title and axis label.

HHarshinireddyy19

81% match

Loading thumbnail…

Scatter Plot

A scatter plot displays the population of U.S. states from 2018 data, with each state represented as a circle positioned along a linear population axis and a categorical state axis. The visualization is rendered as an SVG using D3 v5, where the circle coordinates are computed via the `scaleLinear` and `scalePoint` scales, and axes are drawn with `axisBottom` and `axisLeft`. The chart includes a title and axis label, with population values formatted using D3's `format` function to abbreviate large numbers.

PPerry

81% match

Loading thumbnail…

scatter plot

This scatter plot displays the population of each U.S. state as a circle, with states positioned along the x-axis and population values mapped to the y-axis. It uses D3 v7 to load CSV data from a GitHub gist, converts the population values to numbers, and renders the plot as an SVG with `d3.scaleBand` for the categorical state axis and `d3.scaleLinear` for the population axis.

Ssivaparchuri2000@gmail.com

80% match

Loading thumbnail…

Fork of scatter plot

This scatter plot visualizes population by U.S. state, with each state represented as a circle positioned along a categorical x-axis and a linear y-axis scaled to population values. The code loads CSV data via d3.csv, converts population strings to numbers, and renders circles using d3.scaleBand and d3.scaleLinear for axes. Circles are appended to an SVG container with fixed coordinates computed from the scales, using a steelblue fill and a 5-pixel radius. The visualization highlights population disparities across states while maintaining a simple, readable layout.

Ssivaparchuri2000@gmail.com

79% match

Loading thumbnail…

Reusable D3 Scatter Plot

This example presents a population scatter plot, displaying the relationship between years and population size as individual steel-blue circles. The chart renders in full-screen SVG, with axes and labels for both dimensions. Built with D3 v7, the visualization uses `d3.csv` to load the population dataset, `d3.scaleLinear` for positioning, and `d3.axisBottom` and `d3.axisLeft` to draw the scales. The code is structured as a reusable `scatterPlot` function, which the main script configures via method chaining for dimensions, radius, color, and margins, then binds to the DOM with `d3.select('#chart').call(chart)`.

Aamalli7433@gmail.com

78% match

Loading thumbnail…

scatter

A scatter plot visualizes U.S. state population against their population rank for 2024, where each dot represents a state and rank 1 is the most populous. The chart uses D3 v7 with SVG rendering, employing `d3.csv` to load data, `d3.scaleLinear` for both axes, and `d3.scaleSequential` with the Blue interpolator for color encoding. Hover tooltips via SVG `<title>` elements reveal state details. Data comes from `usa_states_population_2024.csv`.

MManeesh Kumar

78% match

Loading thumbnail…

Reusable Scatter Plot

This reusable scatter plot displays population versus area for geographic data, with points colored by continent. The visualization uses D3.js v7 to load data via `d3.tsv`, applying a custom chart module that defines scales, axes, and tooltips. It renders circles positioned with `scaleLinear` and colored via `scaleOrdinal`, while interactive mouseover events trigger tooltips showing the point's label and values.

AAnurup Reddy

78% match

Loading thumbnail…

Scatter plot

This scatter plot shows population counts for several countries, with each country positioned along the y-axis and its population scaled along the x-axis. The visualization uses D3 v5 within a React framework, rendering to SVG. It employs `d3.csv` to load data, `d3.scaleLinear` for the x-axis, `d3.scalePoint` for the categorical y-axis, and `d3.axisLeft` and `d3.axisBottom` for labeled gridlines. A custom tick formatter abbreviates large numbers, and circles are appended with a fixed radius of 10.

VVPTomi

78% match