👁️ Field of View

Shadow casting · Visibility polygon · NPC sight

Mode

Move NPC: drag green dot.
Add Box: click-drag to draw.
Drag boxes to reposition.

FOV Parameters

Stats

Rays cast
Visible %
Player seen

👁️ Field of View — NPC Visibility

Interactive field-of-view simulation using shadow casting. Place obstacles in the scene, adjust the FOV cone angle and vision range, and watch the visibility polygon recalculate in real time.

🔬 What It Demonstrates

Shadow casting algorithms compute a visibility polygon by tracing rays from the NPC position and trimming them at obstacle edges. The result is a precise FOV that correctly handles partial occlusion, corners and overlapping obstacles.

🎮 How to Use

Drag the NPC around the scene. Click to place or remove obstacles. Adjust the FOV angle slider (30°–360°) and range. The visibility polygon updates instantly — bright areas are visible, dark areas are hidden.

💡 Did You Know?

Field-of-view algorithms are fundamental in stealth games (Metal Gear Solid, Hitman). Many roguelikes use the recursive shadowcasting variant that processes the grid octant-by-octant for maximum performance.

About Field-of-View Shadow Casting

This simulation shows how a stealth-game NPC works out exactly what it can see. From the NPC's position it casts rays toward every relevant obstacle corner and along the edges of its vision cone, finding the nearest intersection of each ray with a rectangle edge or the boundary wall using a parametric ray-segment formula. Connecting the ordered hit points produces a precise visibility polygon that respects occlusion.

The Angle slider sets the FOV cone from 20° to 360°, the Range slider caps vision at 60-500 px, and NPC speed controls the auto-rotation rate. You move the green NPC, face it by clicking, and draw or drag grey boxes as walls; the orange target turns red when it falls inside the polygon. The same idea drives enemy awareness, line-of-sight checks and lighting in many 2D games.

Frequently Asked Questions

What is this simulation showing?

It models a non-player character's field of view in a 2D scene. The green NPC sees a cone of vision, and the bright green polygon marks exactly which areas are visible. Grey boxes cast shadows that hide parts of the scene, and the orange target is flagged when the NPC can see it.

What is shadow casting?

Shadow casting computes a visibility polygon by tracing rays from the viewer outward and stopping each ray at the first obstacle it strikes. The boundary between lit and unlit regions forms the edges of the polygon. Here the NPC is the light or eye, and the boxes block the rays, creating the dark hidden areas behind them.

How does the visibility polygon get built?

The code gathers the angle to every obstacle corner and wall corner that lies inside the FOV cone, plus a fan of boundary rays along the cone edges. Each angle is cast as a ray, trimmed to the nearest hit or the maximum range, and the resulting points are sorted by angle and joined into a filled polygon fanning out from the NPC.

What do the Angle and Range sliders do?

The Angle slider sets the width of the vision cone, from a narrow 20° all the way to a full 360° circle. The Range slider sets how far the NPC can see, between 60 and 500 pixels; rays are clamped to this distance even where nothing blocks them, so the polygon never extends beyond it.

What does the NPC speed slider control?

When you are not interacting, the NPC slowly rotates so you can watch its cone sweep the scene. The speed slider, from 0 to 3, scales how fast that auto-rotation turns. Setting it to 0 freezes the facing direction. Clicking the canvas, dragging the NPC or drawing a box turns auto-rotation off so you can aim manually.

What is the key equation behind the ray casting?

Each ray is tested against each segment with a parametric intersection. Writing the ray as origin plus t times direction and the segment as a line, the solver computes the determinant of the two direction vectors; if it is non-zero it finds t along the ray and u along the segment, accepting the hit only when t is positive and u lies between 0 and 1.

How does it decide whether the target is seen?

The target is judged seen when three conditions hold: its distance from the NPC is within the range, its bearing falls inside the half-angle of the cone, and a point-in-polygon test places it inside the visibility polygon. That last test uses an even-odd ray-crossing count, so a box standing between the NPC and the target correctly hides it.

Is this physically accurate?

It is a faithful 2D geometric model of line of sight rather than a full optical simulation. The ray-segment maths is exact for the polygonal obstacles used, so occlusion, corners and overlapping boxes are handled correctly. It ignores real effects such as light falloff, diffraction and peripheral acuity, which is appropriate for game AI where crisp visibility decisions matter most.

Why cast rays toward corners rather than at fixed angles?

A visibility polygon only changes direction at obstacle corners, so casting toward each corner captures every silhouette edge with very few rays. Casting at fixed evenly-spaced angles would either miss thin features or waste effort. Tiny offsets are added on either side of each corner so the rays can slip just past an edge and reveal what lies beyond it.

Where is this technique used in real games?

Field-of-view and line-of-sight algorithms underpin stealth titles such as Metal Gear Solid and Hitman, where guards must react only to what they can actually see. The same visibility-polygon idea drives dynamic 2D lighting, fog of war in strategy games, and the recursive shadowcasting used by many roguelikes to reveal the dungeon as you explore.