The toy solver advances in fixed 1/60-second steps and lists every point and link length. P00 and P02 stay at (40, 40) and (120, 40), while seven free points respond to gravity and distance corrections. The tables let you relate the moving mesh to its coordinates rather than judge the animation alone.
Use the worked example
Press Step once, inspect the pin coordinates, and compare a free point with its initial location. Run and Pause use the same step routine. Reset restores both current and previous positions, preventing a hidden velocity from surviving the reset.
Trace the result step by step
Use an original two-dimensional grid with three rows and three columns. Point IDs encode row and column. Positive y runs downward.
Connect adjacent columns within each row: P00–P01, P01–P02, P10–P11, P11–P12, P20–P21, and P21–P22. Connect adjacent rows within each column: P00–P10, P10–P20, P01–P11, P11–P21, P02–P12, and P12–P22.
That is nine points, twelve links, two pins, and seven free points. Every link begins with a rest length and current length of 40 display units. No diagonal, bending, collision, or tearing rule is included. A surface texture would not add those missing mechanisms.
Amine Belkedah’s cloth explanation describes particles joined by distance constraints, motion based on previous positions, and a guard against a zero-distance calculation. Those ideas help explain this small two-dimensional model. Its nine points are enough to inspect the calculations without suggesting that the result identifies a real fabric.
Read a link’s current length against its rest length of 40. For example, a measured length of 50 would mean an excess of 10 units. That is an arithmetic illustration for reading the residual column, not a point placement you can enter: this page has no coordinate-editing control or isolated-link preset.
A correction to one link can move a shared endpoint and change another link’s length. That is why the table reports residual errors after all four sweeps. A small remaining error is part of this iterative solver’s result, not proof that a link was never processed. Compare several connected rows when trying to explain the mesh’s shape.
If two endpoints coincide, the distance calculation cannot provide a direction. The solver skips that correction and reports an issue rather than dividing by zero. It does not restore the rest length by skipping the operation. This is a safeguard in the code, not a zero-distance scenario available from the page’s controls.
For a free point, the prediction adds 0.99 times its retained previous-step displacement and a downward gravity term of 120 times the squared tick duration. The solver keeps the pre-prediction position as the next previous position. Distance corrections then act on the predicted positions, which is why the final coordinates need not equal the prediction alone.
Each tick processes the six horizontal links in the listed order, then the six vertical links, repeating that sequence for four sweeps. The pinned points are held fixed during integration and correction, with their previous positions also fixed. The order is part of the model: changing it can change the remaining error after a limited number of sweeps.
At reset, a free point's current and previous positions are equal, so its retained displacement is zero. Before any link corrections, one gravity prediction shifts its y coordinate by 120 / 3600, or approximately 0.03333 units. Pinned points stay exactly at (40, 40) and (120, 40). This small numeric check concerns the prediction phase only; the subsequent link corrections change the result.
After Step, compare all twelve link rows with the point rows. Each link retains a rest length of 40, with its current length and residual shown beside it. Run repeatedly calls the same step routine; Pause stops those calls while keeping the current state. Its nominal 60 Hz timer does not catch up for every delayed wall-clock tick, so a slow tab is not a calibrated physical experiment.
Copy a prompt for this example
Create one HTML nine-point cloth-like mesh explorer with a responsive drawing, a point-coordinate table, and a table of twelve link lengths and residual errors. Use a two-dimensional three-by-three grid: position (40 + 40c, 40 + 40r), with positive y downward. Pin P00 at (40,40) and P02 at (120,40).
Connect six horizontal neighbor pairs, followed by six vertical neighbor pairs. Every rest length is forty units. Seven points are free. Use a fixed one-sixtieth-second Verlet-style step: retain previous positions, multiply displacement by 0.99, and add gravity 120 times the squared step to free-point y.
Perform four ordered correction sweeps. Split a distance correction equally when both endpoints are free; apply it fully to the free endpoint when the other is pinned. Never move a pinned point. Skip a zero-distance correction and show an issue message rather than dividing by zero.
Provide Step, Run, Pause, and Reset. Step advances once while paused. Run uses the same fixed step, and a hidden page pauses. Reset restores both current and previous positions, the pins, and the starting links.
Show step count, running state, pin coordinates, current lengths, and residuals. The first gravity prediction before link corrections is 120/3600, approximately 0.03333 units; distinguish that intermediate value from final solved coordinates. This is a small deformable toy, not a calibrated fabric model. Return complete HTML with original graphics and inline solver code.
Compare the coordinate and link tables before and after one more Step, then Reset to verify that the initial mesh returns. The prepared HTML model can be previewed in NOS alongside those values. Use the observations to discuss this solver’s behavior before changing its gravity or correction count in your own source.