wailassaad

@wailassaad·2 public vizzes

Fork of Refactor Animated Scatter Plot with Menus

An interactive scatter plot of the Iris dataset rendered as SVG with animated transitions. Users select which numeric column (petal width, sepal width, petal length, or sepal length) drives the x and y axes via HTML dropdown menus. The visualization uses the reusable chart pattern with D3 v6's `selection.join` to handle enter, update, and exit states, animating circle positions and axes through `transition`. Data loads from a CSV via `d3.csv`, and point size grows from zero on initial appearance.

Jun 12, 2021

Loading thumbnail…

Animated Scatter Plot with Menus_testing_dispatch

This interactive scatter plot visualizes the Iris dataset, allowing users to switch both axes between different numeric and categorical columns via dropdown menus. The chart uses D3 v6 with SVG rendering, employing reusable chart and menu components that leverage d3.dispatch for event handling. Animated transitions using d3.transition update circle positions, axis scales, and axis coloring when selections change, supporting linear, band, square root, and power scale types based on the chosen column and data type.

Jun 3, 2021