Skip to main content
SimilarExport ZIP
100%

activity6 task 2

✓ Published0🌍 Public
Ssiri2001j@gmail.com
Last edited Apr 15, 2024
Created on Apr 15, 2024
Forked from Hello VizHub

This visualization shows the distribution of GDP growth rates across six countries, with each country’s values broken into five rate categories using a stacked horizontal bar chart. The chart uses a linear x-axis for percentages and a banded y-axis for countries, with colored segments representing each growth-rate range. Built with D3 v7, it loads CSV data via `d3.csv`, applies `d3.stack` for stacking, and uses `d3.scaleOrdinal` for color mapping. Interactive tooltips display exact percentages on mouseover using D3 event handlers.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6.task2

This visualization shows the distribution of GDP growth rates across six countries, with each horizontal bar broken into stacked segments representing five growth-rate categories. The code uses D3 v7’s `d3.stack()`, `d3.scaleOrdinal()`, `d3.scaleBand()`, and `d3.scaleLinear()` to render the chart as SVG. Hovering over a segment triggers a tooltip displaying the exact percentage for that country and category. Data is loaded from a CSV file with country and growth-rate columns.

Ssanavenkatasurendrareddy@gmail.com
94% match
Loading thumbnail…

Activity6_Task2

This stacked bar chart visualizes GDP growth rates across six countries, segmented into five ranges from “below 6.0” to “above 10.5.” Each bar represents a country, with colored segments proportional to the share of growth in each range. The visualization uses D3 v7’s `d3.stack()` to aggregate the data, `d3.scaleBand()` for the country axis, and `d3.scaleLinear()` for the value axis. Hovering a segment reveals its exact percentage via a custom tooltip, while the SVG rendering and ordinal color scale highlight category differences.

Vvidiyalasahithi1999@gmail.com
92% match
Loading thumbnail…

Act 6.2

This stacked bar chart displays GDP growth rate distributions across six countries, with each bar segmented into five growth-range categories using distinct colors. The visualization uses d3.stack() to process the CSV data and d3.scaleBand() for country positioning. Tooltips reveal exact percentages on mouseover via event handlers. The SVG rendering employs d3.axisBottom with gridlines, custom color palettes, and d3.format() for numeric precision.

VVenkataSatyaRamKamini@my.unt.edu
89% match
Loading thumbnail…

Act 6.2

This stacked bar chart displays the percentage distribution of GDP growth across six categories for 14 countries, with each bar segmented by growth range. The visualization uses d3.stack() to process the CSV data and d3.scaleOrdinal() for coloring. Hovering over a segment triggers a tooltip showing the precise percentage, while the y-axis uses d3.scaleBand() for country labels. The SVG rendering includes custom axes and a color legend, with the code loading D3 v7 via UNPKG.

VVenkataSatyaRamKamini@my.unt.edu
89% match
Loading thumbnail…

Act 6.2

A stacked horizontal bar chart compares GDP growth distributions across fourteen countries, with each bar divided into five percentage-range categories. Built with D3 v7, the visualization maps country names to the y-axis using `d3.scaleBand`, GDP percentage ranges to x-axis positions via `d3.scaleLinear`, and color-codes segments by category using `d3.scaleOrdinal`. Data from `data.csv` is loaded and transformed through `d3.stack`, while interactive hover effects display precise GDP percentage values via a tooltip. The SVG output includes labeled axes and a legend, with styling provided by external fonts and CSS.

VVenkataSatyaRamKamini@my.unt.edu
87% match
Loading thumbnail…

Activity7_Question2

This chart visualizes GDP growth rates over time as a stacked area chart, with each country represented by a distinct colored layer. The data is loaded from a CSV file using `d3.csv` and processed with `d3.groups` to organize values by year, then stacked using `d3.stack()`. The visualization uses D3 v7’s scale functions (`scaleLinear`, `scaleOrdinal`) and the `d3.area` generator to render smooth SVG paths, with axes drawn via `d3.axisLeft` and `d3.axisBottom`. A legend manually constructed with SVG rectangles and text identifies each country.

VVidya Lakshmi Chitturi
86% match
Loading thumbnail…

activity6_task4

This animated bubble chart visualizes the relationship between inflation rate, average GDP, and growth rate across twenty-six countries, with bubble size encoding growth rate and color distinguishing each nation. The D3 v7 code uses `d3.scaleLinear` for positioning and sizing, `d3.scaleOrdinal` with `d3.interpolateTurbo` for color assignment, and builds the SVG with circles, axes, and a legend. A custom tooltip appears on mouseover, showing each country's name. Data is loaded from a CSV file using `d3.csv`.

Vvidiyalasahithi1999@gmail.com
85% match
Loading thumbnail…

Activity 6.task 4

This bubble chart visualizes the inflation rate, GDP, and growth rate for a set of countries. Each circle represents a country, positioned by its inflation rate on the x-axis and average GDP on the y-axis, while the circle’s radius encodes the growth rate. The color mapping uses a categorical scale with an interpolated Turbo palette to distinguish countries, and a legend identifies each one. This D3.js v7 SVG graphic includes a tooltip that displays the country name on hover, with the data read from a local `bubblechart.csv` file.

Ssanavenkatasurendrareddy@gmail.com
81% match