Question by Essential · Jan 19, 2014 at 03:45 PM · shader fog depthmask fog-of-war

Fog of war depth-mask technique

I'm trying to create a little 2D fog of war technique for my level screen. I had quite good luck using the wiki depth mask shader but I've hit a roadblock… I'll demonstrate my technique below, hopefully someone will have an idea how I could fix it.

There is an art underlay plane with a dark transparent plane on top. I used two cameras and a quad with a depth mask shader to create a hole:

alt text

Then I added a second quad with a 'fog' texture on top. Looks great!…

alt text

But then I tried creating another hole beside it to expand the fog and of course I didn't realize that although the depth mask would work fine the fog border just overlaps each other…

alt text

Can anyone help? I'm 90% there but don't know where I can go from here… might a custom shader be able to fix this?

Add comment · Show 2

nesis · Jan 19, 2014 at 04:17 PM 1

If you can draw to a texture in your version of Unity, I'd suggest doing that to unmask new areas. The solution would be something like:

one big texture for the fog (or many textures tiled together in a clever way)
have a set of textures you can use like stamps to add transparency to your big fog of war texture (set pixels over a sub-region in the fog of war texture following a rule like "if pixel.alpha > stamp.pixel.alpha then pixel.alpha = stamp.pixel.alpha")

Essential · Jan 19, 2014 at 10:39 PM 0

Ah, that's a possible idea. I think I'd need to create one giant fullscreen darkened texture and then apply the fog holes to it, probably using this I'd assume: http://docs.unity3d.com/Documentation/ScriptReference/Texture2D.SetPixels.html. I'll have to investigate it a bit, hopefully it'll perform well on mobile.