Skip to main content
SimilarExport ZIP
100%

Activity-6_1.2

✓ Published0🌍 Public
MMdAfikurRahmanKhan@my.unt.edu
Last edited Nov 16, 2025
Created on Nov 16, 2025
Forked from Activity6_1.2

This bar chart displays the top 20 most populous countries in 2010, using horizontal bars to show each nation's population. The visualization is built with React and D3 v5, rendering to SVG. It loads CSV data from a GitHub gist, processes the 2010 column, and uses d3.scaleBand for the categorical y-axis and d3.scaleLinear for the numeric x-axis. Tooltips reveal exact values via SVG `<title>` elements, and the tick labels are formatted from scientific notation to billions.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6

This horizontal bar chart ranks the 20 most populous countries in 2010, using a React and D3-based SVG visualization. The chart employs `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the quantitative x-axis, with population values formatted using `toLocaleString`. Data is loaded asynchronously from a CSV file via D3’s `csv` function, then sorted and filtered to the top 20 entries. Each bar includes a native SVG `<title>` tooltip, with axes and labels rendered from custom React components.

Kkblikitha22@gmail.com
94% match
Loading thumbnail…

activity 6_Task 1

This bar chart displays the populations of the top 20 countries in 2010, using horizontal bars and a logarithmic-like axis format that abbreviates large numbers (e.g., "B" for billions). Rendered as an SVG in React, the visualization uses D3 v5 modules such as `scaleBand` for the categorical y-axis and `scaleLinear` for the x-axis, with a tooltip on each bar showing the exact value. Data is loaded from a CSV via D3’s `csv` function.

Jjakeh311@yahoo.com
93% match
Loading thumbnail…

Activity6-Q1.2

This bar chart displays the population of the top 20 countries in 2010, ranked by country name on the vertical axis and population count on the horizontal axis. Built with D3 v5 within a React framework, it renders as an SVG. The chart uses D3's `scaleBand` and `scaleLinear` for axes, utilizes `csv` to load data from a GitHub repository, and formats tick labels with `format`. Hovering over a bar reveals a tooltip with the population value.

Ssriyaalugupalli@my.unt.edu
93% match
Loading thumbnail…

Activity6_Q1_Part2

This bar chart displays the top 20 most populous countries in 2010, ranked from largest to smallest along a vertical axis. The visualization uses React to render SVG elements, with D3 scale functions (`scaleBand`, `scaleLinear`) and axis components (`AxisBottom`, `AxisLeft`) to position the marks. Population values are parsed from a CSV file using D3’s `csv` loader, formatted with `d3.format` to abbreviate large numbers (e.g., “1.5B”), and each bar includes a tooltip via an SVG `<title>` element.

AAnirudhaKulakarniKaranam@my.unt.edu
92% match
Loading thumbnail…

activity 6_Task 1.2

This bar chart visualizes the top 20 countries by population for the year 2010, using a horizontal layout with countries on the y-axis and population on the x-axis. It uses React with D3 v5 scales (scaleBand, scaleLinear) to position SVG rectangles, with axis components rendering ticks and labels. Data loads from a CSV via d3.csv, and tooltips display formatted population values using d3.format.

Ssanjanaadapa7@gmail.com
92% match
Loading thumbnail…

Activity6

A horizontal bar chart displays the population of the top 20 countries in 2010, with countries listed on the y-axis and population values on the x-axis. Built with React and D3 v5, the visualization uses `d3.scaleBand` for the categorical axis, `d3.scaleLinear` for the numeric axis, and `d3.format` to abbreviate large numbers. Data is fetched from a CSV file using `d3.csv`. Each bar includes a tooltip showing the formatted population value.

BBibek Lamsal
92% match
Loading thumbnail…

Activity6_Q1.2

This horizontal bar chart displays the population of 20 countries in 2010, sorted by country name. The visualization uses React with D3 v5 scales, including d3.scaleBand for the categorical y-axis and d3.scaleLinear for the continuous x-axis. Data is loaded via d3.csv from a GitHub repository and rendered as SVG rectangles with native tooltips showing formatted population values. Custom React components handle axis rendering with tick formatting that converts Giga units to Billions.

VVidya Lakshmi Chitturi
92% match
Loading thumbnail…

Activity6_Q1.2

This bar chart displays the population of the top 20 countries in 2010, with the data loaded from a CSV file using D3’s `csv` function. The visualization uses React with reusable axis components (`AxisBottom`, `AxisLeft`) and a `Marks` component that renders SVG rectangles. D3’s `scaleBand` and `scaleLinear` position the bars, while `format` abbreviates tick labels from units like “G” to “B”. Hovering a bar reveals its exact value via a native SVG `<title>` tooltip.

Tthakurnikhitha4@gmail.com
92% match