Web Audio. Real time Guitar EQ

0 favourites
  • 11 posts
From the Asset Store
A collection of rhythmic guitar loops including 20 musical sketches, containing acoustic, bass and heavy guitars.
  • Is there any way to implement an equalizer reading real time playing?

    So, just imagine I am playing a guitar ( advanced audio supported and request microphone ok routed to "Guitar" Tag.

    I have only one signal..... but what I need to EQ my signal is duplicate it as many times as bandwidths I want to use and at the end mix all of them in a final destination.

    How to do that? is there anyone who could write a very basic example?..... I can imagine how to do that with pre-recorded and loaded sounds because I can play the same source x times (and manipulate each of these original sources while filtering independently at the same time...but how to do this with real time sources?

    Thanks thanks!!!

  • I hope this is what you're looking for (or at least close to)?

    live demo

    Some important notes: I can't work with the microphone (a system higher than XP is needed for that), so instead some music is used. I care more for the eq'ing - it uses just one signal tagged "musik", therefor this should work as is for live input as well.

    Hit the play button to start/pause/resume the music. It may take a few seconds before music starts. Then just use the pseudo faders for eq'ing. In this demo it's six bands, but you are not limited on this. You can have as many bands as you like, with whatever frequencies you need.

    To not bloat this to a full app, there are only fixed frequencies and bandwidths. They are from left to right per fader: 100 Hz, 300 Hz, 600 Hz, 1.2 kHz, 2.4 kHz and 4.8 kHz, with a narrow bandwidth each.

    Range of the faders is +20 dB (top) to -20 dB (bottom). I lowered the music volume by 20 db to prevent to much clipping, when all bands are at max.

    IMPORTANT: You need web audio ("advanced audio support") and webGL. I only tested on Chrome with WinXP, and that's working like a charm.

  • hello,

    nice to see a lot of examples with audio.

    it it possible to get the capx?

  • tulamide

    Wow! Awesome! I'd really like to see the capx too! Could you share it with the rest of us? <img src="smileys/smiley9.gif" border="0" align="middle" />

  • Hi tulamide

    Indeed, if you could share the capx or explain a bit how you approached the problem, that would be grand!

    Thanks in advance,


  • Sure, a capx is no problem. I just wanted to avoid sharing unwanted solutions.

    It's pretty simple, btw. The whole demo is just 8 events. EQ is just a form of filtering, but instead of the standard filters like low pass, high pass or band pass, you need a filter that focuses on a smaller range of frequencies. Web audio offers a filter node which you can apply to the audio stream as often as you like.

    Within the filter type list you'll find a peaking filter, boosting or attenuating certain frequencies - exactly what is needed for eq'ing.

    You set the peaking filter to a center frequency and a width. If you add this filter a couple of times you effectively build an EQ.

    With "set effect parameter" you can change any value like frequency, bandwidth (the "q"-parameter) and gain during runtime.

    And that's all^^

    Dropbox link: audio.capx

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Oh man, tulamide thank you so much for sharing!!! This is a very elegant solution, I couldn't thought it even in a decade <img src="smileys/smiley9.gif" border="0" align="middle" />

    Thank you again sir <img src="smileys/smiley10.gif" border="0" align="middle" /> <img src="smileys/smiley10.gif" border="0" align="middle" /> <img src="smileys/smiley10.gif" border="0" align="middle" /> <img src="smileys/smiley10.gif" border="0" align="middle" /> <img src="smileys/smiley10.gif" border="0" align="middle" />

    <img src="smileys/smiley4.gif" border="0" align="middle" />


  • tulamide

    This is really awesome!!! Thanks for sharing

  • makotto eli0s

    You're welcome! <img src="smileys/smiley1.gif" border="0" align="middle" />

  • thanks for sharing!

  • > Great job


    > can we have a cap?

    > or link to plugin that helps

    > please...

    > (I try to make equa. clouds in my game)

    > same question scirra.com/forum/equalizer-visualizer_topic72605.htmlHere's my example. Search function could have helped <img src="smileys/smiley2.gif" border="0" align="middle" />


    Thanks a lot its even better that i was searching =)

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)