JC-task-7 Q1.2

JC - Task-7 Q1

This bar chart displays the top 10 most populous countries in the year 2000, sorted in descending order, using a horizontal layout with light green bars. The visualization loads CSV population data from a GitHub repository, filters for the year 2000, and converts population values to actual counts. It uses d3.scaleBand and d3.scaleLinear for positioning, React for rendering the SVG elements, and custom AxisBottom, AxisLeft, and Marks components to draw the axes and bars. Axis tick labels are formatted with d3.format to abbreviate numbers (e.g., "B" for billions).

93% match

JC - Task-7 Q1

93% match

JC Task-1

This example is a horizontal bar chart that displays the 2020 populations of 30 countries, using the `d3.csv` loader to fetch the data from a GitHub-hosted CSV file and `d3.scaleBand` for the vertical country axis alongside `d3.scaleLinear` for the horizontal population axis. It renders as an SVG via React, with `d3.format` used to abbreviate tick labels (e.g., "G" for billions), and each bar includes a tooltip showing the population value. The chart is built from reusable local components—`AxisBottom`, `AxisLeft`, and `Marks`—each mapping data to SVG `rect` elements and axis lines.

92% match

Fork of JC Task-7 Q1

This example displays a horizontal bar chart of population data for 20 countries in 2020. It uses React with SVG rendering, and D3’s `csv`, `scaleBand`, `scaleLinear`, and `max` functions to load and transform the data, and to position the bars and axes. The bars are drawn as SVG rectangles, with a native `<title>` element providing a simple tooltip. Data comes from a CSV file hosted on GitHub.

90% match

Aamarnadhkari98@gmail.com

Activity6_Task1_Qus2

This horizontal bar chart displays the population of the top 20 countries for the year 2010, using D3.js v5 within a React framework and rendering via SVG. The visualization is built with `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis, with bars drawn as SVG rectangles. Population values are loaded from a CSV file using D3's `csv` function, formatted with `d3.format` to abbreviate large numbers (e.g., 'B' for billions), and include interactive tooltips showing the formatted population on hover. The chart includes styled blue tick marks and green bars, with axes labeled accordingly.

Task 8 Q1.1

This chart displays the population of the top 10 countries in the year 2000 as a horizontal bar chart, with countries on the y-axis and population values on the x-axis formatted in billions. Built with React and D3 v5, it uses `scaleBand` for the categorical axis, `scaleLinear` for the quantitative axis, and renders SVG rectangles as marks. The data is loaded from a remote CSV file via `d3.csv`, and tooltips appear on each bar via SVG `<title>` elements.

Jjyothikaraj3@gmail.com

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

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