Fork of Bubble chart

100%

Fork of Bubble chart

✓ Published0🌍 Public

Last edited Oct 20, 2024

Created on Oct 20, 2024

A bubble chart displays the correlation between the area in square kilometers, GDP in billion USD, and population in millions for major U.S. cities. The visualization uses D3.js v7, rendering SVG circles whose x-position maps population, y-position maps area, and radius encodes GDP. A color scale, derived from the city names via `d3.interpolateTurbo` and `d3.scaleOrdinal`, distinguishes each city, while a tooltip shows the city on hover. The code also includes a legend for bubble size and interactive hover effects.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Bubble chart

This bubble chart shows the correlation between travel and GDP data, with each bubble representing a country and its position determined by GDP on the x-axis and torque on the y-axis. The bubble size encodes highway MPG values. The visualization uses D3 v7 to load CSV data, create linear scales for axes and bubble size, and render circles as SVG elements. Interactive tooltips appear on mouseover, displaying the country name, while a legend explains the bubble size and color mappings.

Rrallabandisushen@gmail.com

85% match

Loading thumbnail…

Fork of Bubble chart

This bubble chart visualizes the relationship between GDP, population, and life expectancy for 16 countries using a Cartesian coordinate system. Each circle's x-position corresponds to GDP, y-position to population, and radius to life expectancy, with color distinguishing countries. Built with D3 v7, the visualization uses `d3.scaleLinear()` for axes, `d3.scaleSqrt()` for bubble sizing, and `d3.scaleOrdinal()` for categorical coloring. Interactive hover effects enlarge bubbles and display country labels via `.on('mouseover')` handlers. Data loads from a local CSV file, rendered as SVG with animated transitions on user interaction.

Ssathvik0311@gmail.com

84% match

Loading thumbnail…

activity6_q9

A bubble chart maps population on the x-axis, area on the y-axis, and GDP to bubble size and color for 25 US cities. Each city’s bubble uses a distinct color from the `d3.interpolateTurbo` scale and is positioned using `d3.scaleLinear`. Hovering reveals a tooltip with city name and GDP. A legend displays GDP values, with circle sizes corresponding to the `z` scale. Data comes from `bubblechart.csv`.

Ggketan456@gmail.com

84% match

Loading thumbnail…

Fork of Activity6_Task4

This interactive bubble chart visualizes the relationship between city population, area, and GDP. Each circle’s size encodes GDP, position maps population and area, and color distinguishes cities. The chart uses D3 v7 with SVG and animation, featuring custom tooltips that display city details on hover. Data is loaded from a CSV file and rendered with scales for axes and bubble sizing.

IILYAS AHMED

83% match

Loading thumbnail…

Fork of Activity6_Task4

IILYAS AHMED

83% match

Loading thumbnail…

Fork of A6_Q4

This bubble chart visualizes the relationship between city GDP, population, and happiness for ten U.S. cities, mapping GDP to the x-axis, population to the y-axis, and bubble size to happiness scores while a linear color scale from lightgreen to darkgreen encodes the same happiness values. The visualization uses D3.js v6 with SVG rendering, employing d3.scaleLinear for the axes and d3.scaleSqrt for bubble radii, with data loaded from a CSV file and parsed into numeric values.

SShashankkodishala@my.unt.edu

83% match

Loading thumbnail…

Fork Question4-Bubble chart

This bubble chart visualizes the correlation between GDP per capita, life expectancy, and population-area ratio for 20 countries. Each circle represents a country, with its x-axis position reflecting GDP per capita, y-axis position reflecting life expectancy, and bubble size proportional to population density. The chart uses D3.js v7 with the `scaleLinear` API for axis and bubble scaling, and the `scaleOrdinal` API for color assignment. Interactive tooltips display precise country data on hover, while an SVG-based legend identifies each nation’s color.

Aakhillenkalapally1999@gmail.com

83% match

Loading thumbnail…

activity6_question9

A bubble chart compares the population and GDP of 25 major U.S. cities, with bubble size representing city area and color intensity encoding GDP. The visualization uses D3.js v7 to load data from a CSV file and render SVG circles. Interactive tooltips appear on mouseover, showing each city's population and GDP. The chart includes labeled axes, a legend for area, and uses `d3.scaleLinear`, `d3.scaleSequential`, and `d3.interpolateBlues` for encoding.

Ggketan456@gmail.com

83% match