Fork of Making a simple bar chart

Fork of Making A Bar Chart

This example displays a horizontal bar chart of population figures for the ten most populous countries, with each bar’s length proportional to its population value. The visualization uses D3 v7’s `scaleLinear` and `scaleBand` to map the data, and renders the chart as SVG elements created with `selectAll` and `enter()`. Population values are loaded from a CSV file and multiplied by 1000, with axes generated using `axisLeft` and `axisBottom`.

FFahad Bin Emran

Fork of Making a Bar Chart

D3.csv loads country population data (in thousands) to create a horizontal bar chart for the top ten most populous countries. D3 scaleBand positions country categories along the y-axis, while d3.scaleLinear maps population counts to bar widths on the x-axis. The chart renders as an SVG with axisBottom and axisLeft, using a custom tick formatter to abbreviate large numbers. No interaction is included; a static red border frames the visualization.

EElouafi87

Fork of Making BarChart

This horizontal bar chart displays the population of the ten most populous countries, using a linear scale for population and a band scale for country names. Built with D3 v5, it loads data from a CSV file via `d3.csv` and renders bars as SVG rectangles. The chart includes a formatted x-axis with tick labels shortened using `d3.format`, a title, and removes redundant axis lines. Margins are applied through a transformed group element.

DDhiva21

Fork of Making a Bar Chart

This example shows a horizontal bar chart of population figures for ten countries, with each bar’s length proportional to its value and country names on the y-axis. The chart uses D3 v5’s `csv`, `scaleLinear`, and `scaleBand` to map the data, along with `axisLeft` and `axisBottom` for labeled scales. Bars are rendered as SVG `rect` elements, colored steelblue via CSS, with margins set around a 960×500 viewport. The data comes from a CSV file listing country and population in thousands.

Ggaowxx@qq.com

Fork of Making a Bar Chart

This horizontal bar chart displays the populations of the top 10 most populous countries, sourced from a CSV file. Using d3.csv, d3.scaleLinear, and d3.scaleBand, it renders bars as SVG rectangles. The code demonstrates axis customization with d3.axisLeft and d3.axisBottom, including a custom tick format that converts large numbers to abbreviated labels like "B" for billions.

QQuinn Sebso

Fork of Making a Bar Chart

A fork of "Making a Bar Chart" visualizes the 2018 population estimates for the top ten most populous countries, using a horizontal bar chart with a linear x-axis and a banded y-axis. The D3 v5 code loads data from a CSV file and applies custom axis formatting, converting large numbers to abbreviated labels. It uses `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the chart, with the rendering output as SVG.

Jjuanmy400

Fork of Making A Bar Chart

This example shows a horizontal bar chart of the ten most populous countries using population data from a local CSV file. The visualization renders as an SVG, with each country represented by a steel-blue bar sorted by default in data order (China through Mexico). The code imports D3 v7 modules including `csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to load the data, map population values to pixel widths, position country labels on the y-axis, and display numeric population on the x-axis. The chart applies margins and appends axes and rectangles to a single `<g>` group element.

AAlex Quan

Fork of Making a Bar Chart

This horizontal bar chart displays population figures for ten countries, with each bar’s length proportional to the population value from a CSV file. The visualization uses D3 v6’s `scaleLinear` for the x-axis, `scaleBand` for categorical y-axis positioning, and SVG `rect` elements for bars. Data is loaded asynchronously via `d3.csv` and multiplied by 1000 before rendering. Axes are generated using `axisLeft` and `axisBottom`, with margins applied through a translated group element.

MMajaha21