RK4

100%

✓ Published0🌍 Public

Last edited Aug 12, 2012

Created on Aug 12, 2012

This example demonstrates the numerical integration of a damped harmonic oscillator using the fourth-order Runge-Kutta method. It shows how the system’s position and velocity evolve over time, starting from an initial displacement of 100 and decaying toward zero. The code implements the RK4 algorithm step by step, evaluating acceleration from a spring constant and damping coefficient, then updating the state iteratively. Results are printed to the console via `console.log`, and the loop continues until both position and velocity fall below a small threshold. No external libraries are used; the example relies entirely on plain JavaScript functions.

AI-generated description

Similar vizzes

Loading thumbnail…

just took the derivative of rk4 by hand...

This example shows the step-by-step derivation of the Jacobian matrix update for the Runge-Kutta 4 (RK4) method, displayed as MATLAB code. It first presents the full, unwieldy one-line expression for the derivative, then reorganizes it into a clearer, more readable sequence of intermediate variables. The code computes the local error propagation by multiplying Jacobian evaluations (via `feval` with a function handle `J`) at successive RK4 stages, accumulating products with identity matrices scaled by step size `h`. The final result updates the matrix `L` using the weighted sum of these Jacobian products, demonstrating how to propagate sensitivities through the RK4 integrator.

Aandyreagan

68% match

Loading thumbnail…

Gist a9d74398b2e6252deeeda63c3a3718e3

This example simulates the Fitz-Hugh Nagumo equations, a simplified model of neural action potentials, using a custom Runge-Kutta 4th-order integrator implemented with NumPy. It sweeps across a parameter range for the variable γ, generating a 2D dataset of voltage and inactivation traces stored in an xarray array. A vector field plot, rendered via Matplotlib’s QuadMesh, visualizes how the system’s oscillatory behavior changes as γ varies. The Vue-based framework embeds this interactive notebook output, allowing inspection of the raw trajectory arrays.

JJazzTap

55% match

Loading thumbnail…

Simplex Wave + Explanations

A step-by-step tutorial demonstrates how to create a continuous radial noise using SimplexNoise. Four stacked canvases explain the process: first, two SimplexNoise functions generate values based on angles sampled every 4°, with the second shifted by π. These underlying noises are then applied radially, highlighting discontinuities with red segments, and weighted with a cosine-based function to eliminate breaks. The final canvas shows the resulting balanced radial wave, illustrating the summation of the continuous-but-unbalanced noises. The code uses D3 v4 for layout and intervals, canvases for rendering, and the simplex-noise.js library.

KKcnarf

51% match

Loading thumbnail…

fourierProducts

This interactive WebGL visualization demonstrates the Fourier transform, converting time-domain signals into frequency spectra. It provides both a naive Discrete Fourier Transform (DFT) implementation and a faster Cooley-Tukey Fast Fourier Transform (FFT) via the jsfft library, with support for multiple window functions like Hamming and Hann. The code shows real-time computation of magnitude spectra from audio buffers using sine and cosine lookup tables, with frequency peaks highlighted.

DDonald Bagwell

50% match

Loading thumbnail…

Accelerate, Then Coast II

This interactive example visualizes a configurable easing function that reflects the "Accelerate, Then Coast" curve to produce slow-out effects. Two sliders adjust the acceleration exponent and the reflection center, allowing comparison between symmetric in-out easing and asymmetric alternatives. The SVG displays the easing curve with axes, while an animated circle traces its path over five seconds, updating reference lines to show progress. The code uses D3 v3 for scales, axes, transitions, and range inputs, with custom easing functions `easeReflect` and `easeAccelerateThenCoast` implemented in JavaScript.

Mmbostock

50% match

Loading thumbnail…

Harmonograph

A harmonograph draws a continuously evolving parametric curve on a Canvas element, with four adjustable oscillators controlling the x and y coordinates. Each oscillator has sliders for frequency, damping, amplitude, and phase rate, plus a phase-reset button. The animation loop uses `requestAnimationFrame` to redraw the curve each frame, applying damped sine functions that fade over time. The code uses the Canvas 2D API's `getContext`, `moveTo`, `lineTo`, and `stroke` methods to render the intricate, slowly shifting patterns.

Aalexmacy

49% match

Loading thumbnail…

ease function

This example demonstrates the mathematical behavior of a simple easing function that animates a variable toward a target value. The visualization shows how the variable converges to the target over time, with the easing strength and sensitivity threshold controlling the speed and precision of the approach. The code defines a JavaScript function, `ease`, which iteratively moves the variable by a fraction of the remaining distance, snapping to the target once the difference falls below a threshold. The rendering is driven by this custom logic, with no external animation or easing libraries involved, making it a bare-bones illustration of frame-by-frame interpolation.

MMAKIO135

49% match

Loading thumbnail…

Fork of Double Harmonic

This example shows a double pendulum animation, drawing a small ball as the endpoint of two connected, rotating line segments. The code uses d3.js v6 with a time-driven `setInterval` loop to update the pendulum's position based on a constant time step and a phase-shift ratio (`psi`). It renders the scene as SVG, creating the arm lines, a moving ball, and a large hollow circle marker at the endpoint. The visualization demonstrates the harmonic motion of the two-segment system.

Ggiulius540

49% match