Question How to develop a tiled 2D Map that will support hiding/unhiding tile based on player position?

I created illustration that shows how I want to hide/unhide tiles on the map.
The white area represents a walls.

 

Is your project a turn-based game and the character moves exactly on the tiles? Do you already have some element hierarchy in your prototype design? I am trying to determine the precision of the answer.

 

Yes it is a turn based game and player can walk on the tiles.

 

If this is an early stage then you would have to decide on how to move first. There are two options to choose from.

1. The game world is generated from the very beginning, and the character moves around it like a pawn, i.e. his position in the game world changes.
   
2. The player character stands still, and it is the world that moves under his feet (the illusion of movement). The world is generated only within his sight. I'm talking about the maximum range of his sight without taking into account obstacles yet.

 

Player will have some action points to spend in each turn. I implemented Path Finding using A* algorithm. Player will click on tile and his character will start moving to desired location while for each tile I must calculate visible area. So, calculating visible area is a current problem.

 

I think that I need to define formula for each tile border (i.e. y = 3 is a horizontal line 3 units from zero) then to figure out where is start and end point on that border for each tile having that border. After that I will need to calculate crossing points between lines from player position and tile borders those lines hit. And finally but not last I need to calculate crossing points between tile borders and Max Visibility Circle. And at the end I need to calculate affected visible area by solving Integral and then calculate percentage of that area in tile area. If I find that is more than 55% then I will include tile in the visible area and discover content.

 

The field of view algorithm is not that trivial. It definitely needs to be based on penetrating the area in multiple directions. The result of this search must be collected somewhere (matrix). Then you need to translate this result. So, for example, you have Grid, in it Tilemap Terrain and Tilemap Fog over the terrain.

 

So I started experimenting a bit. I made a simple prototype that checks the terrain straight ahead, in 4 directions (no corners) from 5 points (player, top, bottom, left and right). Of course, this is not optimal. However, I am not sure about the range behind the obstacle. I marked these elements with a red border in the screenshot, should these areas be visible?

 

I've seen this done different ways in different games.

Some games require you to see 100% of a cell before you can see any part of it.

Other games require you to see 50% of the cell.

Other games let you see the entire cell if you can see any part of it.

It's really up to you.

Broadly speaking this technology combines "line of sight" or (LoS) with "fog of war," and that can give you some more googling material.

 

I've done something similar, although it only uses a single point of origin and all the offsets from the origin are pre-calculated beforehand and used as a lookup as the player moves across a map where the view may be blocked by terrain. It's not perfect, as already mentioned using the centre of the square only means some tiles are blocked that outer points on the square can see. Another issue is where there is a square above and one to the right of the player a 45 degree ray going between them ends up with a line of diagonal squares which doesn't look great. I don't want to block it off so might need some form of arc there.

Here's a couple useful links I probably should have found sooner.

https://didacromero.github.io/Fog-of-War/

https://www.redblobgames.com/articles/visibility/