Skip to main content
SimilarExport ZIP
100%

Fork of Projectile Motion Simulator

✓ Published0🌍 Public
NNita
Last edited Apr 22, 2025
Created on Apr 22, 2025

This interactive physics simulator visualizes projectile motion by animating a red circle along a computed parabolic trajectory, with a purple path tracing the full flight. Real-time updates to launch angle, velocity, height, and gravity recalculate the trajectory using the underlying physics formulas. Interactive sliders control simulation parameters, while a play button restarts the animation. The visualization uses D3’s `scaleLinear`, `line`, and `axisBottom`/`axisLeft` components to render axes, ground, and animated elements within an SVG canvas.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Projectile Motion Simulator

This interactive animation illustrates projectile motion physics using the quadratic height equation, plotting trajectory as a D3 line path with a moving circle representing the object. Sliders allow adjustment of launch angle, initial velocity, height, and gravity, with the trajectory path and computed metrics like maximum height and range updating accordingly. The code relies on D3 scales, axes, and interval-based animation, generating synthetic data through the flight-time formula on each parameter change. A play button restarts the motion sequence.

NNita
87% match
Loading thumbnail…

Orbital Trajectory

An interactive simulation of orbital trajectories shows a blue satellite orbiting a central red mass, with its path traced as a dotted trail on a canvas. The velocity slider adjusts the satellite’s initial tangential speed relative to orbital velocity, demonstrating circular, elliptic, or hyperbolic paths based on gravitational physics. The number of trajectory sample points is also user-controllable. The visualization uses `d3.forceSimulation` with `d3.forceMagnetic` to model gravity, rendering the trail via Canvas `fillRect` calls and the satellite as an SVG circle.

TThanaporn-sk
68% match
Loading thumbnail…

Fork of React & D3 Starter

This interactive particle constellation visualizes 100+ colored particles that move with physics-based velocity, bounce off screen edges, and connect to nearby particles with fading lines. Particles are attracted to the mouse cursor, growing larger when approached. Built with React 19 and D3.js v7, the example uses d3.interpolateRainbow for gradient colors and requestAnimationFrame for smooth 60fps animation. Live sliders adjust particle count and connection distance, while a "Regenerate" button randomizes positions and colors through React state management.

NNita
67% match
Loading thumbnail…

Fork of Fork of Spinning Rainbow Starfield

A colorful 3D starfield flight simulator immerses the viewer in a tunnel of thousands of stars, rendered as glowing points that stream past as the viewpoint steers through space. The visualization uses Three.js with a custom GLSL ShaderMaterial and BufferGeometry to draw 5,000 stars, while mouse input controls rotation with inertia and scrolling adjusts speed. A cyan crosshair tracks the cursor, and a speed indicator displays the current velocity.

NNita
67% match
Loading thumbnail…

Fork of Solar System

This example visualizes a solar system as a network of connected nodes, with planets orbiting a central star and lines tracing their paths. It uses `d3.forceSimulation` to position the bodies and `d3.geoPath`-like rendering for orbital trajectories. The animation is driven by `requestAnimationFrame` while each planet’s velocity and acceleration update per frame, producing a dynamic, physics-inspired model. The fork specifically alters the original force parameters, changing the balance of attraction and repulsion to create divergent orbital patterns. All rendering is done through SVG elements, with the code drawing from the v3 branch of the original project.

Aanilthapa1.at23@gmail.com
66% match
Loading thumbnail…

Fork of React Starter

This fork of a React starter demonstrates a real-time, interactive particle system rendered on an HTML canvas. It uses `d3.forceSimulation` to manage particle physics, with forces like charge and collision driving movement across the viewport. The `useRef` and `useEffect` React hooks manage the animation loop, continuously updating the canvas via `requestAnimationFrame`. The display shows a dense cluster of small circles that slowly dissipates and re-forms based on the configured force parameters, providing a live example of force-directed layout in a React component.

Tt_tannenbaum@coloradocollege.edu
66% match
Loading thumbnail…

Fork of new animation

An animated scatterplot uses D3.js to draw a flowing sine wave of circles across the browser window. The code generates 100 to 190 points per frame, updating their x, y, and radius values based on a time variable that increments every 60th of a second. Each green circle is rendered as an SVG element and repositioned using D3's selection join method, creating a continuous, undulating motion. The visualization runs at full screen, dynamically adjusting to the window's dimensions.

Aali.abuyousef@hotmail.com
66% match
Loading thumbnail…

Fork of Circles with D3

A fireworks rocket launches from a red tube, erupting into a burst of orange particles that scatter and fade against a black background. The animation begins after a two-second delay, with each particle expanding from the launch point and moving outward with randomized trajectories. Built with D3.js v7, the visualization uses SVG primitives and a transition with `easeCubicOut` easing to animate the particles' positions and opacity, creating a simple, looping firework effect.

Wwkj0713@gmail.com
65% match