Fork of Reusable D3 Scatter Plot

Fork of Reusable D3 Scatter Plot

This example shows a reusable scatter plot of the Iris dataset, cycling through four measurement columns every two seconds. It animates the x-axis mapping while keeping sepal length on the y-axis. The chart uses D3 v6 APIs including `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `csv` for data loading. A custom `scatterPlot` function builds the SVG, and circles transition between positions as the x-value changes. The visualization fills the viewport and applies styling from the Share Tech font.

Aayodhyanandh

Fork of Reusable D3 Scatter Plot

This fork of the Iris Dataset scatter plot cycles through four flower measurements every two seconds, animating which dimension appears on the x-axis while sepal length stays fixed on the y-axis. Built with D3 v6, it uses `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll` to render SVG circles and axes. The reusable chart pattern exposes setter methods like `xValue` and `radius` for configuration. Data loads from a CSV via `csv()` and is parsed to numbers; a `setInterval` triggers re-renders to switch columns.

Aarchanagoli@my.unt.edu

Cchengalvasharanya@gmail.com

Fork of Reusable D3 Scatter Plot

This example shows an animated scatter plot of the Iris dataset, cycling through different flower measurements on the x-axis every two seconds. The visualization uses D3 v6’s `scaleLinear`, `axisLeft`, and `axisBottom` within a custom reusable `scatterPlot` function, rendering SVG circles with `selectAll` and `join`. Data loads from a CSV via `d3.csv`, with axes updating dynamically through repeated `svg.call(plot)` invocations.

Bbhargavinalamothu@gmail.com

Fork of Fork of Fork of Reusable D3 Scatter Plot

This reusable scatter plot, written with D3 version 6, displays a set of numeric x/y data points as steelblue circles. The example fetches its data from a JSON file hosted in a GitHub gist, then maps the raw values to numbers. It builds an SVG canvas and uses `d3.scaleLinear` with `d3.extent` to compute the axes, which are rendered with `d3.axisBottom` and `d3.axisLeft`. The chart includes labeled X and Y axes, with the plotting logic encapsulated in a function for reuse.

Fork of Reusable D3 Scatter Plot

This fork of a reusable D3 scatter plot animates through four columns of a custom Iris dataset, cycling every two seconds between Height, Length, TopLeftCornerX, and TopLeftCornerY as the x-axis variable. Built with D3 v6, it uses `scaleLinear`, `axisLeft`, `axisBottom`, and data joins to render SVG circles and axes. The chart is driven by a `scatterPlot` closure that accepts configurable accessors, with `setInterval` triggering re-renders. The dataset is loaded via `csv` from a remote gist, with a full-viewport SVG and the Share Tech font.

KKeerthipriyaBankuru

Fork of Reusable D3 Scatter Plot BT

This interactive scatter plot visualizes fruit data loaded from a CSV file, showing relationships between variables like retail price and yield. Points appear as different shapes—circles, triangles, and squares—based on the yield value. The x-axis automatically cycles through numeric columns every two seconds, animating the chart to compare different data dimensions. Built with reusable D3 code, it uses `scaleLinear`, `axisBottom`, and `axisLeft` for scales and axes, with SVG paths for point shapes.

TTarun Kumar Bosupally

Fork of Reusable D3 Scatter Plot

This example presents an animated scatter plot of the Iris dataset, cycling through different flower measurements every two seconds. A reusable D3 scatter plot module uses `scaleLinear`, `axisLeft`, and `axisBottom` to render circles in an SVG. The code imports data via `csv` from D3 v6, parses numeric columns, and updates the x-axis mapping with `setInterval`. The full-window visualization includes custom styling from the Share Tech font.

PPoojaThandra

Fork of Reusable D3 Scatter Plot_curr

This animated scatter plot visualizes the Iris flower dataset, cycling through four measurement columns as the x-axis every two seconds. Using D3 v6, it renders SVG circles and axes via a reusable scatterPlot function, scaling with the window dimensions. The visualization updates x-axis mappings via `setInterval`, calling the plot with new data accessors, while axes are redrawn using `axisBottom` and `axisLeft`.

Sskmriyaz0786@gmail.com