Skip to main content
100%

Assignment 2.5:Reusable Scatter plot

✓ Published0🌍 Public
Ppjdhungana@gmail.com
Last edited Jul 16, 2023
Created on Jul 16, 2023
Forked from Hello VizHub

This example demonstrates a reusable scatter plot that visualizes the nutritional properties of cereals, with the x-axis cycling through cups, sugars, sodium, and carbohydrates over time. The plot encodes three variables simultaneously using both the position of the circles and their horizontal and vertical radii, while color indicates the cereal's rating (red for low, orange for average, green for good). The visualization leverages D3 v6.7.0 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll().join()` for rendering, and it smoothly animates between different x-axis variables using `setInterval`. The code loads data from a CSV file and renders the interactive chart as SVG within a full-window canvas.

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