After all final exams I am on vacation with some friends. Back on 29th of May. Commenting will be disabled until then.
Archive for May, 2006
SoundMixer.computeSpectrum() is a lot of fun and there are lots of examples on the web. This is something different because it is something like a demo with realtime effects based on spectrum analysis.
Everything you can see is derived from SoundMixer.computeSpectrum().
The song is very chaotic (generally I do not like listening to such “music”) but it was fun to create this experiment. The song fits into the visuals. I wanted to achieve some synaesthesia. I hope that it is a success and you see the music - without some hallucinogens.
The song is called “Happy Ending” by Saskrotch. I really like the ending of that small “demo”. The text is just there because I got bored. It looks much better with some text. Enjoy and wait for the happy ending!
Update:
Now there are two versions. It is all the same code but with different music.
The imageprocessing-lab yields fruits. What you can see here is automatic levelscorrection applied on a 160×120 image. The fps decrease a little bit because I have to calculate the histogram three times. Two times for the histogram images and one time for the levels filter. So there would be another speed boost if the histograms are not shown.
My webcam is doing the auto-levels correction already. This is shit, because it is hard to correct corrected levels. And you will not see a big difference. Maybe your webcam is not doing this and you will achieve the grateness of this filter.
After a lot of tests I have got my favorite image format now. It is fast and easy to create new filters. Basically the image consists of an array which holds a BitmapData for each channel. The BrightnessCorrection filter works for example like this:
- Create a look-up table for new brightness values. This is for every channel the same.
- Apply paletteMap to every channel of the image
Easy, huh? And fast. paletteMap is one of the fastest native functions. It is even faster to use BitmapData.paletteMap instead of BitmapData.threshold. The basic function to binarize a picture is done by applying paletteMap with a palette of 0 and 1. This is faster then using threshold!
One last thing. The histogram is way to slow in my eyes. I am still searching for a solution to speed this up. Currently I read the value of each pixel using getPixel. This makes width * height iterations. Then I tested BitmapData.threshold with the == operator. Of course only 256 (non native) iterations but totally 256 * width * height. It was very slow. Another test was using a combination of BitmapData.fillRect and BitmapData.compare. Also slower than reading every pixel.
Maybe another good solution? The comments function is working. I am waiting for your suggestions :-)
If you can not see any difference in the two pictures. Try holding your hand in front of the webcam. This will result in very dark input and you see the levels-correction working.
Update:
Compiled using Flex Builder 2.0 Beta 3 which Adobe released a few hours ago. Now there is a big performance boost in the whole ImageProcessing. I do not really know where it comes from. setPixel seems to be slower than in Beta 2 but since I do not use setPixel at all in the whole package everything is faster. I think that some native functions (also filters) work faster.
The example is doing the following:
- Webcam whith (some sort of) double framebuffer
- Convert BitmapData to Image class with grayscale conversion (using BT709 algorithm)
- Render original Image
- Calculate and draw(!) original histogram
- Apply automatic levels correction
- Apply sharpening
- Render filtered image
- Calculate and draw histogram of new image
This runs at ~20fps for me in the browser. Disabling both unneeded histograms increases fps in standalone player to ~50.
Just a short snippet of code to save a ByteArray into any file. I post this here because there is no good example on the web.
[as]//– your byte array you want to save
var bytes: ByteArray = new ByteArray();
//– set up correct url request using post in binary mode
var request:URLRequest = new URLRequest ( ‘http://pathto/save.php’ );
var loader: URLLoader = new URLLoader();
request.contentType = ‘application/octet-stream’;
request.method = URLRequestMethod.POST;
request.data = bytes;
loader.load( request );[/as]
And of course you need a PHP file like this:
[php]$fp = fopen( ‘file.txt’, ‘wb’ );
fwrite( $fp, $GLOBALS[ 'HTTP_RAW_POST_DATA' ] );
fclose( $fp );[/php]
My first attempt to create a Voxel (volume pixel) engine in ActionScript3.
Since everything became faster even this should be possible and it is. The voxel-engine has currently three degrees of freedom (six is what you would cal “real”). It runs not that fast but is still unoptimized.
The engine takes a HeightMap (any format, like raw/jpg/gif) and transforms it into a BitmapData. Every pixel of the HeightMap gives us a vector like like (0,getPixel(0,0),0). As you can see the y-coordinate (height) is represented by the heightmaps color at given (x,z) position.
Currently only the heightmap itself is interpolated using bilinear interpolation (for example to get correct results for getPixel(0.5,0.5) which is not possible without interpolation). The output on screen is still not interpolated. Textures are also missing but there is a lot of potential.
The best thing about heightmaps: You can draw on them. Now imagine you with a blaster shooting against a mountain which deforms in realtime! Get the idea? :-)
Update:
Just to show a newer version with bilinear interpolated colors and where everything looks a lot smoother. Sky is faked!
