Camera View Preview (Gimbal FOV) — Mission Planner
Overview
See exactly what your drone's camera will capture at every waypoint, before it ever takes off.
The problem
Framing a shot in a drone mission meant guessing where the drone would actually look, then entering raw numbers by hand, heading, gimbal tilt, and zoom in degrees, for every single waypoint. Planning a mission this way took close to an hour, and that was before testing it. The only way to confirm the framing was correct was to fly the mission, review the footage, come back and adjust the numbers, and fly again. For routes with dozens of waypoints, this guess-and-test-flight loop ate up real flight time, battery cycles, and operator hours.
What I built
A live camera-frustum visualization inside the mission planner, rendered as a 3D cone from the drone to its target using React and Three.js (react-three-fiber), synced in real time with a picture-in-picture preview of the actual shot over the site's 3D model and terrain. Operators aim the camera by dragging directly on the preview, using an on-screen compass, or keyboard shortcuts, and the system translates that into standard waypoint actions (heading, gimbal tilt/direction, zoom) automatically, no manual number entry. Camera behavior (lens options, zoom range, gimbal limits, thermal overlay) adapts per drone and dock, since each hardware combination has different physical constraints. Gimbal and camera commands are pushed through an MQTT-based real-time transport layer to keep the preview and the live hardware state in sync.
Impact
No more guessing or test flights to verify framing. What used to take close to an hour of manual entry and trial-and-error now takes minutes, with the mission planned entirely from the keyboard and every value filled in automatically.