3d Sound Example ❲Simple❳
// Connect: oscillator → panner → destination (speakers/headphones) oscillator.connect(panner); panner.connect(audioCtx.destination);
// Create a panner node for 3D positioning const panner = audioCtx.createPanner(); panner.panningModel = 'HRTF'; // most realistic 3D panner.distanceModel = 'inverse'; panner.refDistance = 1; panner.maxDistance = 10; panner.rolloffFactor = 1; 3d sound example
<!DOCTYPE html> <html> <head> <title>3D Sound Example – Web Audio API</title> </head> <body> <button id="startBtn">🔊 Start 3D Sound</button> <p>🎧 <strong>Wear headphones</strong> – sound will rotate around you.</p> <script> const startBtn = document.getElementById('startBtn'); panner.panningModel = 'HRTF'
startBtn.addEventListener('click', () => window.webkitAudioContext; const audioCtx = new AudioContext(); panner.refDistance = 1