Skip to main content
SimilarExport ZIP
100%

Making a Bar Chart!

✓ Published0🌍 Public
Sscotti15
Last edited Mar 26, 2020
Created on Mar 26, 2020

This example displays a horizontal bar chart ranking the ten most populous countries based on 2018 estimates from the UN’s World Population Prospects. Each bar’s length encodes population in thousands, with country names on the y-axis. Built with D3 v5, the visualization uses `scaleLinear` and `scaleBand` to map data to SVG rectangles, alongside `axisLeft` and `axisBottom` for chart axes. Population values from `data.csv` are multiplied by 1000 during loading. The chart is rendered entirely as SVG elements styled with CSS.

AI-generated description

This bar chart shows population of the top 10 countries. The data comes from the year 2018 estimate in World Population Prospects 2017.

MIT Licensed

Similar vizzes

Loading thumbnail…

Making a Bar Chart

This example presents a horizontal bar chart of the populations of the ten most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The visualization uses D3 v5 to load a CSV file with `d3.csv`, then scales the data with `scaleLinear` for the x-axis and `scaleBand` for the y-axis. Axes are generated with `axisLeft` and `axisBottom`, while bars are appended as SVG `rect` elements. Population values are multiplied by 1,000 before rendering.

Mmargaretgoode
95% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the populations of the ten most populous countries, using 2018 estimates from the United Nations World Population Prospects. The visualization pairs a linear scale for population values with a band scale for country names, rendering horizontal bars in SVG. Built with D3 v5, the code uses `d3.csv` to load the data, `scaleLinear` and `scaleBand` for scaling, and `axisLeft` and `axisBottom` to draw the axes. Population figures are multiplied by 1000 to reflect actual counts.

JJack Middlebrook
95% match
Loading thumbnail…

Making a Bar Chart

This example displays the population of the ten most populous countries, based on 2018 United Nations estimates from World Population Prospects 2017, as horizontal bars. The chart uses D3 v5 with `d3.scaleLinear` for the x-axis, `d3.scaleBand` for the y-axis, and `d3.axisLeft` and `d3.axisBottom` for tick rendering. Data is loaded from a CSV via `d3.csv`, and each bar’s width is scaled proportionally to population values, multiplied by 1000. The SVG output is styled with steelblue rectangles.

RReshma R
95% match
Loading thumbnail…

Making a bar chart!

This bar chart displays the population of the top 10 most populous countries, using 2018 estimates from the United Nations World Population Prospects. Each bar’s length encodes population, while country names label the y-axis. Built with D3 v5, it uses `d3.csv` to load data, `scaleLinear` and `scaleBand` for positioning, and `axisLeft`/`axisBottom` for axes, rendering as SVG. Country populations are multiplied by 1000 to reflect the raw data’s units.

Iishmam11
94% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays the population of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The visualization uses D3 v5’s `scaleLinear` and `scaleBand` to map populations and country names to the SVG canvas, with axes drawn via `axisLeft` and `axisBottom`. The chart’s bars are rendered as SVG rectangles, styled with CSS. Population values are loaded from a local CSV file and multiplied by 1,000 before rendering.

CCL
94% match
Loading thumbnail…

Making a Bar Chart

This example presents a horizontal bar chart showing the population of the top 10 most populous countries, based on 2018 estimates from the United Nations World Population Prospects 2017. It uses D3 v5's `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` APIs to map population values and country names to SVG rectangles. Data is loaded from a CSV file and processed by multiplying the population values by 1000. The chart renders entirely as SVG, with bars styled in steelblue, and the code illustrates a basic data-join and margin setup for reusable visualization.

Vvoiletymr
94% match
Loading thumbnail…

Making a Bar Chart

This example shows a horizontal bar chart ranking the top 10 most populous countries based on 2018 estimates from the United Nations World Population Prospects. It uses D3 v5 (d3.scaleLinear, d3.scaleBand, d3.axisLeft, d3.axisBottom) to map population values to bar lengths and country names to y-axis positions. The chart customizes axes by removing domain lines and tick marks, and formats tick labels with a custom function replacing 'G' (giga) with 'B' (billion). Population data is read from a CSV file and multiplied by 1000 before rendering as SVG rectangles.

KKevinw97
94% match
Loading thumbnail…

Making a Bar Chart

This example presents a bar chart of the populations of the ten most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The chart shows each country labeled on the y-axis and the population value on the x-axis. The visualization is built with D3 v5, using `select` to target the SVG, `csv` to load data, `scaleLinear` and `scaleBand` for axes, and `axisLeft` and `axisBottom` to render them. The bars are drawn as SVG rectangles, and the data is scaled by a factor of one thousand.

UUtkarsha Kapoor
94% match