Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Classic Chat / 2D Dynamic Shadows

Author
Message
Ched80
13
Years of Service
User Offline
Joined: 18th Sep 2010
Location: Peterborough, UK
Posted: 4th Nov 2014 06:22
Hi all,

I thought I'd share my code for 2D dynamic shadows in case anyone wanted to use it.

Here's a very short video of the effect in action:



Ignore the frame rate - i get well over 140 FPS on my PC running a Radeon 6290, the lag shown here is from the screen capturing software.

The effect is produced by running 2 shaders applied to the screen Quad each frame. It is based on the technique described here.

The code looks a little complicated, but it is basically doing the following steps:

1] Create a render image of the screen as it is - this is then used later to apply the light and shadows to.

2] Create an occlusion map - basically the same image as above, but the only images visible are those that create shadows. In this example, I hide all the floor tiles and keep all the boxes visible.

3] Run the shadow caster shader to create a 1D image. This 1D image represents minimum distance from the centre of the screen to the first occlusion pixel. I used and image of 360x1 in the video, but I have recently changed this to 512x1 to improve the movement of the shadows.

4] Finally run the shadow draw shader to apply the shadows and light to the original image.

Here is the AppGameKit code:




Here is the Vertes shader "Quad.vs" for the Quad:




Here is the "shadow cast.ps" shader:




Here is the "shadow draw.ps" shader:




I'm sure there are other optimisations and improvements I can add, but these will probably come as I implement it into a bigger demo.

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 4th Nov 2014 11:43 Edited at: 4th Nov 2014 11:49
That looks superb! Thanks for sharing

EDIT: Wow, I get over 900fps...!
Ched80
13
Years of Service
User Offline
Joined: 18th Sep 2010
Location: Peterborough, UK
Posted: 4th Nov 2014 21:14
Cheers bax, impressive fps!

The technique is pretty simple which is why we can get such high frame rates. In sure it'll reduce as I introduce more lights.

Digital Awakening
AGK Developer
21
Years of Service
User Offline
Joined: 27th Aug 2002
Location: Sweden
Posted: 4th Nov 2014 22:05
That looks really cool

Native Tech
10
Years of Service
User Offline
Joined: 19th Jul 2013
Location:
Posted: 5th Nov 2014 00:23
Saw this video on the fb page and wow man that is frikkin awesome.good work

Native Technology
Blendman
10
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 5th Nov 2014 12:46
Hi

I have tried, but I have no shadows, only the "light". My Pc is a packardBell with AMD E1-1200 APU with Radeon HD graphics.

What do I need to use this shaders ?

http://www.dracaena-studio.com
janbo
15
Years of Service
User Offline
Joined: 10th Nov 2008
Location: Germany
Posted: 5th Nov 2014 19:08 Edited at: 28th Nov 2017 16:03
Damn, nice work!
I knew someone will/have to do it for AGK.
It's nice to know we can do that too

I got 2500-3000 fps on my 3 day's old GTX 970.
And thanks for commenting everything.
[edit]ah it was an entrie for the competition[/edit]
Ched80
13
Years of Service
User Offline
Joined: 18th Sep 2010
Location: Peterborough, UK
Posted: 6th Nov 2014 07:45
Blendman, did you get any errors when you start the app?
Did you put the shaders in the media folder?

Blendman
10
Years of Service
User Offline
Joined: 17th Feb 2014
Location: Arkeos
Posted: 6th Nov 2014 07:58 Edited at: 16th Nov 2014 20:02
Ched80 : I have no errors when I start the app, and the sheders are in the media folder.
Perhap's my CG card doesn't support that feature.
What is the verison of openGL needed to use this shaders and how can I know what is the version of opengl installed on my pc ?
Thank you .

EDIT : I have tried with another sprite, and in fact, the issue I have had was because I have an alpha chanel on the first image (container.png), which was < 120.

http://www.dracaena-studio.com
Ancient Lady
Valued Member
20
Years of Service
User Offline
Joined: 17th Mar 2004
Location: Anchorage, Alaska, USA
Posted: 22nd Dec 2014 04:27
Very cool!

Cheers,
Ancient Lady
Jack
19
Years of Service
User Offline
Joined: 4th Oct 2004
Location: [Germany]
Posted: 22nd Dec 2014 04:38 Edited at: 22nd Dec 2014 04:40
Awesome work! Thank you for the contribution. I will try to build a 3d version based on your work. Well I am just starting with glsl and my plan will be to add a third dimension (vec2=>vec3) to all calculation steps. Does anyone think, this could work?


[/url]

Login to post a reply

Server time is: 2024-04-19 13:54:06
Your offset time is: 2024-04-19 13:54:06