Fork of Making a Bar Chart

100%

Fork of Making a Bar Chart

✓ Published1🌍 Public

Last edited Jan 10, 2021

Created on Jan 10, 2021

This bar chart displays the 2018 population estimates for the ten most populous countries, using data from the United Nations' World Population Prospects 2017. The visualization employs D3 v6 APIs including `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to create an SVG rendering with horizontal bars. Population values are formatted in thousands, with each rectangle’s width scaled proportionally and countries listed on the y-axis. The chart is built with a margin-based layout and uses `selectAll` to bind data to SVG rectangles.

AI-generated description

This bar chart shows population of the top10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017.

MIT Licensed

Similar vizzes

Loading thumbnail…

Making a Bar Chart

This bar chart visualizes the 2018 population estimates for the ten most populous countries, with data from the United Nations World Population Prospects 2017. It displays horizontal bars ordered by population, using a linear scale for the x-axis and a band scale for country names on the y-axis. The visualization is built with D3 v5, using `d3.csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render the SVG elements. Population values are converted from thousands to raw numbers before plotting.

Ssourcebox-bug

95% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the 2018 population estimates for the top 10 most populous countries, sourced from the United Nations World Population Prospects 2017. The visualization uses d3.scaleBand and d3.scaleLinear to map countries and their populations to SVG rectangles, with d3.axisLeft and d3.axisBottom providing labeled axes. The code also demonstrates D3 axis customization through formatting functions, rendering the chart entirely as SVG within a 960×500 viewport.

Bbcrobbin

95% match

Loading thumbnail…

Fork of Making a Bar Chart

This example visualizes the population of the 10 most populous countries using 2018 estimates from the United Nations World Population Prospects. Horizontal bars represent each country’s population, with a linear scale mapping values to bar width and a band scale positioning rows. The SVG chart is built with d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom, while data is loaded asynchronously from a JSON file. The chart renders static bars and axes with no interactivity, styled via a linked CSS file.

TTCSMFrogdance

95% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the population of the ten most populous countries using 2018 estimates from the United Nations’ World Population Prospects. The chart uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render a horizontal bar chart with custom tick formatting that converts large numbers into a readable scale. Population values are multiplied by 1000 from the CSV data, and the chart is rendered as SVG within a 960x500 viewport.

MMaicolJGM

95% match

Loading thumbnail…

Making a Bar Chart

This bar chart displays the 2018 population estimates for the ten most populous countries, sourced from the United Nations World Population Prospects 2017. The chart uses horizontal bars, with countries on the y-axis and population on the x-axis, rendered as an SVG. The visualization is built with D3 v5, employing `scaleLinear` and `scaleBand` for scales, and `axisLeft` and `axisBottom` to draw the axes. Data is loaded from a CSV file using D3’s `csv` function, and population values are multiplied by 1000 to reflect the actual figures.

Aahmadazharza

95% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the population of the ten most populous countries, based on 2018 estimates from the United Nations World Population Prospects. The visualization uses the D3 v5 library to load data from a CSV file and render an SVG graphic. Population values are scaled linearly on the x-axis, while country names are positioned on a band scale along the y-axis. The chart is styled with a steelblue fill for the bars, and axes are generated using D3's `scaleBand`, `scaleLinear`, `axisLeft`, and `axisBottom` functions.

CCecilia831

95% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the population of the ten most populous countries, based on 2018 estimates from the United Nations World Population Prospects. It uses d3.csv to load the data, then renders horizontal bars with d3.scaleLinear for the x-axis and d3.scaleBand for the y-axis. The chart applies d3.axisLeft and d3.axisBottom for labeling, and draws the bars as SVG rectangles with a steelblue fill.

DDINESH SAI BOPPANA

94% match

Loading thumbnail…

Fork of Fork of Fork of Making a Bar Chart

This bar chart displays the 2018 population estimates for the ten most populous countries, drawn from United Nations data. It uses D3 v5 APIs including `select`, `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render an SVG graphic. The chart customizes axes by removing gridlines and domains, and formats population values using `format('.3s')` to abbreviate numbers with a 'B' suffix, while the x-axis label is annotated as "Population". Bars are filled with a steelblue color via CSS.

Jjohncoder21

94% match