Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Hello VizHub

✓ Published1🌍 Public
Hharinimoorthi05@gmail.com
Last edited Aug 9, 2024
Created on Aug 9, 2024

This example visualizes the relationship between horsepower, torque, and highway MPG for various car makes. A bubble chart uses x- and y-axes for horsepower and torque, while bubble size and color encode MPG and car brand, respectively. Built with D3 v5 and SVG, it reads data from a local CSV file, employs d3.scaleLinear for axes and bubble sizing, uses d3.scaleOrdinal with d3.interpolateTurbo for color mapping, and includes interactive tooltips on mouseover. Animated transitions handle tooltip fading.

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…

Fork of Fork of Fork of Hello VizHub

This bubble chart explores the correlation between average horsepower, torque, and highway MPG for various car makes, sourced from a CSV file. Using D3 v5, the visualization plots horsepower on the x-axis and torque on the y-axis, with bubble size representing MPG and color differentiating car brands via a turbo color scale. The SVG rendering includes interactive tooltips that appear on mouseover, displaying the specific car make. The chart is built with `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.scaleOrdinal`, and it leverages `d3.csv` to load data and `d3.interpolateTurbo` for color mapping. This example demonstrates how to combine multiple quantitative and categorical variables in a single animated, interactive graphic.

Hharinimoorthi05@gmail.com
96% match
Loading thumbnail…

Fork of Hello VizHub

This bubble chart visualizes the relationship between average horsepower, torque, and highway MPG for various car brands. Each circle's position encodes horsepower and torque, while its radius and color represent highway MPG, with a legend for scale. The visualization uses D3.js v7, reading data from a CSV file. It implements interactive tooltips on mouseover and employs D3's scaleLinear, scaleOrdinal, and interpolateTurbo for encoding, rendering via SVG.

Ssusarlasruthi2000@gmail.com
95% match
Loading thumbnail…

Fork of Hello VizHub

This bubble chart visualizes the correlation between average horsepower, torque, and highway MPG for various car makes. Each circle's x-position maps to horsepower, y-position to torque, and its size encodes highway MPG, with a color scale distinguishing car brands. Built with D3.js v7, the visualization reads CSV data and renders as an SVG. Interactive tooltips display the car make on hover, while a legend explains the bubble size scale.

Iindushashi.g@gmail.com
95% match
Loading thumbnail…

Fork of Hello VizHub

This bubble chart visualizes the correlation between average torque, horsepower, and highway MPG for various car makes. Each circle’s position encodes horsepower and torque on the x- and y-axes, while its radius and color represent highway MPG and car brand, respectively. Built with D3 v7, it loads CSV data and renders an SVG with axes, legends, and interactive tooltips on mouseover. Hovering highlights the make, and the legend explains both bubble size and color mappings.

Nnagabinduk2023@gmail.com
95% match
Loading thumbnail…

Fork of Hello VizHub

This bubble chart visualizes the correlation between average horsepower, torque, and highway MPG for various car makes. Using D3.js, it plots horsepower on the x-axis, torque on the y-axis, and scales bubble radius by MPG, with color encoding by make. The code loads data from a CSV via `d3.csv`, uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` for colors, and renders SVG circles with hover tooltips showing each make's name.

Ppraneeth7222@gmail.com
94% match
Loading thumbnail…

Fork of Hello VizHub

This bubble chart shows the correlation between average horsepower, torque, and highway MPG for 31 car makes. Each circle’s position encodes horsepower on the x-axis and torque on the y-axis, while its radius and color represent highway MPG. The visualization uses d3.csv to load data, d3.scaleLinear for axes and bubble size, and d3.scaleOrdinal with interpolateTurbo for color mapping. Interactive tooltips appear on mouseover. A legend explains the MPG size scale, and a second legend lists makes with their colors.

Ssusarlasruthi2000@gmail.com
94% match
Loading thumbnail…

Fork of Hello VizHub

This D3.js v7 bubble chart visualizes the correlation between average horsepower, torque, and highway MPG across 31 car makes. Each circle’s x-position maps to horsepower, y-position to torque, and radius to highway MPG, while color distinguishes makes using `d3.scaleOrdinal` with `d3.interpolateTurbo`. The code reads data from a CSV via `d3.csv`, renders an SVG with axes and labels, and includes an interactive tooltip on `mouseover`, `mousemove`, and `mouseleave` events. A legend communicates bubble size and color mapping.

Ssaivaishnogaruda@gmail.com
93% match
Loading thumbnail…

Fork of Bubble chart

This bubble chart visualizes the relationship between average horsepower (x-axis), torque (y-axis), and highway MPG (bubble size and legend) for various car makes. Built with D3 v7, it renders an SVG with animated transitions, using a turbo color scale to differentiate car brands. Interactive tooltips display the make of each vehicle on mouseover, while a legend shows both MPG value scaling and color-coded brand categories, with data loaded from a CSV file.

Ssravani1969@gmail.com
92% match