Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This animated scatter plot cycles through different iris flower measurements, plotting petal width, sepal width, petal length, and sepal length every two seconds. The visualization uses the D3.js library's `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll` APIs to render SVG circles and axes. Data comes from the classic Iris dataset loaded via D3's `csv` function. Circle colors encode species—blue for setosa, red for versicolor, yellow for virginica—while a black background and white axis labels maintain high contrast throughout the animation.

Eeravellisaimeghana

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This interactive scatter plot visualizes the Iris flower dataset, mapping petal width and sepal length with color-coded species (blue, red, yellow). Built using D3 v6, it employs reusable chart components through `scatterPlot()` with `scaleLinear`, `axisLeft`, and `axisBottom` for axes. The SVG renders animated circles with white strokes, while data is loaded via `d3.csv` from a remote URL. Dynamic resizing adapts to the viewport, and commented code shows potential for cycling through different column pairings over time.

RRadhakrishna246

BBajiSharifPatan@my.unt.edu

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This interactive scatter plot visualizes the Iris flower dataset, mapping petal width and sepal length on the x- and y-axes. Each circle represents a data point, colored by species (blue for setosa, red for versicolor, yellow for virginica) with white strokes. The visualization uses d3.scaleLinear, axisLeft, axisBottom, and a reusable scatterPlot function built with D3 v6. SVG rendering displays the axes and circles, with the plot dynamically updating when the x-value column cycles through dataset attributes. Data loads from a remote CSV file via d3.csv.

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This interactive scatter plot visualizes the Iris dataset, showing the relationship between two selected measurements. A small multiples approach animates through four variable pairings (petal width, sepal width, petal length, and sepal length) on the x-axis every two seconds, while data points are colored by species. Built with D3.js, it uses `scaleLinear` for axes, `axisLeft` and `axisBottom` for ticks, and a reusable scatter plot component created with the `scatterPlot` function. The SVG rendering includes colored circles with white outlines, and the animation cycles using `setInterval`.

Ssnehareddygurram

VVenkata Rajashekar Reddy Chinthala

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

A reusable D3 scatter plot displays the Iris dataset, mapping petal width against sepal length. Each circle’s color encodes the species (setosa in blue, versicolor in red, virginica in yellow), with white strokes and labeled axes. Built using `d3.csv`, `d3.scaleLinear`, `d3.axisLeft`, and `d3.axisBottom`, the plot updates via a configurable `scatterPlot` module, iterating through data columns. The visualization renders in SVG on a black background with white text, emphasizing interactive reuse of axes and data bindings.

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

The scatter plot visualizes the Iris dataset, with points colored by species (blue, red, yellow) and axes labeled for sepal and petal measurements. It uses D3.js (scaleLinear, extent, axisLeft, axisBottom) to map data to coordinates. An animation cycles the x-axis between four measurement columns every two seconds, dynamically re-rendering the SVG. Data is loaded from a GitHub-hosted CSV file, and the plot is built with a reusable custom scatterPlot component.

SSheshidharreddy

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This example shows an animated scatter plot of the Iris dataset, cycling through four numeric attributes every two seconds. Each point is colored by species (blue, red, or yellow). The visualization uses D3 version 6 features, including `scaleLinear`, `axisLeft`, `axisBottom`, and `extent` to map data coordinates. The reusable `scatterPlot` function updates the x-axis and circle positions via `setInterval`, rendering in SVG on a black background with a white axis and labels.

SSheshidharreddy

Fork of ICE - 7 Reusable Scatter Plot Maanas Katta

This scatter plot visualizes the Iris dataset, displaying the relationship between petal width and sepal length. Each circle represents a flower, colored by species: grey for setosa, green for versicolor, and pink for virginica. The visualization uses D3.js's `scaleLinear`, `axisLeft`, and `axisBottom` APIs to render axes and the `join` operation for SVG circles. Data is loaded via `d3.csv` from a GitHub gist, with the plot rendered as an SVG, and the code demonstrates a reusable `scatterPlot` function with configurable dimensions, margins, and radius.

PPrathyusha0304