Fork of Making a Bar Chart

100%

Fork of Making a Bar Chart

✓ Published0🌍 Public

Last edited Feb 2, 2022

Created on Feb 2, 2022

This bar chart displays the top 10 most populous countries using 2018 population estimates from the United Nations World Population Prospects 2017 dataset, with bars sized by population. It demonstrates customized D3 axes: the linear x-axis uses a `d3.format` tick format that abbreviates large numbers, while the band-scaled y-axis removes its domain line and tick lines. The chart is rendered as an SVG using D3 v5, with `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` managing data loading and layout.

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 top 10 most populous countries based on 2018 estimates from the United Nations World Population Prospects. The visualization customizes D3 axes, removing domain lines and using tick marks that span the chart’s height. Population values are loaded from a CSV file and formatted with abbreviations like “B” for billions using `d3.format`. The chart is rendered with SVG elements, using `scaleLinear` for the x-axis, `scaleBand` for the y-axis, and `axisBottom` and `axisLeft` to generate ticks.

Ssnehareddygurram

96% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the top 10 most populous countries, using 2018 population estimates from the United Nations’ World Population Prospects 2017. The data is loaded from a CSV file and rendered as SVG rectangles. The visualization uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the axes, with custom tick formatting that abbreviates large numbers. A title and axis label are also included, and the chart demonstrates customization of D3 axes by removing default domain lines.

WWilliam He

96% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the top 10 most populous countries in 2018, using population estimates from the United Nations World Population Prospects 2017. The visualization uses D3 v5 APIs including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the chart, with data loaded from a CSV file. The chart features a custom tick formatter that converts large numbers to abbreviated units and includes axis labels and a title. The `svg` elements are rendered with a `steelblue` fill, demonstrating a basic D3 bar chart with customized axes and styling.

Ssohum42

96% match

Loading thumbnail…

Fork of Making a Bar Chart2

This bar chart displays the top 10 most populous countries, using data from the 2018 United Nations World Population Prospects. It shows the population for each country as a horizontal bar. The example demonstrates how to customize D3 axes, including tick formatting and removal of domain lines. It loads data from a CSV file using d3.csv and renders the chart with SVG elements, using d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom.

Kkashibr

96% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the top 10 most populous countries using 2018 estimates from the United Nations World Population Prospects 2017 in the data.csv file. It customizes D3 v5 axes by removing domain lines and tick lines from the y-axis, formatting population values with tick formatting that converts G to B, and adding axis labels and a title. The chart uses `d3.scaleLinear` for the x-axis, `d3.scaleBand` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` to render axes in SVG.

PPriyansh Ramnani

96% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart visualizes the top 10 most populous countries using 2018 estimates from the United Nations World Population Prospects 2017, with population values scaled by 1,000. The chart orders countries by population, displaying each bar’s length proportionally to its population via d3.scaleLinear and d3.scaleBand for categorical y-axis positioning. Axes are customized with d3.axisLeft and d3.axisBottom, including a tick formatter that converts G to B for billions, and a title and axis label are added as SVG text elements. The visualization is rendered in SVG using d3.csv for data loading and d3.select to manipulate the DOM.

MMillie

96% match

Loading thumbnail…

Fork of Making a Bar Chart

This bar chart displays the top 10 most populous countries using 2018 population estimates from the United Nations World Population Prospects 2017. The visualization uses D3 v5 APIs including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to render an SVG chart with custom tick formatting that abbreviates large numbers. The horizontal bars are colored steelblue, with a title and axis label added via appended SVG text elements. Data is loaded from a CSV file and processed in JavaScript before being mapped to bar widths and y-axis positions.

MManue21

96% match

Loading thumbnail…

Fork of 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 2017. The chart customizes D3 axes with a left-aligned y-axis and a bottom x-axis using `d3.axisLeft` and `d3.axisBottom`, while `d3.scaleLinear` and `d3.scaleBand` map populations and country names to SVG rectangles. Data is loaded from a CSV file via `d3.csv`, with populations multiplied by 1000 for accurate scaling.

AApril Fangzhu Guo

96% match