Flash 9 Sound Spectrum!

If you watched my last tutorial you know how much of pain it was to read audio data in Flash. The old “analyze in AE” method is now a thing of the past. The new SoundMixer.computeSpectrum() method reads audio data at runtime allowing you to create audio-driven animations. Click on the image below to see my first experiment. This only took 10 minutes! Get ready to see some crazy stuff from the Flash community. Source is below as well.

Flash Player 9 required!

[as]var s:Sound = new Sound();
var sc:SoundChannel;
var ba:ByteArray = new ByteArray();
var array:Array;

s.load(new URLRequest(“mix.mp3″));
sc = s.play(0,1000);

this.addEventListener(Event.ENTER_FRAME, spectrum);

var a:Number = 0;

function spectrum(event:Event)
{
a = 0;
graphics.clear();
SoundMixer.computeSpectrum(ba,true,0);
for(var i=0; i < 256; i=i+8)
{
a = ba.readFloat();
var num:Number = a*360;
graphics.lineStyle(num/15,0×0066FF|(num << 8));
graphics.drawCircle(stage.stageWidth/2,stage.stageHeight/2,i);
}

} [/as]

Lee

Comments

  1. June 28th, 2006 | 11:15 am

    very cool!!
    I can’t wait to play with this. How do you compile/publish this script?
    Thanks.
    F

  2. Otto
    June 28th, 2006 | 11:22 am

    Cool, it came out today and you are already working with it at an advanced level in my eyes. you think can you make a tutorial on GotoAndLearn About this?

    -Otto

  3. June 28th, 2006 | 11:45 am

    Superb! Nice choice of music too…

  4. James Lyon
    June 28th, 2006 | 12:05 pm

    Yeah, very nice mix.

    The new API rocks!!!

  5. Peter
    June 28th, 2006 | 12:47 pm

    I can’t recreate your example. Did you build this using Flex or Flash9 AS3 Preview?

  6. June 28th, 2006 | 1:24 pm

    that is much easier. can you do an update tut on it. I think I got how it works but just in case some of us are missing something witht the AS3 sintax

  7. June 28th, 2006 | 2:48 pm

    Yes I am using the Flash 9 preview to compile this. What errors are you getting?

  8. June 28th, 2006 | 4:56 pm

    I got an error about sandbox security, somethin’ or other. I think it’s connected to the fact that the actionscript file is pointing to a file that is a relative path:

    6. s.load(new URLRequest(“mix.mp3″));

    I was able to input the actionscript into my alpha version of Flash 9 and change the url to an mp3 on my computer and it worked great.

    Cool stuff man!

  9. Otto
    June 28th, 2006 | 6:47 pm

    oooh! oooh! I have an idea! how about you do the same thing you did on GotoAndLearn, but instead of using after effects, use this. I will love to do something like that ( I dont undrerstand a single thing about as3 syntax).

  10. June 28th, 2006 | 7:43 pm

    This will be the greatest upgrade to Flash, and the way Adobe is moving forward with the Flash API and Flex is awe inspiring.

  11. June 28th, 2006 | 11:59 pm

    Still you cannot use the soundMixer for dynamically created sound objects, right? I mean is it possible to have this effect on an mp3 player where the user points and listens to any mp3 off the net?

  12. Jake Hawkes
    June 29th, 2006 | 3:43 pm

    I am not sure I am as stoked about the release of the new player. It seems that there are many demands on viewers to date and I am concerned that flash 9 is going to have a slower adoption rate unless some really big sites adopt it right away with detection and installation. I have released a few videos that require flash 8 and I have witnessed many email from people hearing only my music. I have sneaker detection and installation but on some machines it requres a reboot…so I think this is really starting to be a bit of a problem.

  13. June 30th, 2006 | 2:12 am

    Lee, you are great!

    With AS3 we dont need to parse sound Spectrum. computeSpectrum works really perfect. There is a version that i did with flash 8 in my website with your tut; http://www.ozguraltay.com //coming soon :) Now i can update it…

    @Jake Hawkes; you are right about the flash detection. I am using the Macromedia’s flash detection kit
    Windows machines dont need reboot, just opening a new browser should be fine. But as you say, to push people to DL the latest version of flash sometimes is a nightmare…

  14. June 30th, 2006 | 2:38 am

    [...] lerede begyndt at dukke en del eksperimenter med den rundt omkring, blandt andre disse to: Flash 9 Sound Spectrum Flash 9 Sound Spectrum – Part 2 Udfra koden at dømme ser det jo super nemt ud, og det åbn [...]

  15. jippo
    July 3rd, 2006 | 6:16 am

    Very very nice. I’m looking forward to having a play.

    Was hoping to make some sort of game which uses beat detection, then you have to press certain keys, but it doesnt *look* like you can analyse sound before you play it, unless i’m missing something…

  16. jippo
    July 3rd, 2006 | 6:18 am

    Also Lee, am I right in thinking that your example is only using the first 1/8th of the spectrum?

    trying to get my head around all this ByteArray stuff!

  17. hlgao
    July 5th, 2006 | 12:28 am

    Very good ,I have successed to run it !

  18. KC
    July 24th, 2006 | 2:16 am

    VERY COOL !

    Thanks Lee.

  19. July 26th, 2006 | 1:53 am

    hi

    Very good example. but found prob. with FLASH 9 .i m useing the same above code but i got problem when loding and playing the mp3 songs. The last 10 to 15% portion of mp3 file is not getting loaded into memory/buffer so that the song is not playing completly .Song is stop before the end length(duration) of mp3. As a result Waveform is not generated completly

    if any idea to solve this prob. pls help me. its very urgent to m

  20. August 5th, 2006 | 8:00 am

    Cool man, I’ve constructed a xml playlist around the as3code, it works great, now I have a jukebox with vis, Thanks Lee.

    Greets, Daniel, The Netherlands

  21. lx
    August 11th, 2006 | 8:52 am

    that’s so cool!
    I like this
    It’s won’t be real in as2
    I can’t wait to make one

  22. John
    August 13th, 2006 | 11:09 pm

    Where do we get this so called as3 update cause im not finding it?

  23. August 14th, 2006 | 8:06 am

    I am going to try it. Flash 8 is too much FUN!!!!!!!!!

    I HAVE A PROBLEM THO. I built an MP3 Player and it runs perfect on my machine, as soon as I upload to the web it doesn’t produce any sound, I tried it on a couple of browsers but no luck. Any advice??????
    THanks, I like this

  24. Sammi
    August 16th, 2006 | 3:17 am

    I am to having this problem were the player does not play the sound completetly. In my case it actually does play until end if the sound was not interrupted while playing. If I do a pause/resume while playing then the sound does not finish and I do not get a SOUND_COMPLETE event from the channel and channel.position never reaches snd.length.

    Any ideas?

  25. Josh
    August 18th, 2006 | 2:16 pm

    When I put this code into Flash 9 Public Alpha, I get an error message that says “Failure to initialize Java Runtime Environment, you may need to reinstall Flash.”

    O_o what’s that all about?

  26. August 25th, 2006 | 11:00 am

    Get an error when I try the code. Down loaded the flash 9 alpha. Here is the error.
    namespace internal.
    var sc:SoundChannel;
    ReferenceError: Error #1065: Variable Timeline0_82462e9c65e6af488b1f2418cf2ceca is not defined.

  27. LEE
    August 26th, 2006 | 3:03 pm

    I think the Flash Player update killed this…

  28. Thomas
    October 2nd, 2006 | 3:33 am

    I did also get this error:

    When I put this code into Flash 9 Public Alpha, I get an error message that says “Failure to initialize Java Runtime Environment, you may need to reinstall Flash.”

    WHY!!!

  29. Jordan
    October 20th, 2006 | 3:59 pm

    Flash 9 Public Alpha is incompatible with Intel Macs, which is likely why you got “Failure to initialize Java Runtime Environment, you may need to reinstall Flash.”

    It only runs on a 10.4 Mac as far as I know.

  30. November 13th, 2006 | 11:41 am

    I’m running on OS 10.4.8 and I see the “Failure to initialize Java Runtime Environment…” I’m on an Intel Macbook Pro, so maybe that has something to do with it.

  31. November 18th, 2006 | 9:05 am

    great !
    I made this 4 years ago using flashamp, but know that you can do it realtime is awsome

    http://www.r-a-n-d-o-m.com/combustion.html (looks a bit the same)

  32. Dan
    January 6th, 2007 | 9:18 am

    I was wondering if we could do the same for sound captured from the Mic. Couldn’t find a way yet. Anyone?

  33. Espen Christensen
    April 18th, 2007 | 1:46 pm

    Yeah, im wondering the same. I want to make an audio visualizer that captures audio from my Audio Input, and visualizes it live. Is this possible? If, does anyone know of any examples, sources, tutorials?

  34. May 14th, 2007 | 12:16 pm
  35. July 20th, 2007 | 6:12 am

    make sure u use action script 3 and compile using flash player 9. Note that the variable sc is not necessarily needed. the variable a contains the peak!

  36. September 14th, 2007 | 10:41 pm

    Yo for all us noobs out there I hacked it for flash compiling

    package {
    import flash.display.Sprite;
    import flash.events.*;
    import flash.net.URLRequest;
    import flash.media.*;
    import flash.utils.*;

    public class Visualizer extends Sprite {

    private var s:Sound = new Sound();
    private var sc:SoundChannel = new SoundChannel();
    private var ba:ByteArray = new ByteArray();
    private var array:Array;
    public var a:Number = 0;

    public function Visualizer() {
    s.load(new URLRequest(“Marie Antoinette Soundtrack – 05 – Jynweythek Ylow.mp3″));
    sc = s.play(0,1000);
    this.addEventListener(Event.ENTER_FRAME, spectrum);
    }

    function spectrum(event:Event):void {
    a = 0;
    graphics.clear();
    SoundMixer.computeSpectrum(ba,true,0);
    for(var i=0; i

  37. September 14th, 2007 | 10:41 pm

    for(var i=0; i

  38. Sam
    October 11th, 2007 | 8:45 am

    Chris – is this a hack for actionscript 2.0? Looks very useful, but it seems to be cut short….. Or does the code just continue as in the initial example…?

    Thanks in advance

  39. November 11th, 2007 | 7:37 pm
  40. Bahc
    December 4th, 2007 | 7:30 pm

    Brilliant!

    any ideas how to use that on a video stream?
    any way of capturing the soundchannel on a video, or is there any alternative.

    thx

  41. Iain
    December 10th, 2007 | 3:49 am

    Lee, will there ever be a change to the behaviour of Flash Player, so that computeSpectrum and soundmixer work on a per player instance basis? At the moment, the computespectrum function throws errors if you have youtube (for example) open in another tab. This post explains the bug/feature:

    http://www.soledadpenades.com/2007/09/24/security-sandbox-violation-how-come/

  42. Joe
    April 16th, 2008 | 7:59 am

    Do you know why this demo doesnt display in Firefox? I even opened the swf directly in the browser, and nothing!

  43. Joe
    April 16th, 2008 | 8:00 am

    Nevermind. I just read the post above. That was my problem.

  44. April 23rd, 2008 | 10:40 pm

    Thanks! Ive been looking for something like this.

    http://www.alyse-designs.com/

    I made a few adjustments, You can spend hours playing with this.

  45. April 30th, 2008 | 9:15 am

    [...] [?????] AS3????????????????? – flashrod The Flash Blog » Flash 9 Sound Spectrum! [...]

  46. May 5th, 2008 | 3:28 pm

    [...] AS3?SoundMixer.computeSpectrum()?????????????????????????????????? [...]

  47. May 9th, 2008 | 8:50 am

    [...] Found this great little example on manipulating sound data with Flash 9. This makes it a whole lot easier to manipulate sound in Flash. I see some very interesting projects being created with this in future. http://theflashblog.com/?p=181# [...]

  48. Spider
    August 6th, 2008 | 3:21 am

    I have a question: Howa I can show whole spectrum of mp3 file. It could not be showing dinamicly but when I load mp3 file it shows me spectrum of whole file. How I can do that.

    P.S This same effect like I need to do is when we drag mp3 file onto flash form and it showns in library with full spectrum.

  49. August 18th, 2008 | 8:45 pm

    new to AS3…

    having trouble, it says “label must be simple identifier”
    in the line graphic.lineStyle

    help anyone.

  50. monali
    September 26th, 2008 | 2:56 am

    This is not related to this site but i wanna to ask a query. I am designing a new bloging site. The design which i have made is too simple and i m not satisfied with it. Will u plz suggest the goo design for that.

  51. noj
    October 10th, 2008 | 1:07 am

    flash player 10 lets you access the soundTransform of the microphone. with dynamic sound Generation API, i can see its gona get really really crazy

  52. simone
    October 13th, 2008 | 2:39 am

    Hi!Nice work really!
    There is a possibility to associate jpg images, ui would like to build a soundspectrum who works with images taken from flickr, is it possible?
    Thanks in advance ;)

  53. simone
    October 13th, 2008 | 4:20 am

    i try to explain me better. I would like to associate pictures and music and create an interection amongst them.

  54. March 29th, 2009 | 5:41 am
  55. April 21st, 2009 | 9:09 pm

    [...] SoundMixer?????????????????? http://theflashblog.com/?p=181# [...]

  56. June 7th, 2009 | 6:19 am

    [...] soundbasic play stop Simple playback sound load Komplet Sound-gennemgang fra republicofcode Simple playback med volumeslider Nem tutorial med playback og volume interessant script med spectrum [...]

  57. June 21st, 2009 | 4:59 am

    [...] ??????????????????????????????? [...]

  58. July 1st, 2009 | 2:51 pm

    stumbled on this trying to work though an issue I’m having. posted the code here for easier copy and paste.

  59. September 18th, 2009 | 12:18 am

    it doesn’t work if a youtube player is in another tab

  60. October 24th, 2009 | 6:33 am

    [...] ?????? ByteArray http://livedocs.adobe.com/flex/3_jp/langref/flash/utils/ByteArray.html Flash 9 Sound Spectrum! [...]

  61. January 15th, 2010 | 12:02 pm

    Wow… nice

  62. Roberto
    January 28th, 2010 | 5:52 am

    Hi there,
    Is it possible to use 2 different SoundMixer.computeSpectrum() analysis with 2 different sounds (.mp3)?

    Thanks

Leave a reply