Skip to main content
SimilarExport ZIP
100%

TASK-1(ACTIVITY-6)

✓ Published0🌍 Public
MMahimaChowdaryKasthala@my.unt.edu
Last edited Mar 31, 2025
Created on Mar 31, 2025
Forked from Hello VizHub

This horizontal bar chart visualizes the top 30 countries by population in 2020. The D3.js v7 code loads CSV data from a GitHub Gist, converts the '2020' column to numerical values, sorts the data in descending order, and selects the first 30 entries. Using `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis, it renders steelblue rectangles within an SVG, with hover states turning them orange. The visualization also includes a left y-axis, a bottom x-axis with compact tick labels, and text annotations showing each population value.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6_Taskl 1

A horizontal bar chart displays the top 30 countries by population in 2020, using light green bars ordered alphabetically by country name. The visualization employs D3.js v7 with SVG rendering, using `d3.scaleLinear` and `d3.scaleBand` for positioning, along with `d3.axisBottom` and `d3.axisLeft` for axes. Population values are formatted as billions on the x-axis, while the data originates from a CSV file hosted on GitHub, fetched asynchronously via `d3.csv`.

Nnavyabade05@gmail.com
92% match
Loading thumbnail…

activity6_task1

This horizontal bar chart displays the populations of the top 30 countries in 2020, sorted by country name. The visualization uses D3.js v7 with an SVG rendering approach, employing `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis to position the light green bars. The data is loaded from a CSV file hosted on GitHub, with the population values formatted as billions (e.g., "1.2B") on the x-axis. Both axes include custom labels, with the x-axis labeled "POPULATION-2020" and the y-axis labeled "Countries".

Sshreshikaveerannagari@gmail.com
92% match
Loading thumbnail…

Activity-6 Task 1

This horizontal bar chart displays the top 30 countries by population in 2020, with bars extending from the left edge and a logarithmic-free linear scale for population values. The visualization uses D3 v7’s `scaleBand`, `scaleLinear`, `axisBottom`, and `axisLeft` APIs, rendering SVG rectangles via a data join. Light green bars represent each country, with a custom tick formatter converting numeric values to abbreviated formats like “B” for billions. Population data is loaded as CSV from GitHub and sorted descending before filtering to the top 30 entries.

NNithish Karanam
92% match
Loading thumbnail…

Activity6_Task1

This horizontal bar chart displays the 30 most populous countries in 2020, with bars representing population values and a tooltip showing formatted numbers on hover. The visualization loads CSV data from a GitHub-hosted dataset, processes the population values by removing commas, and sorts countries in descending order before capping at 30 entries. Built with D3 v6, it uses `scaleLinear` for the x-axis, `scaleBand` for the categorical y-axis, and custom `AxisBottom` and `AxisLeft` components to render the axes. The chart includes blue grid lines, light green bars, and a formatted x-axis label that converts billions to a readable format.

Pparmuriat@gmail.com
91% match
Loading thumbnail…

Activity 6_Task 1

This horizontal bar chart displays the populations of the top 30 countries in the year 2000, sorted by country name. The visualization uses D3.js version 7 to create an SVG bar chart with light green bars, a linear x-scale for population values, and a band y-scale for country names. The code imports data from a CSV file using d3.csv and constructs the chart with modular components for axes and marks. Axis labels are formatted using d3.format to display population values in billions.

MManojsai Bangaru
91% match
Loading thumbnail…

Fork of ACTIVITY_6_TASK1

This horizontal bar chart shows the 2020 population of the top 30 countries, with bars sorted by country name and scaled linearly by population. The visualization uses the D3 v7 library to render SVG elements, with `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis. Population values are formatted with `d3.format` to display in billions or millions, and the data is loaded asynchronously from a CSV file using `d3.csv`. Rectangles are appended to the chart with a light green fill, while axis labels are positioned using SVG transforms.

Ssravani1969@gmail.com
91% match
Loading thumbnail…

Fork of ACTIVITY_6_TASK1

This horizontal bar chart shows the 2020 population of the top 30 countries, with bars sorted by country name and scaled linearly by population. The visualization uses the D3 v7 library to render SVG elements, with `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis. Population values are formatted with `d3.format` to display in billions or millions, and the data is loaded asynchronously from a CSV file using `d3.csv`. Rectangles are appended to the chart with a light green fill, while axis labels are positioned using SVG transforms.

Ssravani1969@gmail.com
91% match
Loading thumbnail…

Activity6_Task1

A horizontal bar chart displays the top 30 countries by 2020 population, sorted in descending order with a teal fill. The visualization uses d3.csv to load data from a GitHub-hosted CSV file, d3.scaleLinear and d3.scaleBand to map population values and country names to SVG coordinates, and d3.axisBottom with custom tick formatting to label values in millions and billions. Bars are rendered as SVG rect elements within a React framework, with an interactive hover effect that reduces opacity.

Ppuneetputtu@my.unt.edu
91% match