Skip to main content
SimilarExport ZIP
100%

Fork of Pathetic Bar Chart

✓ Published0🌍 Public
RReymond Mesuga
Last edited Mar 14, 2021
Created on Mar 14, 2021
Forked from Pathetic Bar Chart

This visualization displays the top 10 most populous countries as a minimal bar chart with no axes or labels, rendering each country as a simple SVG rectangle. The bars are positioned using `d3.scaleBand` for the vertical country categories and `d3.scaleLinear` for horizontal population values, with data loaded from the United Nations World Population Prospects 2019 via `d3.csv`. The chart is built with React hooks (`useState`, `useEffect`) to fetch and slice the dataset, while React renders the SVG elements in a browser environment.

AI-generated description

A program that shows the top 10 most populous countries as a pathetic bar chart with no axes.

Data: United Nations World Population Prospects 2019.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization displays the top 10 most populous countries as a minimal bar chart with no axes or labels, rendering each country as a simple SVG rectangle. The bars are positioned using `d3.scaleBand` for the vertical country categories and `d3.scaleLinear` for horizontal population values, with data loaded from the United Nations World Population Prospects 2019 via `d3.csv`. The chart is built with React hooks (`useState`, `useEffect`) to fetch and slice the dataset, while React renders the SVG elements in a browser environment.

RReymond Mesuga
100% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization displays the top 10 most populous countries as a minimal bar chart with no axes or labels, rendering each country as a simple SVG rectangle. The bars are positioned using `d3.scaleBand` for the vertical country categories and `d3.scaleLinear` for horizontal population values, with data loaded from the United Nations World Population Prospects 2019 via `d3.csv`. The chart is built with React hooks (`useState`, `useEffect`) to fetch and slice the dataset, while React renders the SVG elements in a browser environment.

RReymond Mesuga
100% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This example visualizes the top 10 most populous countries using a bar chart with no axes, rendered as SVG elements. It loads population data from the United Nations World Population Prospects 2019 dataset via `d3.csv`, then uses React’s `useState` and `useEffect` hooks to fetch and store the data. The chart maps each country to a rectangle, sizing bars with `scaleBand` and `scaleLinear` from d3.v5, while the overall layout is managed through React and ReactDOM.

TTchea JiaWei
96% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization displays the top 10 most populous countries as a simple bar chart with no axes or labels. The bars are rendered as SVG rectangles using React, with heights determined by a d3.scaleBand and widths by a d3.scaleLinear. Data comes from the United Nations World Population Prospects 2019 dataset, loaded via d3.csv. The code uses React hooks like useEffect and useState to fetch and store the data, then maps each country to a colored rectangle in the SVG.

Aamiteshwarr
96% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This example visualizes the top 10 most populous countries as a bar chart without axes or labels, rendering each country as a horizontal rectangle scaled by its 2020 population. Built with React and D3 v5, it uses `d3.csv` to load United Nations World Population Prospects 2019 data, then applies `scaleBand` and `scaleLinear` to map countries and population values to screen coordinates. The visualization displays rectangles in an SVG container, with the loading state shown as plain text until data arrives.

RReymond Mesuga
96% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This example displays the top 10 most populous countries as a bare bar chart with no axes or labels, rendered as SVG rectangles. The React component fetches United Nations World Population Prospects 2019 data via d3.csv, then uses d3.scaleBand for the y-axis positioning and d3.scaleLinear with d3.max to map population values to bar widths. The visualization relies on React hooks—useState and useEffect—to load and slice the data, while d3.v5 and React 16.9 render the chart through ReactDOM.

JJean David
96% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization displays the top 10 most populous countries as a minimalist bar chart, intentionally omitting axes and labels to emphasize the raw data. The bars render as SVG rectangles using React components, with D3’s `scaleBand` and `scaleLinear` mapping country names and population values to screen coordinates. Population data comes from the United Nations World Population Prospects 2019, loaded via D3’s `csv` function. The code also logs data to the console, though only the visual output is shown to the viewer.

AAndreas Sjödin
96% match
Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization presents the top 10 most populous countries as a bare bar chart, intentionally omitting axes and labels. The chart renders bars using React components that call D3 scales, with `scaleBand` positioning the countries vertically and `scaleLinear` mapping population values to bar widths. The SVG is drawn with simple `rect` elements, while gridlines are attempted using D3’s tick values. Data comes from the United Nations World Population Prospects 2019, loaded as a CSV and filtered to the first ten rows. The code demonstrates a minimal, almost playful approach to chart construction.

AAndres Perdomo
95% match