Skip to main content
SimilarExport ZIP
100%

Activity8_Question4

✓ Published0🌍 Public
Zzoe.romo@att.net
Last edited Apr 11, 2024
Created on Apr 11, 2024
Forked from Hello VizHub

This interactive bubble chart visualizes laptop prices in relation to screen size (in inches) and RAM (in GB). Each circle’s area encodes price, while its color represents the manufacturer, and hovering reveals the company name via a styled tooltip. The visualization includes dual legends for price scaling and company colors, with axes labeled accordingly. Built with D3.js v7, the chart renders as an SVG and reads data from a local CSV file, using scales like `d3.scaleLinear` and `d3.scaleOrdinal` to map data to visual properties.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Question - 4

This interactive bubble chart displays the correlation between processor speed, RAM, and battery life across various laptop models. Each circle’s position encodes processor speed (x-axis) and RAM (y-axis), while its radius represents battery life in hours, colored by brand. Users can hover over bubbles to view model names via a tooltip. The visualization uses D3 v7 with SVG elements, including axis scales, a bubble-size scale, and an ordinal color scale, alongside a legends for both bubble size and categorical colors. Data is loaded from a CSV file, with animations applied during mouse interactions.

NNitish Thotakura
83% match
Loading thumbnail…

Activity6_Question4

This bubble chart displays the relationship between screen size, price, and resolution for various electronics brands. The visualization uses D3.js v7 to render circles on an SVG canvas, with bubble size representing horizontal pixel resolution. Interactive tooltips appear on mouse hover, displaying detailed specifications including brand, screen dimensions, processor speed, and price. The chart includes labeled axes for screen size and price, with data sourced from a local CSV file containing thirty records across multiple brands.

Ggreeshmareddy135@gmail.com
82% match
Loading thumbnail…

Fork of Activity6 Question4

This bubble chart visualizes the relationship between screen size, price, and horizontal resolution for electronics from multiple brands. Circles positioned by screen size on the x-axis and price on the y-axis have radii scaled by resolution, colored green with red strokes. A tooltip displaying brand, resolution, processor speed, and price appears on mouseover. The chart uses d3.csv, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and SVG circle elements with interactive mouse events.

Ggreeshmareddy135@gmail.com
80% match
Loading thumbnail…

Fork of Activity 6 - Question 4

This interactive bubble chart displays the relationship between screen size and price for a synthetic dataset of electronics, with each circle’s area encoding horizontal resolution. Rendered as SVG using D3 v7, the visualization employs `d3.scaleLinear` for the x, y, and radius scales, `d3.axisBottom` and `d3.axisLeft` for axes, and mouse event handlers (`mouseover`, `mousemove`, `mouseleave`) to show a tooltip with detailed specifications. The code reads data from `bubblechart.csv` and animates transitions on the tooltip’s opacity.

Gganeshrajuparmalla@my.unt.edu
80% match
Loading thumbnail…

Activity6 Question4

A bubble chart displays electronics products with screen size on the x-axis, price on the y-axis, and horizontal resolution scaled to bubble radius using `d3.scaleLinear`. Built with d3.v7 and rendered as SVG circles, each bubble is green with red strokes at 50% opacity. Mouse events trigger tooltips showing brand, resolution, processor speed, and price. Data loads from `bubblechart.csv`, and animations occur through D3 transitions on tooltip opacity.

Ppslharika@gmail.com
80% match
Loading thumbnail…

Activity6_4Q

This D3.js v7 bubble chart visualizes the correlation between screen size, resolution, processor speed, and price for various TV brands. Color encodes brand identity while circle radius represents processor speed, with tooltips revealing brand names on hover. The visualization uses d3.csv to load data, d3.scaleOrdinal for color mapping, and d3.axisBottom/d3.axisLeft for axes. An SVG legend displays highway MPG value ranges and brand color keys, with styled tooltip interactions for enhanced data reading.

Ggreeshmareddy135@gmail.com
80% match
Loading thumbnail…

Activity6_Task4

This interactive bubble chart compares smartphones by price, RAM, and storage, with each bubble representing a brand positioned by price on the y-axis and RAM on the x-axis, while bubble size encodes storage capacity. The visualization uses D3.js v7 to render an SVG with axes, a color scale based on brand, and a legend for storage values. A custom tooltip appears on hover, displaying brand, price, storage, RAM, and screen size, with smooth transitions for show and hide effects. The chart reads the `bubblechart.csv` data file and incorporates React starter code for the frontend framework.

Ssannihitha.k23@gmail.com
79% match
Loading thumbnail…

Activity6Task_4

This bubble chart displays the relationship between processor speed, battery life, and RAM for twenty smartphone brands. Each bubble’s position maps processor speed (x-axis) against battery life (y-axis), while its radius encodes RAM capacity and color distinguishes brand. The visualization uses D3.js v7 with SVG rendering and includes interactive tooltips on hover, plus legends for both RAM size and brand colors. Data is loaded from a CSV file using `d3.csv`, with scales from `d3.scaleLinear` and colors generated via `d3.interpolateTurbo` and `d3.scaleOrdinal`.

Mmanishmanda@my.unt.edu
79% match