Skip to main content
SimilarExport ZIP
100%

ICE 7

✓ Published0🌍 Public
SSnarasimhap
Last edited Jul 2, 2022
Created on Jul 2, 2022

This interactive scatter plot maps student marks across Math and Science, with age encoded by symbol type. It cycles through different data columns as the x-axis every fifteen seconds, updating the visualization dynamically. Built with D3, it uses `scaleLinear`, `axisLeft`, `axisBottom`, `symbols`, and `scaleOrdinal` to render the SVG animation. The plot pulls data from a CSV file and adjusts its axes and points in real time, all within a responsive full-screen viewport.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 - Scatter Plot

This animated scatter plot maps student performance metrics, such as scores in tenth, twelfth, and college, along with time spent, against each other. The plot cycles through different x-axis variables, updating the visualization in a loop, and colors data points by hobby categories: Cinema, Sports, and Others. Built with D3 v6, it uses `d3.csv` to load the data and a custom `scatterPlot` module that constructs axes and circles, rendering the SVG animation with a legend and labels.

AAshrith Kudidhi
86% match
Loading thumbnail…

ICE 7

This animated scatter plot cycles through the four numeric dimensions of the Iris dataset, changing the x-axis attribute every two seconds while keeping sepal length fixed on the y-axis. It uses d3's `scaleLinear` for axis scaling, `axisLeft` and `axisBottom` for tick marks, and the `join` operator for idempotent SVG circle updates. Data loads via `d3.csv`, and the plot resizes to the browser window.

Vvineeth-001
83% match
Loading thumbnail…

ICE 7

This animated scatter plot cycles through four different pairings of the Iris dataset’s numeric columns, using a reusable charting API built with D3’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom`. The SVG visualization updates every two seconds, re-mapping the x-axis to a new attribute while keeping the y-axis fixed. The code defines a configurable `scatterPlot` function with setters for data, dimensions, and value accessors, then applies it repeatedly to a full-window canvas with a custom font.

Bbhargavarathod
83% match
Loading thumbnail…

ICE 7

This reusable D3.js scatter plot animates through different axis configurations of the Iris dataset, cycling petal and sepal measurements every two seconds. Implemented with the D3 API, it uses `scaleLinear`, `axisLeft`, `axisBottom`, `symbols`, and `scaleOrdinal` to map species to distinct colors and shapes. The SVG rendering includes a dynamic legend and title, with the plot’s margins and radius configurable, demonstrating a chart pattern for interactive data exploration.

RRebecca Moore
82% match
Loading thumbnail…

ICE - 7

This interactive scatter plot animates through different attributes of a college dataset, cycling the x-axis among Unemployment_rate, Employed_full_time_year_round, Unemployed, and Employed every 1.9 seconds while the y-axis remains fixed on Employed. Each point represents a major category, colored distinctly by its category, with a reusable scatterPlot module built on D3's scaleLinear, axisLeft, and axisBottom. The SVG visualization, rendered on a wheat background, uses the Share Tech font and updates labels dynamically to reflect the current x-axis metric.

HHarishma Nallala
82% match
Loading thumbnail…

ICE7_Reusablescatterplot

This interactive scatterplot displays course data by plotting marks, time, and course number against each other. Built with D3.js 6.7.0, the visualization uses a reusable scatter plot module with linear scales and axis helpers. Every five seconds, the x-axis switches between the three data columns, animating the circles to reflect the new mapping. The SVG rendering adapts to the browser window size, with data loaded from a remote CSV file.

SSai Bhavana Akkineni
82% match
Loading thumbnail…

ICE7

An animated scatter plot cycles through four Iris dataset variable pairs every two seconds, revealing different correlations between measurements. Each circle represents a flower sample, with axes rescaling to the current variable selection. The reusable chart module updates its x-value accessor while preserving the same SVG rendering. D3's `scaleLinear`, `axisLeft`, `axisBottom`, and data joins create the idempotent visualization, with `setInterval` driving the sequential column switching.

Ppeesarie
82% match
Loading thumbnail…

ICE -7 reusable scatter plot

This example cycles through a series of scatter plots, showing exam score correlations for each pair of six subjects (Telugu, Hindi, English, Maths, Science, Social). Each plot displays student scores as small, semi-transparent circles, with a new subject pair and color appearing every two seconds. The visualization is built with D3 v7, using `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and `d3.csv` to load the dataset from a GitHub gist. The SVG elements are recreated on each interval to switch the plotted variables.

Cchalasanigayaetiri@gmail.com
81% match