sp — VizHub

100%

sp

✓ Published0🌍 Public

Last edited Oct 19, 2025

Created on Oct 19, 2025

A scatter plot displays smartphone models by price on the x-axis and battery life on the y-axis. Each dot encodes brand through color and average rating through size, with a legend explaining the mappings. Built with D3 v7, the visualization uses SVG rendering and includes interactive tooltips that appear on hover. The data comes from a CSV file fetched via URL and parsed with D3's CSV parser, with custom text preprocessing to handle single-line formatting. Axis gridlines and styled panels enhance readability within a dark theme.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

SG

The visualization presents a smartphone scatter plot mapping price against battery life, with each dot representing a model. Color encodes brand, while dot size reflects average rating. The chart uses D3 v7 with SVG rendering, featuring a dark-themed interface, grid lines, custom axes, and a tooltip for detail inspection on hover. Data loads from a raw GitHub gist, where the code normalizes a single-line CSV by inserting line breaks between rows, then binds this data to the visualization elements.

Llohitsai62@gmail.com

87% match

Loading thumbnail…

Scatter plot

This dark-themed scatter plot shows the relationship between units sold and total sales for smartphone models, with each point colored by brand and sized by average rating. Hovering reveals a tooltip with model details. Built with D3 v7, the visualization loads CSV data, applies linear scales for axes and a color scale for brands, and uses SVG circles with mouse events for interactivity.

Llohitsai62@gmail.com

86% match

Loading thumbnail…

Activity6_Tutorial_3_Q3(6,7,8)

A scatter plot shows the relationship between battery life and weight for five smartphone models, with each brand distinguished by a unique symbol shape. The visualization is built using D3.js v7 with SVG rendering, reading data from a CSV file. It uses `d3.scaleLinear` for both axes, `d3.scaleOrdinal` with symbol generators (`d3.symbolCircle`, `d3.symbolSquare`) to encode brand, and a custom legend module. Axes are labeled via `d3.axisLeft` and `d3.axisBottom`.

Cchowdaryhemanth14@gmail.com

82% match

Loading thumbnail…

Activity 6 Q 4.9

This bubble chart compares smartphone brands across battery life (hours), screen size (inches), and charging speed (watts). Each circle’s x-position encodes battery life, y-position encodes screen size, and its area encodes charging speed, with colors distinguishing brands. The D3.js v7 code uses `d3.scaleLinear` for axes, `d3.scaleSqrt` for bubble sizing, and `d3.scaleOrdinal` with `d3.schemeCategory10` for colors. Data comes from a hardcoded CSV-like array. A hover tooltip displays exact values for each smartphone model.

RRukmini Devi Y

80% match

Loading thumbnail…

Shish's Scatterplot- ICE6

This scatter plot shows the relationship between battery capacity (mAh) and price ($) for smartphone models from a 2024 dataset. Each point represents a smartphone model, and hovering reveals details. The visualization uses d3.csv to load data, d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for tick marks, and SVG rendering with D3 v7. A custom tooltip displays information on hover, and the axes are labeled as required.

SSai Shishir Koppula

80% match

Loading thumbnail…

MC

This dark-themed chart compares average smartphone price and average battery life by brand, with white bars repainting the price scale on the left and a neon sky-blue line and dots marking battery life on the right. Built with React and D3 v6, the code uses `csv` to fetch data, `scaleBand` for the x-axis, `scaleLinear` for the two y-axes, and `axisBottom`, `axisLeft`, and `axisRight` for ticks. Animated hover states alter bar opacity and translate via CSS transitions, while the legend sits beneath the chart. Data comes from a remote gistfile.

Llohitsai.nikkil@gmail.com

80% match

Loading thumbnail…

task4.9

This bubble chart visualizes smartphone specifications, plotting storage capacity on the x-axis against RAM on the y-axis. Each data point represents a brand, with circle size reflecting battery capacity in milliamp-hours. The SVG rendering uses D3 v7 scales (`d3.scaleLinear`), axes (`d3.axisBottom`, `d3.axisLeft`), and a categorical color scale (`d3.scaleOrdinal`) to distinguish brands. A legend communicates battery size mapping, while hover effects increase bubble opacity. Data comes from an embedded CSV-style array of 16 phone models.

Yyashwanthkirla95@gmail.com

80% match

Loading thumbnail…

-scatter

This example shows a social network graph of smartphone brands and models, where each phone is plotted as an orange node with labels combining brand and model names. The visualization uses D3.js v7 with the `d3.forceSimulation` API to position nodes through a force-directed layout, applying link, charge, and centering forces. Data is drawn from an inline array of smartphone objects. The graph renders as an SVG with edges and labels, updating positions on each simulation tick through the `ticked` function.

Ssridhardubala106@gmail.com

79% match