Skip to main content
SimilarExport ZIP
100%

Make a bar chart

✓ Published1🌍 Public
PPulkit Rohilla
Last edited Sep 26, 2019
Created on Sep 26, 2019
Forked from Make a bar chart

This bar chart displays the population of the top five countries from a CSV file, using horizontal bars scaled linearly to population values. The chart renders in SVG and employs d3.csv, d3.scaleBand, d3.scaleLinear, d3.axisLeft, and d3.axisBottom. The y-axis labels show country names, while the x-axis uses tick formatting to abbreviate numbers (e.g., "1.42B"). Axis lines and domain paths are removed, and custom text elements label the chart and axis.

AI-generated description

An example showing the capabilities of VizHub.

MIT Licensed

Similar vizzes

Loading thumbnail…

Make a bar chart

A horizontal bar chart displays the population of five countries, using steel-blue rectangles to encode values from a CSV file. The visualization uses D3 v5’s `scaleLinear` for the x-axis, `scaleBand` for the categorical y-axis, and `axisLeft` and `axisBottom` to render ticks. Data is loaded via `csv`, with population numbers converted from thousands, and the SVG is appended to a 960x500 viewport.

PPulkit Rohilla
92% match
Loading thumbnail…

Make a bar chart

This example displays a horizontal bar chart comparing the populations of five countries, using data from a local CSV file. It reads the data with `d3.csv`, scales the population values by 1000, and renders SVG rectangles with `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis. Axes are generated using `d3.axisLeft` and `d3.axisBottom`. The chart is styled with CSS, and the bars are colored steelblue.

PPulkit Rohilla
91% match
Loading thumbnail…

Making a bar chart

A horizontal bar chart displays the population of the top 10 most populous countries, with country names on the y-axis and a linear population scale on the x-axis. The chart uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to position bars and axes, with tick labels formatted like '1.42B'. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles, with a title and axis label added as text elements.

Yyoghurtx
90% match
Loading thumbnail…

Making a Bar Chart

This bar chart displays population estimates for five countries, with horizontal bars sorted by country name and scaled proportionally to population values loaded from a CSV file. The visualization uses D3 v5’s `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to map data to SVG rectangles, while the `csv` method parses the data and converts population strings to numbers. The chart populates a static SVG canvas with a steelblue fill and clear axis labels.

BBatkhongor Chagnaa
90% match
Loading thumbnail…

Fork of make a bar chart

This visualization displays the top five most populous countries, using circles whose horizontal positions and radii encode each nation's population. The data comes from a CSV file containing country names and population figures, which are multiplied by 1000 for accurate representation. The chart is built with D3 version 6, leveraging its `svg`, `scaleLinear`, and `scaleBand` APIs for scaling and layout, while `axisLeft` and `axisBottom` render the axes. The circular marks, colored green via CSS, are positioned using bandwidth calculations, with the title appearing at the top of the SVG canvas.

Mmanishabehera
89% match
Loading thumbnail…

Bar Chart

This bar chart displays the population of five countries, with horizontal bars ranked by country name. The visualization is built with D3 v5 using an SVG renderer, reading data from a CSV file via `d3.csv`. Population values are mapped to a linear scale (`d3.scaleLinear`), while countries use a band scale (`d3.scaleBand`). The chart includes axis labels, tooltips on hover, and click events that alert the selected country and population, all styled with CSS.

AAbhinav Kumar
89% match
Loading thumbnail…

Make a Bar Chart

This bar chart displays the population of the top 10 most populous countries, with each bar’s length proportional to population in thousands and countries listed on the vertical axis. Using D3 v5, the code loads data from a CSV, applies linear and band scales to map values to pixel coordinates, and renders an SVG with axes and steel-blue rectangles. The visualization relies on `d3.csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` from the D3 module imports.

NNeepaB
89% match
Loading thumbnail…

Making a bar chart.

A simple horizontal bar chart displays the population of the top ten most populous countries from a CSV file. The code uses D3 v5 APIs including `csv`, `scaleLinear`, and `scaleBand` to map data to SVG rectangles, with `axisLeft` and `axisBottom` for axes. Population values are formatted using D3's `format` function, and the chart includes a title and axis labels.

Mmjoaquim12
89% match