Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 Tutotial Video 5 Viz Project #2: Wavy Bars

Public visualization

Viewing a saved revision (read-only)

08e1cf57348d4b748241ca6c8ccac2ea

D3 Tutotial Video 5 Viz Project #2: Wavy Bars

0 stars0🌍 Public
CCasualWanderer20XX
Last edited Sep 13, 2025
Created on Sep 13, 2025

Animated wavy bars fill the browser window, with each bar's height, vertical position, and opacity oscillating over time to form a flowing wave pattern. The visualization runs a continuous animation loop, updating every 60th of a second using JavaScript's `setInterval`. The D3 library's `select`, `selectAll`, and `join` methods bind data to SVG `rect` elements, while a custom `makeData` function generates the wave values using trigonometric sine functions. The bars animate across the full viewport width, with D3 7.9.0 handling all rendering and data updates.

AI-generated description