Trajectory Predictor

Inspiration

In AP Physics class, we would use other planet simulations to better understand the concepts of kinematics. This project literally came out of the necessity to apply that knowledge and expand upon it so users can compute and graph flight trajectories directly from Earth and observe how launch angle and initial velocity will affect a spacecraft's final trajectory in an accurate 3D environment.

What it does

Orbital Path Weaver is an interactive 3D flight path simulator. It allows users to:

• Enter initial launch parameters: initial velocity, launch angle (in radians) from the horizontal, and launch altitude in feet above Earth surface
• Animate and show resulting spacecraft path in a dynamic 3D environment, launching from a real-life launching site (Cape Canaveral)
• Watch an animated simulated spacecraft trace out along the calculated path, with animation rate adjustable -Toggle on-off visibility of true historical SpaceX launch sites, with context-sensitive reference on the Earth model
• Control the 3D scene (zoom, pan, rotate) to see the trajectory from other perspectives Provides real-time feedback on trajectory outcomes (e.g., "impacted Earth," "escaped Earth's influence")

How we built it

We created Orbital Path Weaver as a single-page web application with vanilla web technologies:

• HTML: For the basic structure of the control panel and the 3D canvas
• CSS (with Tailwind CSS): For responsive, modern-day styling and arrangement
• JavaScript: For the fundamental logic to manage user input, calculate 3D physics, and drive the 3D scene
• Three.js: This feature-rich JavaScript library was needed to solve the interactive 3D environment, render the Earth, stars, trajectory lines, and the animated spaceship
• Physics Simulation: A simplified Newtonian two-body gravity model (Earth and spacecraft) approximates the trajectory at discrete time steps using Earth's rotational velocity at the launch latitude for more accurate initial conditions
• Data Integration: SpaceX launch data set from Kaggle directly in JavaScript to identify and display historical launch site markers on the 3D Earth

Challenges we ran into

Balancing Realism with Performance: Balancing realistic physics in real-time in a browser environment and maintaining 3D rendering smooth was one of the biggest challenges. We settled on a simplified gravity model and optimized computation to achieve good performance.

Accomplishments that we're proud of

Successfully implemented an interactive 3D physics simulation within a web browser, allowing abstract concepts to feel intuitive and easy to visually grasp.

What we learned

-mImproved knowledge of 3D rendering with Three.js, including scene initialization, object handling, lighting, and camera handling

• Gained hands-on experience in implementing rudimentary gravitational physics and kinematics in code

What's next for Trajectory Predictor

• Advanced Physics: Incorporate more advanced physics, such as atmospheric drag, J2 perturbations, and potentially multi-body gravity effects for lunar or interplanetary flight
• Target Body Selection: Allow choosing the Moon or Mars as the target, with the simulation calculating Hohmann transfer orbits or other sophisticated maneuvers
• Detailed Rocket Models: Substitute the generic spacecraft sphere with more realistic 3D representations of rockets (e.g., Falcon 9, Starship) and simulate their staging events
• Mission Outcomes and Data Graphics: Provide more accurate readings in relation to the hypothetical path (e.g., apogee, perigee, orbital period, escape velocity achieved) and display them graphically in executing the simulation
• Camera Interactive Controls: Provide more advanced camera modes, including 'follow spacecraft' and 'fixed ground observer'
• Historical Trajectory Replay: If detailed historical trajectory information (beyond launch sites) is provided, create a feature to replay true SpaceX flight paths for direct comparison with user runs

Built With

• css
• html
• javascript
• kaggle
• three.js