Fog Of War system

What is the best approach to make a fog of war system?

There are many approaches I have seen but I don’t think of them are actually good.

One idea I have is to make a custom mask similar to the sphere mask in material editor and have every material which is to be affected by it in game to have it. It will make actor outside the mask invisible.

It will need a custom mask cause I need the sphere to be affected by line of sight. So basically in every tick, I will perform traces around the object which is supposed to have line of sight and update my custom component how much part of it is supposed to rendered. I got no idea if it is going to work or not but I guess its worth a try.

Any other method which could give better results?


Im kind of reading between the lines that you want to make a FPS game, right?
Instead of masking the actor, you should simply toggle visibility. That should be more efficient as I suspect that this “fully transparent” actor will still incurr a draw call.

Why using line of sight?
The fog-of-war element is usually based on proximity. So just use the distance between actor and player (there is a BP distance node perfect for that).

If you really want to make it as a material though, here is a little setup that shopuld get you going…
I wrapped the blending into a function to make it more reusable…

The material:

And the function:


I am not making a fps but a RTS. RTS having a camera on top view can be a problem with the way you are saying.

Also considering multiple units may have line of sight, I need a better method.

Check out that post of mine - you could use the texture update method to do a fog of war system.

  • Make a plane large enough to cover your map from an overhead view, and get a texture that’s solid black.

  • Create an FColor array in Blueprint that has elements equal to width * height of your texture.

  • Based on the position of your units, write into your FColor array at the correct X/Y coords (you’ll need to convert to a single index, there are places that show how to do that) and change the alpha value based on the distance from the unit.

  • Call the blueprint node from the link above and pass in your FColor array every tick.

This sounds interesting didn’t knew something like that is possible. Going to take a lot of effort to do what I want. i.e. to calculate if something blocks line of sight, I have to use trace and stuff. But I think this has draw backs. Suppose I rotate my screen or zoom in, the fog of war wont work or give wired results.