Flash/Air Laser Graffiti

// February 7th, 2008 // Experiments, Webcam

After seeing this amazing video on youtube of laser graffiti (where the software is made in .Net),
I realized that this can also be done in flash. So I made a small laser graffiti Air application.

See here the result:[kml_flashembed movie="http://www.neuroproductions.be/uploads/blog/examples/laser/film.swf" height="400" width="440" /]

I would release the source, but it’s not clean and I made it for my screen, projector, camera and webcam settings. But basicly it works like this:

Create a bitmapData object of your video object which displays the camera. With a ColorMatrixFilter you remove all but the red color values. And finally, with the getColorBoundsRect method you get the rectangle object of the red values (= my red laser pointer). the x and y position is the position of the pointer, there you start drawing. Simple as that. :)

bmd.draw(video)

var matrix:Array = new Array();
matrix = matrix.concat([1.5,0 , 0, 0, 0]);
matrix = matrix.concat([0,0, 0, 0, 0]);
matrix = matrix.concat([0, 0, 0, 0, 0]);
matrix = matrix.concat([0, 0, 0, 0, 0]);

redFilter = new ColorMatrixFilter(matrix);
bmd.applyFilter(bmd,bmd.rect,new Point(0,0),redFilter)
var maskColor:uint = 0xFF0000;
var color:uint = 0xFF0000;
var redBounds:Rectangle = bmd.getColorBoundsRect(maskColor, color, true);

trace (redBounds.x)
trace (redBounds.y)

9 Responses to “Flash/Air Laser Graffiti”

  1. Rogério Miranda says:

    Please post de .fla arquive for studenty.
    ;)

  2. webreake says:

    I dont think its neccesary to release source code or .fla since you are already showing the important part of the code :)
    i did the same but using threshold to isolate the red color, but im still trying to get a gama of colors (darker red, brigther red, etc..)

    You think using your color matrix would be posible ?

  3. Kris says:

    Hallo webreake,
    You can try it. But I think it only works in a controlled environment (code for the exact sircumstance in which you want to do it)

  4. webreake says:

    i was thinking how to do it until i remember that blur is a way to average color zones so now i just have to loop for 4 different colors to detect red under different light sources.
    thanks Kris.

  5. Mike says:

    Hello!
    I am tring to do this same thing for a current school project, only difference is im trying to figure it out in AS3… I cant seem to find anything out there on it. any help?
    Thank you!
    -Mike

  6. Mike says:

    Hello again!
    I have been working to figure this out and every time i try to tet my file i get an error : 2005

    package{
    import flash.display.Sprite;
    import flash.media.Camera;
    import flash.media.Video;
    import flash.display.Bitmap;
    import flash.display.BitmapData;
    import flash.geom.Rectangle;
    import flash.geom.Point;
    import flash.filters.ColorMatrixFilter;

    public class test extends Sprite {
    private var cam:Camera;
    private var video:Video;

    public function test() {

    var bmd:BitmapData = new BitmapData(640, 480);
    bmd.draw(video)

    var matrix:Array = new Array();
    matrix = matrix.concat([1.5,0 , 0, 0, 0]);
    matrix = matrix.concat([0,0, 0, 0, 0]);
    matrix = matrix.concat([0, 0, 0, 0, 0]);
    matrix = matrix.concat([0, 0, 0, 0, 0]);

    var redFilter = new ColorMatrixFilter(matrix);
    bmd.applyFilter(bmd,bmd.rect,new Point(0,0),redFilter)
    var maskColor:uint = 0xFF0000;
    var color:uint = 0xFF0000;
    var redBounds:Rectangle = bmd.getColorBoundsRect(maskColor, color, true);

    trace (redBounds.x)
    trace (redBounds.y)

    }
    }
    }

    please helpppp!
    thank you!

    -Mike

  7. Ulfilas says:

    I’m interested in digital graffiti and recently came across a few interesting ideas. Using a wiimote and an infrared source you can make an interactive whiteboard, or graffiti wall – look at the youtube videos of jonny lee chung http://www.youtube.com/watch?v=5s5EvhHy7eQ this is cool and I’ve seen some things like yrwall.com and friispray.co.uk that use flash based tools to draw on screen with it. I am looking to find someone that might be interested in making a flash app that works with this system – there is a library of actionscript 3 graffit things here http://www.nocircleno.com/graffiti/ – maybe this could be adapted – let me know !!

  8. [...] LASERS! and other things Flash and Lasers! [...]

  9. Jonathon says:

    Mike did you get your problem fixed? I actually just got it working and was going to post the answer but noticed this is an old thread. Let me know. Thanks.