Positional a-frame sound analysis

Question

I want to have positonal audio using Aframe sound component. But I want to also be able to analyse said audio with audioanalyser node. Audio analyser requires source specified but it seems it only works with <audio> element and not internal sound component of Aframe. Anyone knows how to reference component.sound as source for audio analyser?

• https://www.npmjs.com/package/aframe-audioanalyser-component
• https://aframe.io/docs/1.0.0/components/sound.html#sidebar

<a-sound id="audio" src="src: url(someAudio.ogg)" autoplay="true" position="0 -0.3 -3"></a-sound>
<a-entity  gltf-model="#somemodel" position="0 -0.3 -3"
audioanalyser="src: #audio"
audioanalyser-volume-scale="multiplier: .048">
</a-entity>

Answer 1

In the meantime I have figured out that you can start the playback of your source audio component but set volume really low so it did not interfere with your positional sound component audio playing at the same time. However I guess this is NOT very efficient or effective so I am still looking for better answer.

document.getElementById("audio_1").volume = 0.01;
document.getElementById("audio_1").play();

Answer 2

I managed to fix this. When you use the 'sound' component to attach audio to an entity, you're actually using the audio entity THREE.Audio( listener ). The solution is to retrieve the 'sound' child attached to the entity using getObject3D('sound').children[0].

So the initContext function should look like this:

  initContext: function () {
    const data = this.data;
    console.log(this.el)
    console.log(this.el.getObject3D('sound'))
    const sound = this.el.getObject3D('sound').children[0]
    const threeAnalyser = new THREE.AudioAnalyser(sound, data.fftSize)
    const analyser = (this.analyser = threeAnalyser.analyser)
    analyser.smoothingTimeConstant = data.smoothingTimeConstant;

    this.context = this.el.sceneEl.audioListener.context
    this.levels = new Uint8Array(analyser.frequencyBinCount);
    this.waveform = new Uint8Array(analyser.fftSize);

  },

Note that this makes "src" redundant.