Skip to main content
SimilarExport ZIP
100%

Stylized bar charT

✓ Published1🌍 Public
Cchrismeeky
Last edited Oct 18, 2021
Created on Oct 18, 2021

This stylized bar chart displays the populations of the ten most populous countries, using a yellow background circle and custom-styled ticks to create a distinctive visual. Horizontal bars represent each country’s population, with a tooltip showing the formatted value on hover. The visualization is built with React and D3 v7, using `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis. Data is loaded via D3’s `csv` utility from a UN population dataset, and the chart is rendered as SVG.

AI-generated description

Loads external data using d3's csv utility and renders on a "pathetic" barchart

MIT Licensed

Similar vizzes

Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the populations of the ten most populous countries using a horizontal layout with custom-styled axes and a teal color palette. The visualization loads UN population data from 2019 via a CSV file, then renders the chart as an SVG using React components and D3’s `scaleBand` for the categorical country axis and `scaleLinear` for the population scale. The bottom axis formats tick labels using D3’s `format` utility, converting large numbers from billions to abbreviated form, with tooltips provided by SVG `<title>` elements.

Jjwlam83
94% match
Loading thumbnail…

Stylized Bar chart - Countries by population

A bar chart visualizes the populations of the top 10 most populous countries, with horizontal bars ordered by country name and labeled with population values formatted in billions. Built with React and D3 v6, it loads UN population data from a CSV URL, sorts the first 10 rows, and uses scaleBand and scaleLinear to position marks. SVG rects render the bars with a yellow tooltip on hover, styled with the Poppins font.

AAlexander Dorling
93% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the top 10 most populous countries using horizontal bars with rounded corners. The visualization uses React with D3 v5’s `scaleBand` and `scaleLinear` to position bars, while custom React components render the axes and marks. Population data comes from the UN World Population Prospects 2019 CSV, formatted with `d3.format`. The bars are colored teal and include native SVG tooltips showing the country and population value, with axes styled using grey gridlines and labels.

YYohR
92% match
Loading thumbnail…

Stylized Bar Chart

This bar chart displays the ten most populous countries, with each bar representing a country’s population. The visualization uses React to render SVG elements, leveraging d3-scale functions like `scaleBand` and `scaleLinear` to position bars and axes. Data comes from the United Nations World Population Prospects 2019, loaded via `d3.csv`. The chart applies a custom Poppins font, teal bar fills, and formatted tick labels that convert values from gigabytes to billions.

JJane Wang
92% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart displays the populations of the ten most populous countries using data from the UN Population 2019 dataset. The visualization is built with React and rendered as SVG elements, with D3 v5 handling the scaling and formatting of the bars. The x-axis uses a linear scale with SI-formatted labels, while the y-axis employs a band scale for country names. The D3 `scaleBand` and `scaleLinear` APIs position the bars, styled with a teal fill and distinct tick marks, with tooltips showing the exact population values.

Vvangenned
92% match
Loading thumbnail…

Stylized Bar Chart

This chart displays the top 10 most populous countries as horizontal bars, with population values formatted in billions and countries labeled on the vertical axis. Built with React and D3 v5, it uses `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis. Data comes from the United Nations World Population Prospects 2019, loaded via `d3.csv`. The SVG rendering includes styled axes, tick marks, and hover tooltips generated using SVG `<title>` elements.

Ttmrb
92% match
Loading thumbnail…

Stylized Bar Chart

This chart displays the top 10 most populous countries using horizontal bars, with population values on the x-axis and country names on the y-axis. The visualization is built with React and D3 v5, using `scaleBand` and `scaleLinear` for positioning, while SVG `rect` elements render the bars with native `<title>` tooltips. Data comes from the United Nations World Population Prospects 2019 dataset, loaded via `d3.csv`. The chart includes styled axes and a teal color scheme, with population tick labels formatted in billions.

227-12-95
92% match
Loading thumbnail…

Stylized Bar Chart

This stylized bar chart visualizes the population of ten countries using horizontal bars, with a clean, modern aesthetic set against a Poppins font and teal color palette. The chart leverages React for state management and rendering, D3 utilities such as `scaleBand` and `scaleLinear` for axes, and SVG for output. Data is loaded via D3’s `csv` function from a UN population dataset, and the x-axis formats large numbers with a custom `format` function that abbreviates values as billions.

AAnthonyAl-Rifai
92% match