THREE.PositionalAudio and HTMLAudioElement

Hi everyone!

What is different between THREE.PositionalAudio and HTMLAudioElement?

I am working on a web app which has 3D model. Users are able to click on model and play clickSound.

What’s different between THREE.PositionalAudio:

let soundListener = new THREE.AudioListener();
audioLoader = new THREE.AudioLoader();
let clickSound = new THREE.PositionalAudio(soundListener);
audioLoader.load( 'assets/audio/click.mp3', function ( buffer ) {

and HTMLAudioElement:

let clickSound = new Audio('assets/audio/click.mp3'); => {});


THREE.Audio and THREE.PositionalAudio are based on the Web Audio API which has significant advantages over ordinary HTML 5 audio elements. I suggest you google this topic since there are many existing resources with comparison.

In general, for UI sound effects you want to use THREE.Audio (since spatialization is not required).


Is there any way to make a THREE.PositionalAudio object skip to a given play position (i.e. 5 seconds in.)

Trying to do this:

console.log(music) // Three.PositionalAudio object
music.context.currentTime = 5

Throws an error saying that currentTime is read-only.

Ah, found the solution here:
I’ve used the offset property that THREE.PositionalAudio inherits from the THREE.Audio prototype.

console.log(music); // Three.PositionalAudio object
music.offset = 5; // Starts playing 5 seconds in

1 Like