Double pendulum · glm-5.2
Simulate a chaotic double pendulum on a canvas using the correct equations of motion, drawing the arms and a colorful fading trail of the tip.
transcript · 8 messages
Simulate a chaotic double pendulum on a canvas using the correct equations of motion, drawing the arms and a colorful fading trail of the tip.
thinking
Let me create a double pendulum simulation. The equations of motion for a double pendulum are well-known. Let me write the full index.html. The Lagrangian equations for a double pendulum: θ1, θ2 are angles from vertical. m1, m2 are masses. L1, L2 are lengths. g is gravity. dθ1/dt = ω1 dθ2/dt = ω2 dω1/dt = (-g(2m1+m2)sinθ1 - m2 g sin(θ1-2θ2) - 2sin(θ1-θ2)m2(ω2²L2 + ω1²L1 cos(θ1-θ2))) / (L1(2m1+m2-m2 cos(2θ1-2θ2))) dω2/dt = (2sin(θ1-θ2)(ω1²L1(m1+m2) + g(m1+m2)cosθ1 + ω2²L2 m2 cos(θ1-θ2))) / (L2(2m1+m2-m2 cos(2θ1-2θ2))) Let me build a nice app with canvas, fading trail using color hue cycling.
/workspace/index.html (13310 bytes)Successfully wrote 13310 bytes to /workspace/index.html
thinking
I noticed a sloppy line in the code: `pctx.fillStyle = '#3a4straight'.replace('straight','15a');` — that's a hacky placeholder. Let me clean that up properly.I left a sloppy placeholder line in the rendering. Let me clean it up.
{"edits":[{"newText":" // Ceiling mount bracket\n pctx.fillStyle = 'rgba(90,100,130,0.5)';","oldText":" // Pivot mount\n pctx.fiSuccessfully replaced 1 block(s) in /workspace/index.html.
{"command":"ls -la /workspace/index.html && head -c 200 /workspace/index.html"}-rw-r--r-- 1 node node 13223 Jul 8 00:47 /workspace/index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Chaotic Double Pendulum</title> <style> * { box-sizing: b
Done. `/workspace/index.html` is a single self-contained file with a chaotic double pendulum. **What's inside:** - **Correct physics.** The two second-order ODEs come from the double-pendulum Lagrangian: - θ̈₁ = (−g(2m₁+m₂)sinθ₁ − m₂g·sin(θ₁−2θ₂) − 2sin(θ₁−θ₂)·m₂(ω₂²L₂ + ω₁²L₁cos(θ₁−θ₂))) / (L₁(2m₁+m₂ − m₂cos(2θ₁−2θ₂))) - θ̈₂ = (2sin(θ₁−θ₂)·(ω₁²L₁(m₁+m₂) + g(m₁+m₂)cosθ₁ + ω₂²L₂·m₂cos(θ₁−θ₂))) / (L₂(2m₁+m₂ − m₂cos(2θ₁−2θ₂))) - **RK4 integrator** with 8 substeps per frame for stability — so the chaos stays accurate rather than energy-leaking. - **Two stacked canvases:** a lower *trail* layer that fades each frame via a translucent background overlay, plus an additive `lighter` stroke whose HSL hue cycles continuously, producing a glowing rainbow trail that decays. An upper *pendulum* layer redraws the arms, a mount bracket, the pivot, and glossy shaded bobs each frame. - **Interaction:** drag either bob to set the starting angles (simulation pauses while dragging), and a control panel with sliders for m₁, m₂, L₁, L₂, gravity, and trail-fade rate, plus Reset / Nudge / Pause buttons. Length changes rescale the drawing so both arms always fit. Open it in any browser — no network, no dependencies.
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
EVALUATION
Double pendulum simulates chaotic motion with colorful fading trail; drag/click affect state, panel remains functional throughout.
Vision grade · anthropic/claude-sonnet-5
MEASUREMENTS
Raw readings from the capture, not a verdict — the grade above is the only judgement. Percentages are how much of the screen changed; the measure under-reports sparse motion on a dark background.