Activity6_Q-2.3

100%

Activity6_Q-2.3

✓ Published1🌍 Public

Last edited Apr 4, 2025

Created on Apr 4, 2025

This stacked bar chart shows the proportion of global internet users across six regions—Africa, Asia, Europe, North America, South America, and Oceania—from 2015 to 2019. Using d3.v7 and SVG, it stacks yearly percentage values per region via `d3.stack()`, with bars colored by year through `d3.scaleOrdinal()`. The visualization includes axes generated by `d3.axisBottom()` and `d3.axisLeft()` with percentage formatting, plus a clickable legend. Data comes from the included `internet-users.csv` file, and clicking a bar alerts the region, year, and percentage.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task2

This stacked bar chart visualizes the percentage of internet usage across five age groups, segmented by region, with each bar normalized to 100%. The visualization uses `d3.stack()` to create the stacked segments and `d3.scaleOrdinal` for color encoding, mapping regions to distinct hues. Interactive tooltips appear on hover, displaying the precise percentage for each region-age combination using `d3.format('.2f')`. The chart leverages `d3.axisBottom` and `d3.axisLeft` with SVG rendering, reading from a `data.csv` file that contains proportional usage values for North America, Europe, Asia, Africa, and South America.

Ggoudrohit2000@gmail.com

87% match

Loading thumbnail…

Activity6_Q2.3

This visualization shows the proportional distribution of population across Africa, Asia, and Europe for five countries, with each horizontal bar normalized to 100% to facilitate cross-country comparison. The chart renders as a normalized stacked bar chart using SVG, where each segment’s length represents its percentage share. The code loads data from a CSV file, converts values to percentages, and uses d3.stack() for stacking, d3.scaleLinear() and d3.scaleBand() for axes, and d3.scaleOrdinal() for colors. Interactive tooltips display exact percentages on hover.

VVidya Lakshmi Chitturi

82% match

Loading thumbnail…

actvity6-2

A stacked horizontal bar chart shows the percentage of population in three age brackets—14 years and below, 15 to 64 years, and 65 years and above—across seven global regions. The SVG is built with D3 v7, using `d3.stack()` to compute the stacked segments, `d3.scaleLinear()` and `d3.scaleBand()` for positioning, and `d3.scaleOrdinal()` to assign categorical colors. Interactive tooltips reveal exact percentages on hover. Data comes from a CSV file, with axes labeled and a title displayed above the chart.

BBibek Lamsal

82% match

Loading thumbnail…

Activity6_Task2

This stacked horizontal bar chart visualizes the distribution of age groups across different continents, with each bar representing a continent and segments colored by age bracket. The visualization uses a D3.js v7 SVG rendering with `d3.stack()` to compute the stacked segments, `d3.scaleOrdinal()` for color mapping, and `d3.scaleBand()`/`d3.scaleLinear()` for axes. Tooltips, implemented via mouseover events, display the exact percentage for each segment, with x-axis labels indicating percentage values. Data is loaded from a CSV file containing pre-calculated proportions per continent.

Pperamranji

82% match

Loading thumbnail…

Activity8_Q3

This stacked bar chart shows the distribution of land area types—Snow, Water, Forest, and Urban—across seven continents, with each continent’s segments summing to 100%. It uses D3.js v7 with an SVG rendering, employing `d3.stack` and `d3.scaleOrdinal` with the Tableau10 color scheme. Hovering over a bar segment highlights it and displays a tooltip with the exact percentage for that area type and continent. The data is loaded from a CSV file, and axes are formatted using `d3.axisBottom` with percentage labels, while a legend identifies each category.

LLakshmi Keerthi

81% match

Loading thumbnail…

Activity6_Q1

This example visualizes the top 10 most populous countries from 2016 to 2020 using a stacked horizontal bar chart, where each bar is segmented by year to show the population distribution across the five-year period. The chart is built with D3.js v7, using `d3.stack()` to create the stacked data, `d3.scaleBand` for the y-axis, and `d3.scaleLinear` for the x-axis. Hovering over a segment displays a tooltip with the specific year, population, and percentage share. The data is sourced from a CSV file containing population figures for each country and year.

GGunna,Praneeth Reddy

79% match

Loading thumbnail…

Activity7_Q2

A stacked area chart displays population trends by continent over time, aggregating country-level data into five continental groups. D3 v6 loads population data from a CSV URL and maps countries to continents before stacking the values. The visualization uses `d3.stack`, `d3.area`, `scaleTime`, `scaleLinear`, and `scaleOrdinal` to render smooth curves with a color legend. Data spans multiple years, with axes formatted via `axisBottom` and `axisLeft`. The chart renders as an SVG appended to the HTML body, with the `curveBasis` interpolation applied to the area generator.

SShiva Sai Reddy

79% match

Loading thumbnail…

Activity_Tutorial_3.1

This stacked bar chart displays mobile operating system market share percentages across five global regions, with colored segments for Android, iOS, and Other. Each region’s horizontal bar spans from 0 to 100 percent, and hovering over a segment reveals its exact value via a tooltip. The visualization uses D3 v7’s `d3.stack()` to transform the CSV data, `d3.scaleBand` for region positioning, `d3.scaleLinear` for percentages, and `d3.schemeSet2` for categorical colors. SVG rendering handles the axes, while mouse events update tooltip opacity and content.

Cchowdaryhemanth14@gmail.com

79% match