Arousal Layer

100%

✓ Published0🌍 Public

Last edited Jun 28, 2021

Created on Jun 27, 2021

Arousal Layer visualizes EEG electrode data from channels F3 and F4, plotting alpha and beta frequency band values over time. The visualization, built with D3.js v3/v4, renders multiple line graphs as SVG paths with animated transitions, allowing users to toggle between AlphaF3, AlphaF4, BetaF3, and BetaF4 data series via buttons. The chart displays epochs on the x-axis and amplitude values on the y-axis, with a legend indicating arousal periods across different epoch ranges. Interactive zoom controls (plus/minus buttons) enable detailed examination of the time series data. The visualization uses D3's scales, axes, and line generators to render the physiological measurement data.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Alpha, Beta, Arousal

This visualization charts alpha and beta EEG frequency bands from electrodes F3 and F4, alongside a derived arousal metric across epochs. The SVG line chart plots F3 and F4 values from CSV data, with interactive buttons to toggle between frequency bands and zoom controls using d3.behavior.zoom. A legend distinguishes the colored lines, and clicking the chart updates the axes dynamically. Data is loaded via d3.csv and rendered using d3.svg.line and d3.svg.axis.

HHariprashanth75

90% match

Loading thumbnail…

Valence Layer

This interactive visualization charts valence values derived from alpha and beta EEG frequencies recorded at the F3 and F4 electrode sites. Users can toggle between the four frequency-channel combinations via buttons, with the colored line representing the selected signal and a zoom feature for closer inspection. The example loads data from separate CSV files for each frequency band and uses D3.js version 4 to render the line chart as an SVG with animated transitions. The underlying code also demonstrates importing modules from local ES6 files and loading D3 via UNPKG.

HHariprashanth75

82% match

Loading thumbnail…

Above Line F4

This interactive line chart visualizes alpha and beta EEG frequency band power at electrode F4, alongside F3, over time. The visualization uses D3.js (v3/v4) to render SVG paths that users can switch between using the Alpha and Beta buttons. The line chart includes zoom controls and axes, with data loaded from local CSV files. The graph updates its domain and data when the buttons are clicked, and the legend indicates that the displayed lines represent F4 frequency measurements.

HHariprashanth75

81% match

Loading thumbnail…

Alpha, Beta, Valence

This interactive visualization charts EEG-derived alpha and beta frequency band power from frontal electrodes F3 and F4, alongside a computed valence metric over time. The SVG line chart allows users to toggle between Alpha and Beta datasets, zoom in and out, and click to update axes, with colored lines distinguishing channels and valence segments. It uses D3 v3 and v4 for data binding, scales, axes, and zoom behavior, loading comma-separated values from CSV files.

HHariprashanth75

81% match

Loading thumbnail…

Valence and Arousal wtih Epochs

This interactive visualization plots arousal and valence values across 90 epochs, displaying each metric as a separate line graph with data points. The user can toggle between the two EEG-derived signals via buttons. Built with D3 v4, the visualization uses a linear gradient from blue to red to encode intensity, and circles with tooltips for data inspection. The data is loaded from remote CSV files, with axes styled in yellow against a black background.

HHariprashanth75

80% match

Loading thumbnail…

Above Line F3

This example visualizes alpha and beta frequency band amplitudes recorded from the F3 electrode in EEG data. The line chart displays signal amplitudes over time, with buttons allowing users to toggle between alpha and beta datasets. The visualization uses D3 v3 and v4 to render SVG paths with green strokes on a black background, featuring zoom controls and axis updates. Data is loaded from local CSV files containing time-series measurements with epoch values.

HHariprashanth75

80% match

Loading thumbnail…

Third Valence Arousal

A viewer for EEG arousal and valence signals renders a thick, color-gradient line (blue to red) across time, with interactive buttons to switch between six datasets. Drawn as an SVG using D3.js v3, the chart maps Epoch to the x-axis and F4 signal amplitude to the y-axis. The tooltip on hover reveals data point values, while axes are styled in yellow against a black background.

HHariprashanth75

79% match

Loading thumbnail…

Long Valence Arousal 2

This example visualizes EEG arousal and valence data over time as a thick, gradient-colored line chart against a dark background. It plots the F4 frequency values from the provided CSV files for each epoch, using a blue-to-red gradient to indicate signal intensity. The visualization is built with D3.js, employing linear scales, SVG axes, and a line generator, with small circles marking each data point that reveal frequency details on click. The black canvas and exaggerated chart dimensions emphasize the waveform's shape and peaks.

HHariprashanth75

78% match