Flag Waver Logo

Flag Waver

What is Flag Waver?

Flag Waver is an interactive 3D flag simulation tool that realistically animates flags with physics-based wind effects. It uses WebGL and Three.js to create a dynamic visualization where you can:

  • Upload custom flag images or videos
  • Control wind speed, direction, and behavior
  • Adjust camera position using spherical coordinates
  • Customize flag properties including size, mass, and hoisting orientation
  • Change scenery with different backgrounds
The flag of the United States waving in the wind on a flagpole, rendered in 3D by the Flag Waver simulator

3D waving flag simulation

A preview of the Flag Waver simulator: the flag of the United States waving on a flagpole against a cloudy sky. Pick any country flag or upload your own image, then adjust wind speed, cloth physics and camera angle to watch it move in real time.

Flag Waver is an interactive 3D flag simulation tool that realistically animates flags with physics-based wind effects. It uses WebGL and Three.js to create a dynamic visualization where you can:

  • Upload custom flag images or videos
  • Control wind speed, direction, and behavior
  • Adjust camera position using spherical coordinates
  • Customize flag properties including size, mass, and hoisting orientation
  • Change scenery with different backgrounds

The simulation uses realistic cloth physics to create natural flag movement, perfect for visualizing flag designs, testing visibility, or educational purposes.

Target Controls

X, Y, Z:3D coordinates of camera focus point (±50 units each axis)

Note: Changing target moves camera position to maintain the same viewing angle

Reset Camera

Click the reset button to return to default view

Interactive Controls:

  • Left-click drag: Orbit camera
  • Scroll: Zoom in/out
  • Right-click drag: Pan camera
Image Selection:
  • • Upload custom image or video files
  • • Supported formats: Images (PNG, JPG, GIF) and Videos
Dimensions:
  • • Width: 0.5 - 4 meters (slider control)
  • • Height: 0.5 - 3 meters (slider control)
  • • Mass: 0.05 - 0.3 kg/m² (affects how flag responds to wind)
  • • Match image proportions: Auto-adjust dimensions to image aspect ratio
Two-sided Option:
  • • Enable to show different image on back side
  • • Upload separate back side image when enabled
Hoisting (Flag Attachment):
  • • Sinister: Left side attached to pole (less common)
  • • Dexter: Right side attached to pole (standard)
Orientation:
  • • Top, Left, Bottom, Right: Which edge is attached
Flagpole Type:
  • • Standard: Vertical pole
  • • Horizontal: Horizontal pole
  • • Outrigger: Angled pole
  • • Crossbar: T-shaped pole for vertical hanging
  • • Gallery: Wall-mounted display
Vertical Hanging Method:
  • • Rotate clockwise: Top becomes right side
  • • Rotate and flip: Top becomes left side
  • • No change: Keep original orientation
  • (Only available with Crossbar flagpole)
Wind Toggle:Enable/disable wind simulation
Wind Control:Enable manual control over wind parameters
Direction:0-360 degrees with cardinal direction markers
  • • N (0°): North - Wind from top
  • • E (90°): East - Wind from right
  • • S (180°): South - Wind from bottom
  • • W (270°): West - Wind from left
Speed:0-30 m/s (meters per second)
  • • 0-5 m/s: Light breeze
  • • 5-15 m/s: Moderate wind
  • • 15-30 m/s: Strong wind

Note:

Direction and Speed controls are only available when both Wind and Wind Control are enabled

Background Options:
  • • Classic: Default gradient background
  • • Blue sky: Clear blue sky gradient
  • • Night sky with clouds: Dark sky with cloud effects
  • • Custom: Set your own color and/or image
Custom Background (when selected):
  • • Background color: Choose any color with color picker
  • • Background image: Upload custom background image