Skip to main content
SimilarExport ZIP
100%

Fork of Reusable D3 Scatter Plot- ICE7

✓ Published0🌍 Public
SSravyaAnnadi
Last edited Jul 1, 2022
Created on Jun 30, 2022

Animated scatter plot of Los Angeles museum attendance data, cycling through four different x-axis variables (Avila Adobe, Firehouse, Chinese American, and America Tropical) while mapping years to colored points. The visualization uses D3 v6 with a reusable `scatterPlot` module, SVG rendering, and `setInterval` to progressively swap the x-axis values. It includes a custom legend with year labels, axis labels, and a title, drawing from CSV data loaded via `d3.csv`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE 7 Reusable D3 Scatter Plot- ICE7

This animated scatter plot visualizes museum visitor data across four exhibits, cycling which museum is plotted on the x-axis every three seconds. Each dot represents a year (2014–2016) colored pink, green, or black, with its position determined by attendance at different Los Angeles museums. The visualization uses a reusable D3 scatterPlot module built with scaleLinear scales, axisBottom, and axisLeft to render axes and circles. Data is loaded via d3.csv from a GitHub-hosted CSV file, with setInterval triggering redraws that swap the x-axis column among AmericaTropical, Firehouse, ChineseAmerican, and AvilaAdobe.

SSravyaAnnadi
89% match
Loading thumbnail…

Fork of Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot explores relationships between four variables from the auto-mpg dataset, cycling which variable maps to the x-axis while the y-axis consistently tracks AvilaAdobe. Built with D3.js (v6.7.0), it renders circles in an SVG, with data points colored by year (pink for 2014, green for 2015, black for 2016). The chart updates via `setInterval`, using `scaleLinear`, `axisLeft`, and `axisBottom` for axes, and appends legend markers and axis labels dynamically.

Hharika-1929
85% match
Loading thumbnail…

Fork of Fork of Fork of Reusable D3 Scatter Plot- ICE7

This visualization shows an animated scatter plot of iris data, cycling through four different yield measurements on the x-axis while the y-axis remains fixed. Colored circles represent three sites (StPaul, Duluth, and Morris) with distinct colors, and the chart includes a legend, axis labels, and a title. The plot updates every few seconds using `setInterval`, swapping the x-value mapping among the dataset columns. It uses D3 v6 with the `csv` loader, `scaleLinear`, `axisLeft`, `axisBottom`, and custom reusable chart functions from `scatterPlot.js`, rendering SVG elements with animated transitions.

MMgk1255
83% match
Loading thumbnail…

Reusable D3 Scatter Plot- ICE7

This animated scatter plot visualizes a road and ride measurement dataset, cycling through four attribute combinations on the x-axis while y remains fixed. Data points are colored by category (word-wrap, word-color, word-country) and rendered as ellipses with variable rx and ry radii. The visualization uses D3 v6 with the reusable `scatterPlot` module, employing `scaleLinear`, `axisLeft`, `axisBottom`, and `setInterval` for rotation. It loads data via `d3.csv`, appends SVG circles, and includes a custom legend with labels.

AAnanthulaaditya
83% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot cycles through the Iris dataset's four numeric attributes on the x-axis while keeping sepal length fixed on the y-axis, with points colored by species (orange, blue, black). Built with D3 v6, the visualization uses `setInterval` to update the x-scale domain and axis via a reusable `scatterPlot` function, rendering SVG circles and labels. Data loads from a CSV using `d3.csv`, with elements re-bound and joined on each interval tick.

RRakshithaRao27
83% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot visualizes the Iris flower dataset, cycling through four feature combinations on the x-axis while mapping species to color. It uses D3 v6 with a reusable scatter plot module, SVG rendering, and a `setInterval` to update the visualization every few seconds. The code leverages `d3.csv` for data loading, `scaleLinear` and `extent` for scales, and `axisLeft`/`axisBottom` for axes, plus manual legend and label elements.

Iianjwo
82% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

An animated scatter plot of the Iris dataset cycles through four flower measurements on the x-axis while keeping petal width fixed on the y-axis. The visualization uses D3 v6’s `selectAll`, `data`, `join`, and `scaleLinear` to render SVG circles colored by species, with `setInterval` updating the x-scale domain and axis labels every few seconds. Data is loaded from a CSV via `d3.csv`, and the reusable chart module `scatterPlot.js` encapsulates the axes and marks.

Ppravallikayaram12
82% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot cycles through four Iris flower measurements on the x-axis while keeping sepal length on the y-axis, with each species colored distinctly (orange, blue, black). Using d3.csv to load the store sales dataset, the visualization employs d3.scaleLinear for axes and d3.axisBottom/axisLeft for ticks. A setInterval timer updates the x-axis value every few seconds, re-rendering the chart. The code also manually draws legend circles and text labels, with a custom scatterPlot module handling the reusable chart structure.

AAnanyaSamala
82% match