Skip to main content
SimilarExport ZIP
100%

Activity 6

✓ Published0🌍 Public
Ppnamitha46@gmail.com
Last edited Oct 20, 2024
Created on Oct 19, 2024
Forked from Hello VizHub

A horizontal bar chart displays the 2020 populations of thirty countries, with bars sorted by country name and tooltips showing the population value. The visualization is rendered as SVG through React, using D3's `scaleBand` for the categorical y-axis, `scaleLinear` for the numeric x-axis, and the `format` function to abbreviate large numbers. Data is loaded from an external CSV file via D3's `csv` utility.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6

A horizontal bar chart displays the 2020 populations of 30 countries, sorted by country name. The visualization uses React with D3 version 5, employing `d3.scaleBand` for the y-axis and `d3.scaleLinear` for the x-axis. Data loads from a CSV file via `d3.csv`, with population values multiplied by 1000, and renders as SVG rectangles with tooltips. Axis components and marks are modularized as separate ES6 modules, with styling applied via CSS classes.

Nnandasaipalankius@gmail.com
96% match
Loading thumbnail…

Activity 6

A horizontal bar chart displays 2020 population estimates for 30 countries, sorted by country name. Built with React and D3 v5, the visualization uses SVG rectangles scaled by population using `scaleLinear` and `scaleBand` for axes. Data is loaded from a CSV via `d3.csv`, with tooltips formatted using `d3.format` to abbreviate large numbers.

Ttallavijayalakshmi0710@gmail.com
95% match
Loading thumbnail…

Activity 6

A horizontal bar chart shows the populations of 30 countries in 2020, sorted by country name. The visualization uses React to render SVG elements, with d3.scaleBand and d3.scaleLinear for the axes and data mapping. Population values are formatted in billions using d3.format, and the data is loaded from a remote CSV via d3.csv. Each bar includes a native SVG tooltip that displays the formatted population value.

GGunna,Praneeth Reddy
95% match
Loading thumbnail…

Activity 6

This bar chart displays the population of 30 countries in 2020, using a horizontal layout with country names on the y-axis and population values on the x-axis. The visualization uses D3 v5’s `scaleBand` and `scaleLinear` to position bars, while React components render the SVG elements. Data is loaded from a CSV file via `d3.csv` and formatted with `d3.format` to abbreviate large numbers, for example converting Gigas to Billions. Each bar includes a native SVG `<title>` tooltip showing the formatted population value.

Vvidyagangasani@my.unt.edu
95% match
Loading thumbnail…

Activity_6

A horizontal bar chart displays the 2020 populations of 30 countries, sourced from a CSV file via the D3 `csv` function. The visualization uses React to render SVG elements, with D3's `scaleBand` and `scaleLinear` mapping country names and population values to positions. Tooltips reveal exact population figures, and axes include custom tick formatting that abbreviates large numbers. The chart applies a green fill to marks and a blue stroke to axis lines.

Ssanjanadadi19@gmail.com
95% match
Loading thumbnail…

Activity_6

This horizontal bar chart displays the populations of 30 countries in 2020, sorted by country name along the y-axis and population size along the x-axis. Built with React and D3 v5, it uses `scaleBand` for the categorical axis, `scaleLinear` for the numeric scale, and SVG `rect` elements for bars. Data loads from a CSV via the `csv` function, with population values converted from thousands, and axes are rendered by custom React components.

Ssanjanadadi19@gmail.com
94% match
Loading thumbnail…

Activity-6

This horizontal bar chart displays the populations of 30 countries for the year 2020, ordered along the y-axis. Built with React and D3 v5, it renders as an SVG, using `d3.scaleBand` for the categorical axis and `d3.scaleLinear` for the quantitative axis, with data loaded from a CSV file. The bars’ widths encode population values, and a tooltip (via the SVG `<title>` element) shows the formatted value on hover.

Mmanisahiths54321@gmail.com
94% match
Loading thumbnail…

Activity 6

A horizontal bar chart displays the populations of 30 countries in 2020, sorted by country name, with each bar’s length representing population in billions. Built with React and D3 v5, it uses `scaleBand` for the y-axis, `scaleLinear` for the x-axis, and SVG `<rect>` marks with tooltips via `<title>`. Data is loaded from a remote CSV using `d3.csv`, and axes are rendered by custom components (`AxisBottom`, `AxisLeft`) with tick formatting via `d3.format`.

Gganesh.hns48@gmail.com
94% match