Task8_Q1)2)

Task_8_Q1.2

A bar chart displays the population of 20 countries in 2010, sorted by country name along the y-axis and population magnitude along the x-axis. The chart uses React and D3 v5, with `scaleBand` and `scaleLinear` for ordinal and numeric axes, respectively. Data is loaded as CSV from a GitHub repository using `d3.csv`, and values are formatted with `d3.format`. Marks are rendered as SVG rectangles, with tooltips showing population values in a compact, abbreviated format. Axis ticks and labels are styled via custom React components.

DDipesh

Task8_Q1)1)

A horizontal bar chart displays the populations of ten countries in the year 2000, ranked with country names on the y-axis and population count on the x-axis. The visualization uses D3 v5 scales, including `scaleBand` and `scaleLinear`, within a React framework to render SVG rectangles. Each bar includes a native SVG tooltip showing the population value in billions via `format('.2s')`. Data is loaded asynchronously from a remote CSV file using D3's `csv` function. Grid lines and axis labels use the Poppins font, with light green bars on a white background.

Mmulyasuji999@gmail.com

Task 8 Q1B

This bar chart displays the population of 20 countries in 2010, with countries on the y-axis and population values on the x-axis. Built with React and D3 v5, it uses `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. Data is loaded from a CSV file via `d3.csv` and rendered as SVG rectangles. The chart includes custom axis components, tick formatting that converts values to billions, and native tooltips using SVG `<title>` elements.

SSushmaNamidi@my.unt.edu

Task8_Q2

This visualization shows a horizontal bar chart of the 2010 population figures for 20 countries, ordered by country name. Using React and D3 v5, the chart loads CSV data from a GitHub source, then renders SVG rectangles scaled by population. The code employs D3's scaleBand and scaleLinear for axis mapping, while custom AxisBottom and AxisLeft components handle tick marks and labels, with population values formatted using D3's format function and tooltips via SVG title elements.

LLakshmi Keerthi

Task-8

This bar chart displays the population of ten countries for the year 2020, with countries on the vertical axis and population values on the horizontal axis. The visualization uses React to render SVG elements, with D3’s `scaleBand` and `scaleLinear` handling the spatial mapping. Data is loaded asynchronously from a remote CSV using D3’s `csv` parser, with population values formatted using the `format` function to abbreviate large numbers (e.g., “1.5B”). The chart includes blue axis ticks and labels, green rectangular marks, and tooltips showing the formatted population on hover.

Ppraneeth7222@gmail.com

Task_8_Q1.1

This bar chart displays the population of ten countries in the year 2000, using horizontal bars sorted by country name. The visualization is built with React and D3 v5, using `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. Population values are parsed from a CSV file and formatted with D3's `format` function, converting values to billions. The chart includes custom axis components and uses SVG rectangles with tooltips showing the precise population for each country.

DDipesh

TASK1_2

This horizontal bar chart displays the population figures for 20 countries in 2010, sorted along a categorical y-axis with proportional bar lengths extending along a linear x-axis. The visualization is built with React and D3 v5, using `scaleBand` and `scaleLinear` for positioning, and renders SVG elements through custom `AxisBottom`, `AxisLeft`, and `Marks` components. Data is loaded asynchronously from a CSV file via `d3.csv` and formatted using `d3.format` to abbreviate large numbers as billions, with tooltips showing exact values.

Ssanjanadadi19@gmail.com

Task8_Q1

This example displays a horizontal bar chart of the population of ten countries for the year 2000, with bars sorted by country name and a blue axis line. The visualization uses React and D3 v5 to render SVG marks; `d3.scaleBand` and `d3.scaleLinear` map the categorical and quantitative variables, while axes are built from custom modules. Population data is loaded as CSV from a remote repository, with values scaled by a thousand. The chart includes interactivity via native SVG `<title>` tooltips that format tick values with `d3.format`.

LLakshmi Keerthi