Examples for d3.Oakland Presentation

Generative Art

• Overlapping Circles (direct)
• Voronoi Sorting (direct)

Audio synthesis and manipulation

• Web Audio 'Theremin' (direct)
• Web Audio Sampler (direct)
• Building Audio Waves Using d3-ease (direct)
• I Am Sitting in a Room by Alvin Lucier (direct) (original)
• Come Out and It's Gonna Rain by Steve Reich (direct) (Steve Reich)
• Wave Phasing Using d3-ease (direct)

Using Audio with Data Visualization

• Sound of the Stock Market

Visualizations of live sound in 2D (requires access to your computer's microphone)

• Spectrum Dots
• Radial Line - bright
• Radial Line - dark
• Rotating Ellipses - v1
• Rotating Ellipses - v2
• Rotating Ellipses - v3
• Horizontal Ellipses

Visualizations of compounding waves

• Additive Synthesizer
• Compounding Waves (direct)
• Compounding Radial Waves v1 (direct)
• Compounding Radial Waves v2 (direct)
• Compounding Radial Waves v3 (with sound) (direct)

Visualization of Parametric Equations in 2D

• Lissajous Curve
• Butterfly Curve
• Rhodonea/Rose Curve
• Rhodonea/Rose Curve with four inputs (gets messy)
• Harmonograph
• Harmonograph - Live Sound

Visualization of Parametric Equations in 3D

• Lissajous Curve - Lines
• Lissajous Curve - Mesh
• Rhodonea/Rose and Lissajous Curve - Spheres
• Rhodonea/Rose and Lissajous Curve - Ribbon and Tube
• Harmonograph

Visualizations of live sound in 3D (requires access to your computer's microphone)

• Distorting Sphere - Wireframe
• Distorting Sphere - Fill
• Distorting Vertices
• Distorting Vertices - Spheres
• Harmonograph
• Ear Worm

Related Videos:

• Analog Video Synthesis with Arp 2600 - Adam Somers
• John Hawk: What to do with a dot.
• Adagio for Jon and Helena - Michael Scroggins
• DJ VJ mr cocoon 2009 demo mix
• Believer - Jim Ellis

Some links and things to read:

• three.js examples
• The MDN section on Web Audio API
• A good tutorial introduction to Web Audio
• Phase Offsets With Web Audio WaveTables
• Using Fourier Transforms with the Web Audio API
• Music and Computers - A Theoretical and Historical Approach
• Making a Guitar Tuner with HTML5
• Polar Math Art
• Oscilloscope Music
• How to draw oscilloscope lines with math and WebGL
• Lissajous Curves
• All the Medalists: Men's 100-Meter Sprint (2:25) - Kevin Quealy and Graham Roberts @ The New York Times