Bitmap effects....

1 view
Skip to first unread message

Maikel Sibbald

unread,
Jul 22, 2008, 1:34:38 PM7/22/08
to away3d.dev
Can anybody point me out how to create a simular effect in Away3D.
Because I dont wanna do this in Papervision hahaha

Hers's the link

http://blog.zupko.info/?p=76

I dont need the exact code...just where to start

Rob Bateman

unread,
Jul 22, 2008, 6:36:51 PM7/22/08
to away3...@googlegroups.com
Hey Maikel

this is a pretty easy effect to create in Away3d. you're best starting off with a bitmap session to your view so that you can grab a bitmap image of the rendered view on every frame like so:

view = new View3D({session:new BitmapRenderSession(1), clip:new RectangleClipping(-400, -300, 400, 300)});

var mybitmapData:BitmapData = view.getBitmapData();

once you've got the bitmapData of a view, you can apply all sorts of effects to it. The one you see in Andy's demo is a simple offset fader - it copies the contents of the bitmap into another bitmap (the viewed one) and then offsets and dims all the content in the viewed bitmap. simething like this:

var viewbitmap:BItmapData = mybitmapData.clone();

viewbitmap.draw(mybitmapData);

viewbitmap.draw(viewbitmap, new Matrix(1,0,0,1,0,5), new ColorTransform(1, 1, 1, 0.9));

stick the above code in your enterframe and you should see a very similar effect :)


if you want to see an example using the bitmapsession in a simialr manner - have a look at the way the background was created in the MarbleAtom demo here:

http://www.infiniteturtles.co.uk/blog/away3d-marble-atom

hth!

Rob
--
Rob Bateman
Flash Development & Consultancy

rob.b...@gmail.com
www.infiniteturtles.co.uk
www.away3d.com

Maikel Sibbald

unread,
Jul 23, 2008, 11:28:32 AM7/23/08
to away3d.dev
Thanks Rob,

I knew it would be easy in away3d,hahah. But the thing is I can't find
a these exmaples very easy. I want you to know, I'm working on a
resource site, which will include away3d examples...

Let me try to get this working. Thanks again

On 22 jul, 16:36, "Rob Bateman" <rob.bate...@gmail.com> wrote:
> Hey Maikel
>
> this is a pretty easy effect to create in Away3d. you're best starting off
> with a bitmap session to your view so that you can grab a bitmap image of
> the rendered view on every frame like so:
>
> view = new View3D({session:new BitmapRenderSession(1), clip:new
> RectangleClipping(-400, -300, 400, 300)});
>
> var mybitmapData:BitmapData = view.getBitmapData();
>
> once you've got the bitmapData of a view, you can apply all sorts of effects
> to it. The one you see in Andy's demo is a simple offset fader - it copies
> the contents of the bitmap into another bitmap (the viewed one) and then
> offsets and dims all the content in the viewed bitmap. simething like this:
>
> var viewbitmap:BItmapData = mybitmapData.clone();
>
> viewbitmap.draw(mybitmapData);
>
> viewbitmap.draw(viewbitmap, new Matrix(1,0,0,1,0,5), new ColorTransform(1,
> 1, 1, 0.9));
>
> stick the above code in your enterframe and you should see a very similar
> effect :)
>
> if you want to see an example using the bitmapsession in a simialr manner -
> have a look at the way the background was created in the MarbleAtom demo
> here:
>
> http://www.infiniteturtles.co.uk/blog/away3d-marble-atom
>
> hth!
>
> Rob
>
> On Tue, Jul 22, 2008 at 6:34 PM, Maikel Sibbald <i...@flexcoders.nl> wrote:
>
> > Can anybody point me out how to create a simular effect in Away3D.
> > Because I dont wanna do this in Papervision hahaha
>
> > Hers's the link
>
> >http://blog.zupko.info/?p=76
>
> > I dont need the exact code...just where to start
>
> --
> Rob Bateman
> Flash Development & Consultancy
>
> rob.bate...@gmail.comwww.infiniteturtles.co.ukwww.away3d.com

Maikel Sibbald

unread,
Jul 23, 2008, 12:22:28 PM7/23/08
to away3d.dev
Well I've tried it...

First of all it did nothing for me, But I changed the following:


var mybitmapData:BitmapData = view.getBitmapData();
var viewbitmap:BItmapData = mybitmapData.clone();
viewbitmap.draw(mybitmapData);

Instead of:
viewbitmap.draw(viewbitmap, new Matrix(1,0,0,1,0,5), new
ColorTransform(1,
1, 1, 0.9));

I did:
mybitmapData.draw(viewbitmap, new Matrix(1,0,0,1,0,5), new
ColorTransform(1,
1, 1, 0.9));

Now I see some kind of "ghost" image.... not really the "smoke". Not
exactly the what I wanted, but it's pushing me in the right direction
i think.

please let me know if I am missing something

Thanks...




