Skip to main content
SimilarExport ZIP
100%

Activity6Question4

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

A bubble chart maps candy characteristics, plotting sugar percentage on the x-axis and price percentage on the y-axis, with bubble size representing win percentage. The chart uses d3.csv to load data from a GitHub repository, d3.scaleLinear for axes, d3.scaleSqrt for bubble sizing, and d3.scaleOrdinal with d3.schemeCategory10 for colors. An SVG rendering includes interactive tooltips that display candy name, sugar, and price values on mouseover.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task4

This bubble chart visualizes the relationship between sugar percentage and price percentage for various candies, with bubble size representing win percentage and color distinguishing competitor names. It loads CSV data from a GitHub repository using D3's `d3.csv` method, then renders an SVG with `d3.scaleLinear` for both axes, `d3.scaleSqrt` for bubble sizing, and `d3.scaleOrdinal` with `d3.schemeCategory10` for color mapping. Interactive tooltips appear on mouseover, styled via CSS, providing candy name and values.

CChandra Prakash Reddy Kalwakolu
92% match
Loading thumbnail…

Activity6_Task3(Question 6)

This scatter plot visualizes candy data, showing the relationship between sugar percentage and win percentage. Each dot represents a candy type, colored red for chocolate candies and blue for non-chocolate candies. The visualization uses D3 v6's `csv` loader to fetch data from a GitHub repository, then employs `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to create the axes. The SVG rendering includes labeled axes for sugar and win percentages, with the plot displayed across the full browser window using `window.innerWidth` and `window.innerHeight`.

SSowjanya Devupalli
85% match
Loading thumbnail…

Activity6_Question3

This example shows a scatter plot of the candy dataset, mapping sugar percentage on the x-axis and win percentage on the y-axis. Each circle is colored red or blue depending on whether the candy contains chocolate. The visualization uses D3 v6 with SVG rendering, loading data from a GitHub-hosted CSV file. It applies `scaleLinear` for both axes, `extent` to set domains, and `axisLeft` and `axisBottom` for tick marks, along with explicit axis labels.

Ggnanendra097@gmail.com
85% match
Loading thumbnail…

Activity6_Q3

This scatter plot visualizes candy data, showing the relationship between sugar percentage and win percentage, with each point colored by competitor name. The chart uses D3 v6 with an SVG rendering approach, employing `scaleLinear` for both axes, `extent` for domain calculation, and `scaleOrdinal` with `schemeCategory10` for color encoding. Data is loaded asynchronously from a CSV file via `d3.csv`, and circles are bound to the data using the join pattern. Axes are generated with `axisLeft` and `axisBottom`, with additional text labels for each dimension.

AAnirudhaKulakarniKaranam@my.unt.edu
83% match
Loading thumbnail…

Activity6_Task4

A bubble chart visualizes correlations between average weight, sugar content, and price per kilogram for various fruits. Sized circles encode price, while color distinguishes fruit types. Built with d3.v7, it uses `d3.scaleLinear` for axes and bubble size, `d3.scaleOrdinal` with `d3.interpolateTurbo` for colors, and an interactive tooltip on mouse events. Data loads from a CSV file, rendered as SVG, with hover opacity changes and a size legend.

Aamanipeddolla@my.unt.edu
83% match
Loading thumbnail…

Activity6_Task4 Question 4

This bubble chart visualizes nutritional data for fruits, plotting weight in grams on the x-axis against calories on the y-axis, with bubble radius encoding sugar content. Each circle is labeled with the fruit name, and its size reflects the square-root-scaled sugar value. The visualization uses D3 v7 with SVG rendering, d3.scaleLinear for axes, d3.scaleSqrt for bubble sizing, and d3.csv to load the fruits.csv data file. Standard d3.axisBottom and d3.axisLeft calls generate the axes.

Vvemulasai306@gmail.com
82% match
Loading thumbnail…

Activity 6 Question 4

A bubble chart compares beverage manufacturers by plotting glucose levels on the x-axis and ratings on the y-axis, with bubble size encoding calories and color distinguishing brand names. Built with D3 v7, the SVG visualization includes hover tooltips showing calorie and glucose values, plus legends for bubble size and color categories. The chart reads from an external CSV file and animates interactive mouseover transitions.

Jjaswanthreddy2000@gmail.com
82% match
Loading thumbnail…

Activity6_Question4

This example shows a bubble chart comparing beverage manufacturers by plotting glucose levels on the x-axis and ratings on the y-axis, with bubble size encoding calorie content and color distinguishing maker categories. The visualization uses d3.csv to load tabular data and d3.scaleLinear for the x, y, and bubble radius scales, while d3.scaleOrdinal assigns distinct colors to manufacturers. SVG circles are rendered with d3.selectAll and .join('circle'), and an interactive tooltip appears on mouseover using D3’s event handling. The chart includes labeled axes, a title, and legend ranges for the scales.

SSiddhartha Alwala
82% match