Kaushal Sen

@kaushal-sen·4 public vizzes

Fork of Responsive Scatter Plot

An animated scatter plot of the Iris dataset cycles the x-axis through four flower measurements while the y-axis remains fixed at sepal length. D3 scales map the data, with circles colored by species using a custom marker function. A setInterval updates the x-value property, re-rendering the chart to rotate through petal width, sepal width, petal length, and sepal length, with axes, labels, and a legend redrawn each iteration.

Apr 11, 2024

Loading thumbnail…

Fork of Reusable Scatter plot Activity 8

This animated scatter plot visualizes the Iris dataset, cycling through different pairings of sepal and petal measurements on the x-axis while keeping sepal length on the y-axis. It uses a custom reusable scatter plot module built with D3’s `scaleLinear`, `axisLeft`, and `axisBottom`. The visualization animates by updating the x-value mapping every few seconds, with species-colored points and a legend. Data is loaded from a remote CSV file, and the plot includes styled titles, axis labels, and a color legend, all rendered as SVG.

Apr 11, 2024

Loading thumbnail…

Trial Attempt

This example visualizes the relationship between a circular network layout and its underlying data structure by rendering a force-directed graph with animated, pulsing nodes. It uses `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` to compute node positions, while `d3.select` and `transition.attrTween` animate the node radii and link opacity over time. The visualization draws nodes as circles using SVG `circle` elements and links as lines, with a color scale mapping node degree to hue. Node sizes encode a second data dimension, and the simulation runs continuously, updating positions and styles each tick.

Apr 11, 2024

Loading thumbnail…

Fork_Cherryl

This animation cycles through different iris flower measurements on the x-axis of a scatter plot, using D3.js to render the data from the Iris dataset. The visualization displays four quantitative variables—petal width, sepal width, petal length, and sepal length—with each species (setosa, versicolor, virginica) colored distinctly. A reusable `scatterPlot` component, built with D3 scales and axes, updates at set intervals via `setInterval` to rotate through the dimensions. SVG circles represent individual flowers, with a legend and axis labels complementing the animated transitions.

Apr 11, 2024