Scatter Plot, single js file

100%

Scatter Plot, single js file

✓ Published1🌍 Public

Last edited May 25, 2021

Created on May 25, 2021

This scatter plot visualizes the populations of the top 10 most populous countries, with each circle’s x-position corresponding to population (in thousands) and y-position to country name. It uses D3 v5’s `scaleLinear`, `scalePoint`, `axisLeft`, `axisBottom`, and `format` to create and label the axes, while a linear scale maps population values. Data comes from the 2018 United Nations World Population Prospects. The SVG rendering applies custom tick styling, removes axis domains, and adds a title and axis label.

AI-generated description

This bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017. It also demonstrates customization of D3 axes.

See also the first bar chart visualization that this one builds on: Making a Bar Chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

ScatterPlot2

This scatterplot displays the populations of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects. It uses D3 v5 to render circles on an SVG canvas, with a linear scale for population and a point scale for country names. The code employs `d3.csv` to load the data, `scaleLinear` and `scalePoint` for positioning, and `axisBottom` and `axisLeft` for customized axes with tick marks and labels.

Llerik03

93% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the top 10 most populous countries using circles positioned along a point scale for country names and a linear scale for population values from the 2018 UN World Population Prospects estimate. The code uses D3 v5 APIs including `csv`, `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` to render SVG elements, with tick formatting converting values to billions. Circle radii are fixed at 18 pixels, and gridlines extend across the plot area. The visualization features a title and axis labels, with data loaded from a local CSV file.

Ddtdenver

92% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the population of the top 10 most populous countries, with circles positioned along a linear population scale and a point scale for country names. The code uses d3.scaleLinear, d3.scalePoint, d3.axisLeft, and d3.axisBottom to render the axes and plot, while custom tick formatting converts large numbers to abbreviated units. Data comes from the 2018 United Nations World Population Prospects estimate, loaded via d3.csv from a local CSV file, and rendered as SVG circles with a fixed radius.

Sshanmango

92% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the populations of the top 10 most populous countries in 2018. It uses D3 v5 with SVG rendering to create a clear, labeled visualization. The code employs `scaleLinear` and `scalePoint` for positioning, `axisLeft` and `axisBottom` for the axes, and format specifiers to abbreviate large population numbers. Data is loaded from a local CSV file containing country names and population estimates from the United Nations World Population Prospects.

Aadvaitkulkarni08

92% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the populations of the 10 most populous countries, using a linear x-scale for population values and a point y-scale for country names. The code builds the visualization with D3 v6, using `scaleLinear`, `scalePoint`, `axisBottom`, and `axisLeft` to render the axes and SVG circles for each data point. Population data from the 2018 United Nations World Population Prospects is loaded via `csv`, then scaled to thousands. The plot includes axis labels and a title, with country names positioned along the y-axis.

Ssgzzhinde

92% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the population of the top 10 most populous countries, using data from the 2017 United Nations World Population Prospects. The code uses D3 v5 to create an SVG visualization with circles positioned by d3.scaleLinear for population and d3.scalePoint for country names. Axes are customized with d3.axisBottom and d3.axisLeft, including tick formatting that converts values to billions. The chart includes axis labels and a title, with styling applied through external CSS.

Hhberrong

92% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes the population of the top 10 most populous countries using data from the 2018 United Nations World Population Prospects. D3 v5 renders the visualization in SVG, using `d3.scaleLinear` and `d3.scaleBand` for the axes, with axis labels and ticks customized through `d3.axisBottom` and `d3.axisLeft`. Circles represent each country, positioned by population on the x-axis and country name on the y-axis.

ZZhi Guangda

92% match

Loading thumbnail…

Scatter Plot

This scatter plot displays the top 10 most populous countries, using a circle for each nation positioned along a linear population scale and a point scale for country names. The visualization reads population data from a CSV file sourced from the UN World Population Prospects, multiplying values by 1000 to reflect actual figures. Built with D3 v6, it uses `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` to render SVG elements, with custom tick formatting converting billions to "Md" and dashed grid lines for readability.

Aalobry

92% match