Skip to main content
SimilarExport ZIP
100%

Making a Bar Chart

✓ Published0🌍 Public
Ttracy3057
Last edited Dec 2, 2020
Created on Dec 1, 2020
Forked from Making a Bar Chart

This bar chart displays the number of employed people across various occupations from 2010 to 2019, using data from the United Nations World Population Prospects. It demonstrates how to customize D3 axes for a horizontal bar layout. The visualization uses d3.csv to load yearly datasets, d3.scaleLinear and d3.scaleBand for scales, and d3.axisLeft and d3.axisBottom for the axes, rendered as SVG elements. The code also includes a video tutorial in the README.

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…

Making a Bar Chart

This bar chart displays the number of employees in various occupations, using data from the United Nations’ World Population Prospects 2017. Built with D3 v5 and rendered as SVG, it shows a horizontal bar chart with a linear x-axis for employee counts, formatted with abbreviations, and a categorical y-axis for occupation names. The code customizes axes by removing domain lines and tick marks, and adds labels and a title. The chart uses `d3.scaleLinear`, `d3.scaleBand`, `d3.axisBottom`, and `d3.axisLeft`.

Ttracy3057
91% match
Loading thumbnail…

Making a Bar Chart

A horizontal bar chart displays the 2018 population estimates for the ten most populous countries from the United Nations World Population Prospects. The visualization uses d3.csv to load the data, then constructs the chart from an SVG with d3.scaleLinear for the population axis and d3.scaleBand for country categories. Axes are rendered via d3.axisLeft and d3.axisBottom, while rectangular bars are appended through a data join with fill styling from the stylesheet.

DDaniel Piqué
84% match
Loading thumbnail…

Making a Bar Chart

A bar chart displays the population of ten countries using 2018 data from the United Nations World Population Prospects. The visualization loads a CSV file with population values and maps them to horizontal bars, with country names on the y-axis and population counts on the x-axis. Using D3 v5, the code employs `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the SVG chart, while `csv` loads the data and `max` determines the scale domain. The bars are rendered as SVG rectangles with steelblue fill.

BBossmaen
84% match
Loading thumbnail…

Making a Bar Chart

A horizontal bar chart displays the 2018 population estimates for the ten most populous countries, sourced from the United Nations World Population Prospects 2017. The visualization is built with D3 v5, using `scaleLinear` for the population axis and `scaleBand` for the categorical country axis, rendered as SVG rectangles. Axis ticks and labels are added via `axisLeft` and `axisBottom`, with data loaded from a CSV file and population values multiplied by 1000 to reflect actual counts.

AAnne Kerr
83% 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. It demonstrates D3 axis customization, including formatted tick labels that convert large numbers to abbreviations and styled gridlines. The code uses d3.csv to load data, scaleLinear and scaleBand for scales, and axisLeft and axisBottom for axes. Bars are rendered as SVG rectangles, with a title and axis label added via text elements.

MMithun Ghosh
82% match
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
82% match
Loading thumbnail…

Making a Bar Chart

This bar chart shows the estimated 2020 populations of several countries, using data from the United Nations World Population Prospects 2017. Population values are displayed as horizontal bars, sorted alphabetically by country name, with the chart rendered as an SVG. The visualization uses d3.csv to load the data, and d3.scaleLinear and d3.scaleBand to map population values and country names to screen positions. Axes are generated with d3.axisLeft and d3.axisBottom, while bars are appended as SVG rectangles with a steelblue fill.

Vvic126
82% match
Loading thumbnail…

Making a Bar Chart

This example shows the population of the ten most populous countries in 2018, drawn as a horizontal bar chart with a customized axis. The chart uses D3 v5 APIs including `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to position bars and render labels, with tick formatting that converts values to billions. Data from the United Nations World Population Prospects is loaded via `d3.json`, then multiplied by 1,000. The SVG output includes a title and axis label, with grid lines removed for a cleaner presentation.

DDeanna Bosschert
82% match