Accessing audio waveform of patch output in rnbo web export

Yash's icon

Yash

7月 25 2024 | 5:23 午後

Hi,

I'm quite new to web dev and can't quite get my head wrapped around using web audio api's.

I have exported my rnbo patch to js and then hosted it on my website successfully.

Now I'm trying to have a real-time visualization with p5.js of the output signal but adding an analyser node to p5.fft's input does not seem to work as p5 runs on its audio context.

I tried many different methods to do the same without any luck. Can someone point me in the direction?

My main goal is to be able to visualize the audio out of the patch on the web.

Florian Demmer's icon

Florian Demmer

7月 26 2024 | 7:44 午前

As you pointed out you need to use the same AudioContext.

From a quick glimpse at the docs it seems like p5 is not flexible wrt using an already existing AudioContext and always uses and internal one. But luckily RNBO is more flexible, have you tried creating the p5 parts first and the getting the context using getAudioContext and passing the retrieved context to createDevice?

Yash's icon

Yash

7月 27 2024 | 2:45 午後

Perfect that worked like a charm!

Digging into the implementation of what you suggested, I found this blogpost.

For any one who wants to achieve the same.

Florian Demmer's icon

Florian Demmer

7月 31 2024 | 4:00 午後

Awesome. Glad to hear this worked.