Skip to main content
SimilarExport ZIP
100%

Fork of Activity 6 Tutorial 3.2

✓ Published1🌍 Public
Nnitishsurneni@gmail.com
Last edited Apr 6, 2025
Created on Apr 6, 2025

This line chart visualizes the annual GDP growth percentage of a single country from 2019 to 2024, based on data from the Forbes Billionaires dataset. The D3.js v7 code loads CSV data, extracts the relevant GDP fields, and renders a line chart with red strokes. It uses linear scales for both the x-axis (year) and y-axis (GDP growth), with labeled axes and tick marks generated via `d3.axisBottom` and `d3.axisLeft`. The chart is embedded in an SVG within an HTML page, styled with a steel blue background.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity6_task2

This stacked bar chart displays the GDP growth rates for six countries across five rate categories, from below 6.0 to above 10.5. It uses d3.stack to create the stacked series and d3.scaleOrdinal for color encoding. The d3.axisBottom and d3.axisLeft render the scales, while mouse events update a tooltip showing the exact percentage for each segment.

Vvidiyalasahithi1999@gmail.com
80% match
Loading thumbnail…

activity6 task 2

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.

Ssiri2001j@gmail.com
79% match
Loading thumbnail…

activity 6 task2

This visualization shows the GDP growth rates of six countries, broken down into five distinct growth-rate categories. The chart uses a stacked horizontal bar layout, with each bar representing a country and segmented by its growth-rate proportions. The code uses D3 v7 to create the SVG visualization, employing `d3.stack()` to generate the stacked data structure, `d3.scaleBand()` for the country axis, and `d3.scaleLinear()` for the growth-rate scale. Interactive tooltips display the exact percentage for each segment on mouseover, using D3 event handlers and HTML div elements.

Bbrahmateja.edu2023@gmail.com
78% match
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
78% match
Loading thumbnail…

Fork of activity 6_question

This bubble chart shows the correlation between birthrate, life expectancy, and GDP for 14 countries. The visualization uses animated SVG circles positioned by a linear scale for each axis, with bubble size and color encoding GDP via d3.scaleLinear and d3.scaleOrdinal with interpolateTurbo. A hover tooltip displays each country’s name using D3 event handlers, while a legend explains the GDP scale. The chart is implemented with d3.csv loading, axis generators, and data binding through `join`.

Aanusha.chilkamarri26@gmail.com
78% match
Loading thumbnail…

Fork of Activity 7

A fork of the D3 Activity 7 example displays 2020 population estimates for 30 countries as horizontal bar charts, with a blue axis and green marks. The React app loads CSV data via `d3.csv`, uses `d3.scaleBand` and `d3.scaleLinear` to position bars, and renders SVG elements. Axes, labels, and tick formatting rely on `d3.format`; tooltips are provided by SVG `<title>` elements, and the project includes a D3 v6 tutorial video link.

Jjasthilavanya2022@gmail.com
77% match
Loading thumbnail…

Fork of Fork of Line Chart

This example visualizes India’s GDP in billion US dollars from 2009 to 2022 as a red line chart. The chart uses D3 v5 with SVG rendering, employing `scaleTime` and `scaleLinear` for axes, `axisBottom` and `axisLeft` with grid lines, and a `line` generator. Data is loaded from a CSV file via `d3.csv`, parsed with `new Date` and numeric conversion, then drawn in a centered group with margins, axis labels, and a title.

SSumanya4
77% 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
77% match