On 22 jul, 16:36, "Rob Bateman" <rob.bate...@gmail.com> wrote:
> Hey Maikel
>
> this is a pretty easy effect to create in Away3d. you're best starting off
> with a bitmap session to your view so that you can grab a bitmap image of
> the rendered view on every frame like so:
>
> view = new View3D({session:new BitmapRenderSession(1), clip:new
> RectangleClipping(-400, -300, 400, 300)});
>
> var mybitmapData:BitmapData = view.getBitmapData();
>
> once you've got the bitmapData of a view, you can apply all sorts of effects
> to it. The one you see in Andy's demo is a simple offset fader - it copies
> the contents of the bitmap into another bitmap (the viewed one) and then
> offsets and dims all the content in the viewed bitmap. simething like this:
>
> var viewbitmap:BItmapData = mybitmapData.clone();
>
> viewbitmap.draw(mybitmapData);
>
> viewbitmap.draw(viewbitmap, new Matrix(1,0,0,1,0,5), new ColorTransform(1,
> 1, 1, 0.9));
>
> stick the above code in your enterframe and you should see a very similar
> effect :)
>
> if you want to see an example using the bitmapsession in a simialr manner -
> have a look at the way the background was created in the MarbleAtom demo
> here:
>
> http://www.infiniteturtles.co.uk/blog/away3d-marble-atom
>
> hth!
>
> Rob
>
> On Tue, Jul 22, 2008 at 6:34 PM, Maikel Sibbald <i...@flexcoders.nl> wrote:
>
> > Can anybody point me out how to create a simular effect in Away3D.
> > Because I dont wanna do this in Papervision hahaha
>
> > Hers's the link
>
> >http://blog.zupko.info/?p=76
>
> > I dont need the exact code...just where to start
>
> --
> Rob Bateman
> Flash Development & Consultancy
>
> rob.bate...@gmail.comwww.infiniteturtles.co.ukwww.away3d.com

Henry Cooke

unread,
Jul 24, 2008, 5:55:38 AM7/24/08
to away3...@googlegroups.com
Hi Maikel

Are you creating a new bitmap on every frame? Because the trick to
effects like this is to *not* clear your effect bitmap on every frame,
so you're drawing each new frame onto an effect bitmap which you've
drawn all your previous frames onto, with some transform. It's kinda
tricky to explain, the code looks a bit like:

do this *once*:
private function initEffect():void{
private var $effectBitmap:BitmapData = new BitmapData( stage.width,
stage.height, true );
addChild( new Bitmap( $effectBitmap ) );
}

do this on every frame:
private function updateEffect():void{

// redraw effectBitmap, shifted up a bit and faded a bit (this will
accumlate over time)
var tempBmp:BitmapData = $effectBitmap.clone();
$effectBitmap.fillRect( $effectBitmap.rect, 0x00000000 );
$effectBitmap.draw( $effectBitmap, new Matrix( 1,0,0,1,0,-1 ), new
ColorTransform(1,1,1,0.9) );
tempBmp.dispose();

// draw contents of away3d view, with a colorTransform
$effectBitmap.draw( view.getBitmapData(), new Matrix(), new
ColorTransform( .6, 1, .6 );
}


(this is just the theory off the top of my head, haven't tested or
optimised it or anything, but it should give an idea of how it could
work ;) )

Cheers,
Henry

2008/7/23 Maikel Sibbald <in...@flexcoders.nl>:

Henry Cooke

unread,
Jul 24, 2008, 6:04:25 AM7/24/08
to away3...@googlegroups.com
D'oh, typo, the line that says:

$effectBitmap.draw( $effectBitmap, new Matrix( 1,0,0,1,0,-1 ), new
ColorTransform(1,1,1,0.9) );

should say:

$effectBitmap.draw( tempBmp, new Matrix( 1,0,0,1,0,-1 ), new
ColorTransform(1,1,1,0.9) );

Playing with that Matrix can give you some pretty fun effects ;)

h.

2008/7/24 Henry Cooke <aninfinitenu...@gmail.com>:

Henry Cooke

unread,
Jul 24, 2008, 6:26:30 AM7/24/08
to away3...@googlegroups.com
Oh yeah, you probably need to play with the blendModes on the
$effectBitmap.draw calls as well (try screen / overlay )....
(sorry about the spamming, brain working a bit slow this morning ;) )

2008/7/24 Henry Cooke <aninfinitenu...@gmail.com>:

Maikel Sibbald

unread,
Jul 24, 2008, 11:03:27 AM7/24/08
to away3d.dev
WOW thanks broh playing with the value, will teach you a lot of
things. So happy with this. Why did I every start learning the flex
framework again......!!!
hahah No just kidding, thanks.... new hobby lately......playing with
pixels, like the rest of the community is doing for a few years now
(huh fabrice......I know I know........FWAC 4 life)

Thanks..


On 24 jul, 04:26, "Henry Cooke" <aninfinitenumberofmonk...@gmail.com>
wrote:
> Oh yeah, you probably need to play with the blendModes on the
> $effectBitmap.draw calls as well  (try screen / overlay )....
> (sorry about the spamming, brain working a bit slow this morning ;) )
>
> 2008/7/24 Henry Cooke <aninfinitenumberofmonk...@gmail.com>:
>
> > D'oh, typo, the line that says:
>
> > $effectBitmap.draw( $effectBitmap, new Matrix( 1,0,0,1,0,-1 ), new
> > ColorTransform(1,1,1,0.9) );
>
> > should say:
>
> > $effectBitmap.draw( tempBmp, new Matrix( 1,0,0,1,0,-1 ), new
> > ColorTransform(1,1,1,0.9) );
>
> > Playing with that Matrix can give you some pretty fun effects ;)
>
> > h.
>
> > 2008/7/24 Henry Cooke <aninfinitenumberofmonk...@gmail.com>:
> >> 2008/7/23 Maikel Sibbald <i...@flexcoders.nl>:

Henry Cooke

unread,
Jul 24, 2008, 11:21:42 AM7/24/08
to away3...@googlegroups.com
Hehe, no problem. That's a classic oldskool 'blitter feedback' effect
that you used to see a lot of in the Amiga demoscene, back in the day.

If you're into playing with pixels, researching the demoscene (just
put that word into google), looking at effects and trying to figure
out how they did them (or reading about them) is a *really* good
source of inspiration :)

2008/7/24 Maikel Sibbald <in...@flexcoders.nl>:

Reply all
Reply to author
Forward
0 new messages