Fork of Fork of Fork of Making a Bar Chart

100%

Fork of Fork of Fork of Making a Bar Chart

✓ Published0🌍 Public

Last edited Jul 29, 2021

Created on Jul 29, 2021

Forked from 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.

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.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Making a Bar Chart

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.

AAndrewRiceMGW

94% match

Loading thumbnail…

Fork of Fork of 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 chart uses a linear scale for the population axis and a band scale for countries, with bars rendered as SVG rectangles. It customizes the D3 axes, including a formatted tick label that converts large numbers to abbreviated units and removes default axis lines. The code loads data from a CSV file and relies on d3.csv, scaleLinear, scaleBand, axisBottom, axisLeft, and format.

Sskambhore04

94% match

Loading thumbnail…

Fork of Fork of 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. It shows how D3 v5 axes can be customized to improve readability of the value labels. The SVG rendering uses d3.csv to load data and d3.scaleBand with d3.scaleLinear for positioning, while d3.axisBottom creates the x-axis. The page also includes a separate SVG element demonstrating a circle update pattern with d3.select and .join.

Jjohncoder21

94% match

Loading thumbnail…

Fork of Fork of Making a Bar Chart

This bar chart shows the population of the top 10 most populous countries, based on 2018 estimates from the United Nations’ World Population Prospects. It uses D3 v5’s `select`, `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, `axisBottom`, and `format` APIs to render the SVG. The population values are multiplied by 1000 from the CSV data, and axis ticks use a custom formatter to convert values to billions. The chart includes a title, axis label, and horizontal grid lines.

Aanummunirmughal

94% 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

94% match

Loading thumbnail…

Fork of Making a Bar Chart

This chart presents the 2018 estimated populations of the ten most populous countries from United Nations data, with bars colored steel blue that turn red on hover and display the exact population count. It uses D3 v5 with `csv` loading, `scaleLinear` and `scaleBand` for positioning, and `axisLeft` and `axisBottom` for labeled axes with custom tick formatting that abbreviates millions. The SVG rendering includes smooth `transition` effects for color changes on mouseover and mouseout, while styling is handled via an external stylesheet.

Jjunior-armando

93% 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

93% match

Loading thumbnail…

Fork of 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 chart shows population values on a linear scale and countries on a band scale, with custom axis formatting converting values to abbreviated units like billions. Built with D3 v5, the code uses `d3.csv`, `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to render an SVG, with styled rect elements and labels.

Mmaavwin

93% match