Skip to main content
SimilarExport ZIP
100%

Stylized Bar chart - Countries by population

✓ Published1🌍 Public
AAlexander Dorling
Last edited May 14, 2021
Created on May 14, 2021

A bar chart visualizes the populations of the top 10 most populous countries, with horizontal bars ordered by country name and labeled with population values formatted in billions. Built with React and D3 v6, it loads UN population data from a CSV URL, sorts the first 10 rows, and uses scaleBand and scaleLinear to position marks. SVG rects render the bars with a yellow tooltip on hover, styled with the Poppins font.

AI-generated description

A program that creates a bar chart of the top 10 most populous countries. Using gist from Curran (datavis 2020).

MIT Licensed

Similar vizzes

Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the top 10 countries by population in 2020, using horizontal bars rendered as SVG rectangles. The chart features a clean, minimalist design with a yellow background circle, Poppins typography, and custom-styled tick marks. Built with React and D3 v6, it loads UN population data from a CSV file using d3.csv, then uses d3.scaleBand for the categorical y-axis and d3.scaleLinear for the continuous x-axis. Tooltips, formatted with d3.format to abbreviate large numbers, appear when hovering over each bar.

RRMartins11
95% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the top 10 countries by population, using the UN Population 2019 dataset. Each horizontal bar is rendered as an SVG rectangle, with country names on the y-axis and population values on the x-axis, formatted using d3.format. The chart prominently features a large title and axis labels styled with the Poppins font. Built with React and D3 v6, it uses scaleBand and scaleLinear to position bars and generate ticks, while the d3.csv loader parses the data and scales population values by 1000.

Fforcox43
95% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the top 10 most populous countries as horizontal bars, with the y-axis listing country names and the x-axis showing population in billions. The visualization uses React for component structure and d3.scaleBand and d3.scaleLinear for positioning, with SVG rectangles rendered in a teal color. Population data comes from the United Nations World Population Prospects 2019 dataset, loaded via d3.csv, and the chart includes axis labels, tick marks, and a tooltip showing the formatted population value on each bar.

AAniketh-Samson
94% match
Loading thumbnail…

Stylized Bar chart

This stylized bar chart displays the populations of the ten most populous countries in 2020, using horizontal bars sorted by country name. The visualization encodes population values through bar width, with a linear scale mapping populations up to the maximum value and a band scale positioning each country. Built with React and D3 v6, the chart renders as SVG, using components for axes and marks. Population data comes from the UN Population 2019 CSV, with values formatted in billions and styled with the Poppins font.

BbeauMarko
94% match
Loading thumbnail…

Stylized Bar Chart

A stylized bar chart displays the top 10 most populous countries, with population values on the x-axis and country names on the y-axis. Built with React and rendered as SVG, the chart uses D3's `scaleBand` and `scaleLinear` for scales, `format` for tick labels, and `csv` to load United Nations World Population Prospects 2019 data. The Poppins font and a teal color for bars provide the stylized aesthetic, while tooltips show formatted population values on hover.

Ssarabaghery76
94% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart visualizes the top ten countries by population using data from the UN Population 2019 CSV file. The horizontal bars are rendered as SVG rectangles, with a linear scale mapping population values to bar widths and a band scale positioning the discrete country categories vertically. Tooltips display formatted population values, while axis labels and ticks are generated using D3's scale API and React components. The chart uses the Poppins typeface and a custom color palette, with axis formatting converting values to billions.

LLisa Wagner
94% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the top 10 most populous countries using horizontal bars, with country names on the y-axis and population on the x-axis. Built with React and D3 v5, the chart uses `scaleBand` for the y-axis, `scaleLinear` for the x-axis, and SVG `rect` elements for the bars. Population values come from the UN World Population Prospects 2019 dataset, formatted with D3’s `format` to display values in billions. The visualization includes axis labels, tick marks, and hover tooltips via SVG `<title>` elements.

杨杨明俊
94% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the population of the top 10 most populous countries using horizontal bars, with country names on the y-axis and population values on the x-axis. The chart is implemented in React with D3 v5, using `scaleBand` and `scaleLinear` for positioning, while SVG rectangles render the bars via the `Marks` component. Population data comes from the United Nations World Population Prospects 2019, loaded as CSV with `d3.csv`. The chart features a custom Poppins font and teal-colored bars, with hover tooltips showing population values.

SSam
94% match