Skip to main content
SimilarExport ZIP
100%

Fork of Activity6_1.1

✓ Published0🌍 Public
Aa9.hemraj@gmail.com
Last edited Oct 30, 2025
Created on Oct 30, 2025
Forked from Activity6_1.1

This horizontal bar chart displays the populations of ten countries for the year 2000. Each bar’s length encodes the population value, with a linear scale on the x-axis and a categorical band scale for countries on the y-axis. The visualization is built with React and D3 v5, creating SVG marks and axes. It uses `scaleBand`, `scaleLinear`, and `format` to render the chart, and data is sourced from a CSV file via a custom `useData` hook.

AI-generated description

A demonstration of how to start using D3 version 6.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity6_q1

This example presents a horizontal bar chart comparing the populations of ten countries in the year 2000. The visualization uses D3 v5’s `scaleBand` and `scaleLinear` to map country names and population values, with React rendering the SVG elements. Each bar includes a native `<title>` tooltip displaying the formatted population in billions (using `format('.2s')`). Data is loaded asynchronously via D3’s `csv` parser from a GitHub-hosted CSV file, and axes are generated by custom React components (`AxisBottom` and `AxisLeft`).

Aabjalshaik02@gmail.com
94% match
Loading thumbnail…

Fork of activity6q1(1)

This horizontal bar chart displays the population of ten countries in the year 2000, sorted with the largest population at the top. Built with React and D3 v5, it uses `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the quantitative x-axis, rendering SVG rectangles. Data is loaded from a CSV file using D3’s `csv` function, and axis ticks are formatted with a custom SI prefix function that converts billions to 'B'.

Ssaitejakaranam10@gmail.com
93% match
Loading thumbnail…

Fork of Activity6-1 Q1.2

A horizontal bar chart displays the 2010 population of 20 countries, with bars extending from a shared left axis. The chart uses React to render SVG elements, with D3 v5’s `scaleBand` and `scaleLinear` mapping country names and population values. Data loads asynchronously from a CSV file via D3’s `csv` function, and the x-axis labels are formatted with a SI prefix that converts gigabytes to billions.

Aaadesh.pranesh@gmail.com
93% match
Loading thumbnail…

Fork of Activty_6 T1

This bar chart displays the population of 20 countries in 2010, with countries listed along the vertical axis and horizontal bars representing population values. Built with React and D3 v5, it uses `scaleBand` and `scaleLinear` for positioning, while CSV data is loaded via `d3.csv` from a remote GitHub repository. The SVG rendering includes custom axis components and rectangles for marks, with tooltips formatted using D3’s `format` function to abbreviate large numbers.

Pperamranji
93% match
Loading thumbnail…

Fork of Activty_6 T1

This bar chart displays the population of 20 countries in 2010, with countries listed along the vertical axis and horizontal bars representing population values. Built with React and D3 v5, it uses `scaleBand` and `scaleLinear` for positioning, while CSV data is loaded via `d3.csv` from a remote GitHub repository. The SVG rendering includes custom axis components and rectangles for marks, with tooltips formatted using D3’s `format` function to abbreviate large numbers.

Pperamranji
93% match
Loading thumbnail…

Fork of Fork of Activity 6

This example shows a horizontal bar chart of populations for twenty countries in 2010, using a bar’s length to encode the population value for each country. The visualization is built with React and D3 v5, using `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. Custom React components (`AxisBottom`, `AxisLeft`, `Marks`) render SVG ticks and rectangles, with a tooltip showing the formatted population value on hover. Data is loaded as CSV with `d3.csv` from a GitHub repository and formatted using `d3.format`.

KKritin Kesav
93% match
Loading thumbnail…

Fork of Activity6_Question1

This chart displays the populations of ten countries in 2020 as horizontal bars, ranked along a categorical y-axis. Population values are encoded as bar lengths. The visualization uses React for rendering and D3 version 5 modules including `scaleBand`, `scaleLinear`, `format`, and `csv` for data loading. The data comes from a CSV file hosted on GitHub, with values multiplied by 1000. The SVG is built from custom React components for axes and marks.

Ssaimanvith22@gmail.com
93% match
Loading thumbnail…

Fork of Activity_6 question_1

This bar chart displays the population of ten countries in the year 2000, using horizontal bars scaled by population value. Built with React and D3 v5, the visualization loads CSV data via `d3.csv` and renders as an SVG. It employs `scaleBand` for the categorical y-axis and `scaleLinear` for the x-axis, with tick marks and labels generated by custom components.

HHarinathChakali33@gmail.com
93% match