Another computeSpectrum() Example

UPDATE (01-18-2009): Some of you may have noticed that the Flash SWF was missing if you were viewing this post via its permalink. It’s fixed now. Sorry ’bout my screw-up.

UPDATE #2 (08-23-2009): Just realized that the text file with the sample ActionScript class was called “BasicAnalysis.txt”. It should’ve been called “BasicAnalyzer.txt”, which you’d need to rename to “BasicAnalyzer.as”. The link has been updated below.

Most of my traffic comes from searches for Actionscript 3 spectrum analysis. Because of this, I decided to post an updated example that you can use to conquer your SoundMixer.computeSpectrum() woes. I realized that my original post had source code that wasn’t entirely transparent — and thus, probably not as useful as it could be.

This new example shows how you can draw a series of columns (using basic Graphics.drawRect() code) and how you can do something a little more interesting. I wanted to include both so that people learning from this code don’t get too confused.

Download the source: BasicAnalyzer.txt (you’ll want to rename the extension to .as).

Things you might gain from referencing this class:

  • A better understanding of what’s going on with the ByteArray that SoundMixer.computeSpectrum() writes to
  • A means for averaging the values in the ByteArray so that you don’t have to represent all 256 values of each stereo channel
  • A simple example for doing something a little more “interesting” with the float values in the ByteArray

The source is fully commented, so feel free to snag it for your own use.

You can either make this class your FLA’s document class if you want to try it out, or you can add it as a child of any DisplayObject. Though, there’s some positioning based on stage.stageHeight in there, so your mileage may vary. If you do make it your document class, the Flash movie you’re seeing is 560px by 400px.

Also if you’re interested, the music is “Venus Morning” off an album called “Talk Strange: A Beat Tape Inspired by Bjork” by Dert. Click on his name for the download. Highly recommended.

