Skip to main content
SimilarExport ZIP
100%

A5 Bubble Plot (D3)

✓ Published1🌍 Public
NNoah C.
Last edited Feb 27, 2024
Created on Feb 27, 2024

This bubble plot visualizes alcohol and tobacco usage across U.S. states, with circle size encoding population and color intensity representing alcohol use rates per 1000 people. Built with D3 v7, it uses `d3.scaleLinear` for position, radius, and color mapping, plus SVG circles with `title` elements for hover tooltips. The chart loads CSV data from a GitHub gist and displays axes with custom tick formatting, along with descriptive legends and labels.

AI-generated description

Visualization of alcohol usage and tobacco usage vs population size and alcohol usage rates from the CORGIS dataset made with D3. Implementation learned from D3 Graph Gallery.

Circle size correlates with population size and color intensity correlates with rate of alcohol usage per 1000 people.

Hover over dots to see values for that point.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Q4

This D3.js bubble chart visualizes the relationship between reported alcohol and tobacco use across U.S. states, with data sourced from the CORGIS dataset. Circle position maps total alcohol use against total tobacco use, while circle size encodes population and color intensity represents the rate of alcohol use per 1000 people. The chart uses `d3.scaleLinear` for axes, size, and color, and renders SVG circles with hover tooltips via `<title>` elements. It includes labeled x and y axes, a chart title, and a legend explaining size encoding.

Llingaladineshteja23@gmail.com
88% match
Loading thumbnail…

Activity 6 Question 4

This bubble plot visualizes the relationship between alcohol and tobacco use across U.S. states, with circle size encoding state population and color intensity representing alcohol use rates per 1,000 people. Built with D3 v7, it loads CSV data from a GitHub repository and renders an SVG scatterplot using `d3.scaleLinear` for positioning, sizing, and coloring, along with `d3.axisBottom` and `d3.axisLeft` for axes. Tooltips provide detailed values for each state via appended `title` elements.

Hhaneesh@gctc.in
88% match
Loading thumbnail…

Activity-8_Question-4

This scatterplot visualizes the relationship between total reported alcohol and tobacco use across U.S. states, where each bubble’s size represents the population of adults aged 26 and older. The color intensity reflects the rate of alcohol use per 1,000 people, with tooltips providing exact values. Built with D3 v7, the chart uses `d3.scaleLinear` for position, radius, and color encoding, along with `d3.axisBottom` and `d3.axisLeft` for axes. Data comes from a CSV hosted on GitHub, rendered as SVG circles over linear-scaled axes with custom legends.

Hharipadmavathim2023@gmail.com
86% match
Loading thumbnail…

Fork of Activity6_Q4

This bubble chart compares total alcohol and tobacco use across US states in the past month, with circle size encoding population and color intensity representing alcohol usage rates per 1000 people. It uses d3.csv to load data from a filtered CORGIS dataset and renders SVG circles with d3.scaleLinear for x, y, radius, and color scales. Tooltips are provided via SVG title elements on each circle.

Llingaladineshteja23@gmail.com
85% match
Loading thumbnail…

A4 Scatterplot (D3)

This scatterplot visualizes the relationship between reported alcohol and tobacco use among individuals aged 26 and older, using data from the CORGIS dataset. Each red dot represents a state or region, plotting total monthly tobacco use on the x-axis against alcohol use on the y-axis, with values displayed in thousands. Hovering over a dot reveals a tooltip with the exact figures via SVG `<title>` elements. The visualization is built with D3 v7, using `d3.csv` for data loading, `d3.scaleLinear` for axes, and `d3.axisBottom` and `d3.axisLeft` for rendering ticks.

NNoah C.
83% match
Loading thumbnail…

A5 -D3 Bubble Chart

This D3.js v7 bubble chart visualizes U.S. states, plotting total area on the x-axis, state names on the y-axis, and population as bubble radius. Color encodes the century of state admission (1700s, 1800s, 1900s). Built with SVG, it uses d3.scaleLinear, d3.scaleBand, and d3.scaleOrdinal. Data is loaded from a CSV via d3.csv. Interactive tooltips appear on hover.

Rragregory@dons.usfca.edu
81% match
Loading thumbnail…

A6 Barchart D3

This example visualizes the percentage of smokers in the United States from 1980 to 2012 using a vertical bar chart. Each bar’s height and color encode the recorded percentage value, with a sequential blue color scale mapped via `d3.scaleSequential` and `d3.interpolateBlues`. The chart includes axes, labels, a title, and a legend generated with the `d3-legend` library’s `d3.legendColor`. Data is loaded from a CSV file and rendered as SVG using D3 v7, with tooltips provided by appended `<title>` elements.

EEric Yao
76% match
Loading thumbnail…

A5 Line Chart D3

This line chart displays the percentage of smokers in the United States from 1980 to 2012, comparing total, male, and female rates over time. It uses d3.csv to load data from smokersus.csv, d3.scaleBand and d3.scaleLinear for axes, and d3.line to generate three separate paths for each demographic group. Circles are drawn using SVG circle elements with hover tooltips created via appended title tags. The chart is rendered as an SVG element sized to the window dimensions, with color-coded points and lines for each category.

EEric Yao
75% match