Activity 6_Task 1

KKondreddy Saikiran reddy

Activity 6_Task 1

This bar chart displays population data for twenty countries in 2010, using horizontal bars with a green fill. The visualization is built with React and D3 v5, leveraging d3.scaleBand for the categorical y-axis, d3.scaleLinear for the quantitative x-axis, and d3.format to abbreviate large numbers. Data is loaded from a remote CSV file via d3.csv, and all marks and axes are rendered as SVG elements.

activity 6_Task 1

This bar chart displays the population of 20 countries in 2010, ordered by country name. Built with React and rendered as an SVG, it uses D3 v5 scales and axes: a linear scale for population and a band scale for countries. The chart applies custom tick formatting, converting values like '1.2G' to '1.2B', and includes tooltips on each bar. Data loads from a remote CSV via D3's `csv` function.

CChaitanya Ratan Sree

activity 6_Task 1.2

This chart displays the populations of 20 countries in 2010 as a horizontal bar chart, with country names on the y-axis and population values on the x-axis. The visualization is built with React and D3 v5, using `scaleBand` and `scaleLinear` to map the data, which is loaded via `csv` from a GitHub-hosted CSV file. SVG rectangles render the bars, with axis components and a tooltip showing formatted population values in billions.

Jjtulasi05@gmail.com

Sshivasaiamaravadi@gmail.com

activity6_Task1

This bar chart displays the population of 20 countries in 2010, with countries on the y-axis and population values on the x-axis. The visualization uses React to render SVG elements, with D3 v5 providing scales, margins, and tick formatting via `scaleBand`, `scaleLinear`, and `format`. Data is loaded as CSV from a GitHub repository and converted to numeric population values. Axes and marks are built as React components, with bars colored green and a hover tooltip showing the formatted population value.

Activity_6(11754343)_Task_1

This bar chart displays the population of 20 countries in 2010, sorted along a vertical band scale with horizontal bars proportional to population values. The visualization is built with React and D3 v5, using `scaleBand` and `scaleLinear` to map country names and population counts to SVG rectangles. Data is loaded asynchronously via D3’s `csv` parser from a GitHub-hosted CSV file, with axis ticks and labels rendered by custom React components. Hovering over a bar reveals its exact population via the SVG `title` element.

HHari Prasanth Penugonda

Bbobbymeyermsis@gmail.com

activity 6_Task 1

This bar chart shows the population of countries in 2010, with horizontal bars sorted by country name along the y-axis and population values on the x-axis. The visualization uses React and D3 v5, rendering as an SVG with scales created via `d3.scaleBand` and `d3.scaleLinear`. Data is loaded as CSV from GitHub, with the population values converted from the '2010' column and multiplied by 1000. The chart includes axis labels, tick marks, and tooltips displaying formatted population values.

Bbhargavipagolu2025@gmail.com

Activity 6

This bar chart displays the population of 20 countries for the year 2010, sorted by country name along the y-axis. The visualization uses React with D3 v5 scales, rendering an SVG with colored horizontal bars. D3’s `scaleBand` and `scaleLinear` map country names and population values, while the tick format converts values to billions. Data is loaded from a remote CSV via D3’s `csv` method, and interactive tooltips appear on each bar using SVG `<title>` elements.

Ssiddhubhupathi@gmail.com

Activity 6_Task 1

A horizontal bar chart displays the 2020 populations of 30 countries, sorted by country name along the y-axis, using a React and D3 v5 stack. The visualization imports `scaleBand` and `scaleLinear` from D3 to map country names and population values to SVG rectangles, with axes generated by custom `AxisBottom` and `AxisLeft` components. Data loads from a CSV via `d3.csv` and formats tick labels with `d3.format`. Hovering over a bar reveals its exact population through a native SVG `<title>` tooltip.