Pointer dragging
Mouse, pen, and touch physically constrain particles through Pointer Events.
The renderer raycasts from the pointer into the projected cloth triangles. Barycentric coordinates identify the nearest simulated particle. During a drag, a temporary positional target attracts a configurable particle neighborhood.
interaction: {
enabled: true,
touchAction: "pan-y",
dragRadius: 1,
dragStiffness: 0.9,
maxDragDistance: 2.5,
allowPinned: false,
releaseImpulse: [0, 0, 0],
}Pointer capture keeps dragging active outside the canvas. Release preserves solver momentum because the particle's previous position is not replaced with a scripted animation.
touchAction controls how touch gestures are shared with the browser. Its default, "pan-y", allows normal vertical page scrolling over the canvas while horizontal gestures drag the cloth. Use "none" for unrestricted two-axis dragging in a fullscreen or dedicated interaction surface, "pan-x" for a horizontally scrolling layout, or "auto" to leave gesture handling to the browser. Mouse and pen dragging are unaffected by this option.
Pinned particles are ignored unless allowPinned is enabled. maxDragDistance protects the constraint network from accidental extreme pulls. See Attachments and pinning for the complete edge, corner, partial-edge, and custom-point syntax.