Interactive ScatterPlot

Linear Regression and Scatterplot

This visualization shows a scatterplot of EEG data, plotting F3 against F4 values from a CSV dataset, with a red dashed regression line overlaid to display the linear relationship between the two attributes. Interactive dropdown menus allow users to select which EEG channels to compare. The chart is rendered using D3 v4, employing `d3.scaleLinear` for axes, `d3.csv` for loading data, and a custom `calcLinear` function for computing regression parameters, with circles representing individual data points in SVG.

84% match

ScatterPlot

This scatter plot visualizes the relationship between F3 and F4 EEG signal values, with each circle representing a data point from the CSV file. The plot uses D3 v6's scaleLinear, extent, and axis functions to generate the axes and render the circles as SVG elements. The title "Alpha Power of F3 vs F4" labels the chart, while axis labels and tick marks are styled using CSS.

82% match

CMU

This example visualizes EEG signal data, letting users explore relationships between channels (e.g., F3 vs. F4) through scatterplots or line graphs. Buttons switch between beta, alpha, gamma, delta, and other datasets loaded from CSV files. The interface includes dropdown menus for selecting x- and y-axis columns and the chart type. Using D3 v6, the code builds SVG visualizations with animated circle transitions on scatterplots, and uses `scaleLinear`, `axisLeft`, `axisBottom`, and a `line` generator with `curveBasis`.

80% match

CMU Trail

This interactive EEG data explorer visualizes brainwave activity from the CMU Trail dataset. Users select EEG channels to plot against each other, choose between scatterplot, bar chart, or line graph visualizations, and filter by wave types (Alpha, Beta, Gamma, Delta). The scatterplot uses d3.scaleLinear for axes with animated circle transitions via transition.attr, while the line graph uses d3.line with curveBasis. Data is loaded asynchronously from CSV files using d3.csv, with dropdown menus implemented as a reusable ES6 module component.

Linear Regression ParT 2

This example uses D3.js to plot EEG data from a CSV file, comparing the F3 and F4 channels. It renders scatter plot dots colored by manufacturer, along with a red regression line calculated using the least squares method to show the relationship. A tooltip appears when hovering over the line, displaying computed values at the mouse position. Axes, axes labels, and a legend are built with d3.svg.axis.

Scatter Plot

This interactive scatter plot visualizes eye-tracking data, showing the x and y coordinates of mapped fixation points. A dropdown menu allows the user to filter the visualization by the status of the data entries. To create the chart, the code uses the D3.js library, specifically the `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` APIs within an SVG rendering. The image displayed as the background corresponds to the selected data grouping. Altered data is animated with circles transitioning to new positions using the `transition` API.

Nnifemi-sys

Scatter Plot episode 12

This interactive scatter plot visualizes the Iris dataset, letting users switch the x and y axes via dropdown menus. D3 v6 selection joins animate circles with staggered delays as axes and point positions update. The chart uses d3.scaleLinear for quantitative columns, d3.scalePoint for categorical species, and transitions to smoothly grow and reposition SVG circles.

BBart van Pelt

scatter

This example presents an animated scatterplot comparing two datasets loaded from separate JavaScript files. Green and red circles represent positive and negative y-values, transitioning between the datasets every three seconds. Built with D3 v4, the visualization uses `d3.scaleLinear` for axes and `d3.transition` to animate circle positions and radii. An SVG line marks the zero baseline, with axis updates handled by `d3.axisTop` and `d3.axisLeft`.

EEranM6