SketchWave Rose Demo

SWRose is a SketchWaveJS shape object representing a polar rose — a mathematical curve defined by r = a·cos(n·θ) or r = a·sin(n·θ).

The number of petals depends on n: when n is odd, the rose has n petals; when n is even, the rose has 2n petals. The parameter a controls the size — it is the radius from the center to each petal tip.

Controls

• Amplitude (a): controls petal size. Larger a = longer petals that reach further from the center.
• Petal Frequency (n): integer controlling the number of petals. Odd n → n petals; even n → 2n petals.
• Stroke Thickness: the width of the outline in pixels.
• Stroke Color / Fill Color: click the swatch to open a color picker; the slider controls opacity (0 = invisible, 100 = fully opaque).
• Equation Form: toggle between the cosine form (petals aligned to the axes) and the sine form (rotated by 90/n degrees).

Animations

• Spin: continuously rotates the rose about its center. Open the Spin accordion to set speed (°/second). Negative values spin clockwise.
• Bloom: sinusoidally oscillates the amplitude (a), making the petals grow and shrink like a flower opening and closing. Open the Bloom accordion to set speed (Hz) and depth (Δa).
• Motion trails: lower the background opacity (in the Background accordion) to create ghostly trails as the rose animates.

Interactive features

• Drag the center dot on the canvas to reposition the entire rose.
• Snap Center rounds the center coordinates to the nearest grid intersection.
• Click anywhere on the canvas (not on the center dot) to hide or show the background grid.
• Keyboard: s (spin toggle), b (bloom toggle), r (factory reset), q (stop all animations).

SketchWaveJS classes used by this demo

• SWRose Reference
• SWGrid Reference
• SWPoint Reference
• SWColor Reference