UPDATE #3 I created a ZIP file with the code and an FLA demonstrating how to use it. You can grab that package here: BasicAnalyzer.zip. It was created using Flash CS4, but should be able to be opened using Flash CS3.

  • gaien

    ouaaaaaaaa what is it the song ?
    i’m french your player is very good

  • http://www.mikecreighton.com Mike Creighton

    gaien, the song is listed at the bottom of the post: “Venus Morning” by Dert. You can download the album here .

  • gaien

    Ha thanks you very mutch siorry for my english is very low and poor.

    i dont see in the txt by writted you but thx thx thx ^^ what not inset a flash player in you flash spectrum ? for play the next track no is good idea no ?

  • erik

    I don’t see anything :(

  • http://officevsoffice.com erik

    this is great, thank you very much for the source.

    cheers

  • http://none eugemjj

    awesome

  • Al

    good job. Like the song and great example.

  • bob

    I’ve used FLEX 3.0 Pro and AS 3.0 on and off over the last year but I’ve been sick on and off also and not as involved as I’d like to have been.

    Can you give some simple explicit steps to what you mean by making your class a child of a stage object in Flash CS3?

    I have a horizontally animated oscilloscope animation that’s of sort of a random nature. What I’d like to do is take what your using for the vertical equalizer, mirror them across a horizontal center line, and use them as masks to show only that part of the oscilloscope animation that is relevant.

    Obviously the bars above and below the centerline I’m having an alpha fade so it’s not just a cut off of the underlying animation, but I cannot even get past the “packages cannot be nested” or importing. That’s what I mean by AS 3.0 involvement.

    I’ve been busy getting my health back and doing projects in AS 2.0

    Thanks – great stuff (the music too).

  • bob

    I’m doing a simple use of making the action script file the documents class file but getting this very odd error,

    intrinsic class flash.display.BitmapData

  • http://www.mikecreighton.com Mike Creighton

    @bob:

    Regarding some of the questions you have regarding “making your class a child of a stage object in Flash CS3″: the source code I attached to this blog post is just a Sprite — one of the core DisplayObject classes in ActionScript 3. I’d highly recommend getting acquainted with this new shift in thinking since you’re coming from an ActionScript 2 background. Adobe has a good intro article here:

    http://www.adobe.com/devnet/flash/quickstart/display_list_programming_as3/

    If you’re not familiar with this aspect of AS3 yet, then my guess is that your experience with Flex Builder 3 revolves more around MXML components, which is definitely different.

    If you want to try compiling this example in Flash CS3 (or CS4), you can follow these steps:

    1. Create a new FLA file (ActionScript 3.0) and save it somewhere on your hard drive.

    2. Grab an mp3 file from your music collection and put it in the same folder as your FLA. Rename the file to example.mp3.

    3. Download my source code and rename the file from BasicAnalysis.txt to BasicAnalyzer.as. Put that file in the same folder as the FLA you created. Don’t put it in a subdirectory. It’s needs to be right next to your FLA.

    4. Back to the FLA in Flash. Click on the first frame on the root timeline, and open up the Actions panel.

    5. Input the following code in the Actions panel:

    var myAnalyzer : BasicAnalyzer = new BasicAnalyzer();
    addChild(myAnalyzer);
    

    6. Test the movie (Command / Control + Enter) and the example should work.

    Now regarding the BitmapData error you’re getting — I really have no clue about that. The example source code doesn’t use the BitmapData class anywhere in it, so I don’t know why it’s trying to reference it.

  • http://www.babelville.com/ Rt

    Mike, I’ve been real busy with other things, but I wanted to get back to this. I’m familiar with the ActionScript 3.0 programming model in FLEX pretty well and have been involved in the GUMBO beta test. MXML is something I mastered when FLEX first came out.

    I do agree though, that I want to get this working in my Flash CS3 for Mac OS X 10.5.7 (I’ve not been able to afford as of yet the $899 to upgrade my Master Suite to CS4).

    Anyway, I’ve performed the actions above periodically once in a while and it’s always the same thing, I get this error for the CS3 created ActionScript 3.0 flash file, with BasicAnalysis.as in the same directory and an example.mp3 also in the same directory with the example.swf (I’ve tried different .fla names, doesn’t seem to make a difference)….this is the error,

    1 var myAnalyzer : BasicAnalyzer = new BasicAnalyzer();
    2 addChild(myAnalyzer);

    For Line 1 above (which obviously is not in the code itself) I get 2 errors from the BasicAnalysis.txt file,

    Error #1 Description:
    1046: Type was not found or was not a compile-time constant: BasicAnalyzer.

    Error #1 Source:
    var myAnalyzer : BasicAnalyzer = new BasicAnalyzer();

    Error #2 Description:
    1180: Call to a possibly undefined method BasicAnalyzer.

    Error #2 Source:
    var myAnalyzer : BasicAnalyzer = new BasicAnalyzer();

    I also downloaded just tonight a fresh copy of your BasicAnalyzer.txt which of course I renamed as BasicAnalyzer.as

    Thanks for any help.

  • http://www.mikecreighton.com Mike Creighton

    @Rt

    Are you sure the BasicAnalyzer.as file is in the same folder as the FLA you created? It doesn’t matter if you’re using Flash CS3 or Flash CS4.

  • http://www.babelville.com/ Rt

    Yes, it is in the same folder. Always has been. I’m using Flash CS3 on Mac OS X 10.5.7

    Not sure if that matters or not.

    I keep thinking that when a reply is published I’ll get a notification, Btw, that’s why there’s so much time between responses.

    I’ll check back more often. I love your example, but it still doesn’t work for me.

  • http://www.mikecreighton.com Mike Creighton

    @Rt

    I just created a ZIP file with an FLA, sample MP3, and the BasicAnalyzer.as file. It was created using Flash CS4, but I saved it as a Flash CS3 FLA so you should be able to open it.

    You can download it here: BasicAnalyzer.zip.

  • kinetik

    Excellent tutorial !!

    For firefox users who dont see the visuals:
    One thing I noticed is that if you have another tab open playing sound (eg youtube) computeSpectrum does not work correctly on a 2nd tab.

    Its annoying because computeSpectrum() is nicer to use than sound.extract()

  • http://www.yazitahtasi.tk babur saylan

    Dear Mike, i was searching for this topic. You helped me a lot… This is a great demo, very clear code.

    Thank you very much!.

  • Den

    Very nice spectrum analyzer.
    I have very little experience with flash. I’m wondering if it would be possible to use this analyzer with an embedded wmp object. So instead of identifying an mp3 to play, using something like Player.currentMedia so that it picks up the music from the wmp object. Is there a way to make this work?

    Thanks,

    Den

  • http://www.mikecreighton.com Mike Creighton

    Den, when you refer to an “embedded wmp object”, are you talking about a Windows Media Player object? Or are you talking about some sort of stream? If you’re referring to a Windows Media Player object, unfortunately Flash doesn’t have the capability to embed something like that within itself. Moreover, the SoundMixer.computeSpectrum() method only works on files like MP3s that are loaded at runtime; it does not work on Microphone input, nor does it work on any sort of streaming source (like media served over RTMP).

  • http://www.activecommunity.com/ Robert

    Anybody have any good example code for Standing Wave 3 ???

    Standing Wave 2 is well documented, but the spin-off project that uses Adobe Alchemy is not well documented.

    I’m looking to accomplish some of what I’ve been trying to set out to do for a long time using the SW3 codebase as it is said to be far more efficient.

    I want to program it in AIR 2.5

    As I just got a Notification Sent to me of New Posts here, I wanted to ask the Resident Expert who Mike Creighton if he is aware of any projects that might provide more examples; as of course learning by example is faster than confusion.

    Any help would be appreciated. My plans are long overdue because of the difficult economy.

    Anyone else out there a Developer running into people who ask you to do something and then say “Oh I can get anybody to do that” yet it never gets done. I don’t know about others but it’s extremely hard to find contracting work here in Michigan.

    -r

  • http://www.mikecreighton.com Mike Creighton

    Hey Robert, unfortunately I don’t really keep up with the audio libraries and tools that are being developed for AS3 since I don’t actually do a whole lot of work with audio in my personal or professional work. Taking a cursory look at Standing Wave 3, it looks like it’s pretty well-documented IMO:

    Developer Guide

    AS Docs

    Granted, this comment is a little off-topic, since it really has nothing to do with FFT or spectrum analysis. You might want to try posting your question to http://stackoverflow.com/.

  • http://www.activecommunity.com/ Robert

    I’ve gone through those pages you mentioned Mike. That’s one introductory page, and one class spec UI.

    SW2 had an entire document devoted to discussing the use of the classes. That’s what I’m looking for.

    So “Developer Guide” is not really an appropriate term even though that’s the Title of that page.

    But thanks for the answer; appreciate it.

    -r

  • Ольга Титова

    Each bar have a fixed value called VALUES_PER_SEGMENT. Visually the signals on LF is “compressed” in width, while HF signals is “stretched”. It would be nice to create close to logarithmic X scale. How can I assign smaller VALUES_PER_SEGMENT of left bars and larger values of right bars? Sorry for my English.