- Home /
2D top-down field of view visualization
I have a 2d top-down map in a big sprite texture. I want to make all of the map grayscale except the part that is in a field of view (I'm calculating FoV polygon every frame).
As far as I understand, it can be done with shaders, but I have no experience with shaders. I have started reading about them but they are so out of this world that I'm pretty confused on how to do what I need.
I saw this tutorial: https://www.youtube.com/watch?v=xkcCWqifT9M but as far as I understand stencil buffer will not help with my task as it either renders stuff or it doesn't. I will probably use the stencil solution for hiding important objects on the map, but player should see the map itself.
It is pretty clear how to make the whole object grayscale, but how to make only part of it grayscale?
Answer by Maxter · May 12, 2017 at 12:15 PM
I solved my problem the following way:
I generated grayscale map sprite and positioned both map sprites at the same Z level;
I've implemented the stencil solution from the tutorial I linked in the first post, to show the colored version of the map; Stencil code for the colored map:
Stencil { Ref 1 Comp equal }
I've added a new shader to the grayscale map:
Stencil { Ref 1 Comp NotEqual }
That way I see the colored map under the mask (field of view area) and grayscale map everywhere else. Exactly what I needed.
But this way, don't you have to edit two maps always? I am using Tilemaps and sadly, you cannot choose more than one active tilemap to work on multiple tilemaps at the same time... So whenever I want to change something on my map, I will also have to change it on the grayscaled map.