228

Maurer Rhodonea Rose

Harmonic rose foliation combining Luigi Grandi's Rhodonea mathematical petals with Peter Maurer's crystalline star polygon chords, surrounded by golden anther stamens.

Playground
60 FPS Canvas 2D
Click + Drag to interact with field
</>

Full Executable Algorithm Code

// 066 - Maurer Rhodonea Rose (botany)
// 1:1 Original algorithm engine source
function createRhodoneaRose() {
  return {
    setup() {
    },
    render(context, timeState, params) {
      const { ctx, width, height } = context;
      const petals = Math.max(3, Math.min(16, Math.round(Number(params.petals ?? 6))));
      const maurerD = Number(params.maurerStep ?? 71);
      const speed = Number(params.bloomSpeed ?? 0.5);
      const layers = Math.max(2, Math.min(6, Math.round(Number(params.petalLayers ?? 4))));
      const t = timeState.time * speed;
      ctx.fillStyle = "#060305";
      ctx.fillRect(0, 0, width, height);
      const cx = width * 0.5;
      const cy = height * 0.5;
      const maxR = Math.min(width, height) * 0.43;
      ctx.save();
      ctx.translate(cx, cy);
      const baseHue = 345;
      for (let layer = 1; layer <= layers; layer++) {
        const lFrac = layer / layers;
        const layerR = maxR * (0.25 + 0.75 * lFrac) * (1 + 0.05 * Math.sin(t * 0.6 + layer));
        const k = petals;
        const stepAngle = maurerD;
        const layerRotation = t * 0.08 * (layer % 2 === 0 ? 1 : -0.7) + layer * Math.PI / layers;
        ctx.save();
        ctx.rotate(layerRotation);
        ctx.beginPath();
        const chordSteps = 360;
        for (let i = 0; i <= chordSteps; i++) {
          const theta = i * stepAngle * Math.PI / 180;
          const r = layerR * Math.sin(k * theta);
          const px = Math.cos(theta) * r;
          const py = Math.sin(theta) * r;
          if (i === 0) ctx.moveTo(px, py);
          else ctx.lineTo(px, py);
        }
        ctx.strokeStyle = hsla(baseHue + layer * 12 + Math.sin(t * 0.8) * 6, 85, 75, 0.2 + lFrac * 0.22);
        ctx.lineWidth = 0.85;
        ctx.stroke();
        ctx.beginPath();
        const smoothSteps = 360;
        for (let j = 0; j <= smoothSteps; j++) {
          const phi = j / smoothSteps * Math.PI * 2;
          const rSmooth = layerR * Math.sin(k * phi);
          const sx = Math.cos(phi) * rSmooth;
          const sy = Math.sin(phi) * rSmooth;
          if (j === 0) ctx.moveTo(sx, sy);
          else ctx.lineTo(sx, sy);
        }
        ctx.closePath();
        ctx.strokeStyle = hsla(baseHue - 8 + layer * 8, 92, 68, 0.7);
        ctx.lineWidth = 1.5;
        ctx.stroke();
        ctx.restore();
      }
      const coreR = maxR * 0.12;
      const stamenCount = petals * 4;
      for (let s = 0; s < stamenCount; s++) {
        const sAngle = s / stamenCount * Math.PI * 2 + t * 0.2;
        const stamenLen = coreR * (1.2 + 0.4 * Math.sin(s * 3 + t * 3));
        const sx = Math.cos(sAngle) * stamenLen;
        const sy = Math.sin(sAngle) * stamenLen;
        ctx.beginPath();
        ctx.moveTo(0, 0);
        ctx.quadraticCurveTo(
          Math.cos(sAngle + 0.2) * (stamenLen * 0.6),
          Math.sin(sAngle + 0.2) * (stamenLen * 0.6),
          sx,
          sy
        );
        ctx.strokeStyle = hsla(45, 95, 72, 0.6);
        ctx.lineWidth = 1;
        ctx.stroke();
        ctx.fillStyle = hsla(48, 100, 85, 0.95);
        ctx.beginPath();
        ctx.arc(sx, sy, 1.8, 0, Math.PI * 2);
        ctx.fill();
      }
      ctx.fillStyle = hsla(baseHue, 100, 85, 0.9);
      ctx.beginPath();
      ctx.arc(0, 0, 3.5, 0, Math.PI * 2);
      ctx.fill();
      ctx.fillStyle = hsla(baseHue, 100, 92, 0.4);
      ctx.beginPath();
      ctx.arc(0, 0, 8, 0, Math.PI * 2);
      ctx.fill();
      ctx.restore();
    }
  };
}

// Default parameters from content metadata
const defaultParams = [
  {
    "key": "petals",
    "label": "Petal Count (k)",
    "type": "range",
    "min": 3,
    "max": 12,
    "step": 1,
    "defaultValue": 6,
    "description": "Grandi rose harmonic frequency"
  },
  {
    "key": "maurerStep",
    "label": "Maurer Angular Step (d)",
    "type": "range",
    "min": 29,
    "max": 97,
    "step": 2,
    "defaultValue": 71,
    "description": "Chord progression angle in degrees"
  },
  {
    "key": "petalLayers",
    "label": "Concentric Whorls",
    "type": "range",
    "min": 2,
    "max": 6,
    "step": 1,
    "defaultValue": 4,
    "description": "Number of nested crystalline petal layers"
  },
  {
    "key": "bloomSpeed",
    "label": "Bloom Speed",
    "type": "range",
    "min": 0.2,
    "max": 1.8,
    "step": 0.1,
    "defaultValue": 0.5,
    "description": "Harmonic unfolding and rotation cadence"
  }
];

if (!window.__art_instances) window.__art_instances = {};
if (!window.__art_instances['rhodonea-rose']) {
  const inst = typeof createRhodoneaRose === 'function' ? createRhodoneaRose() : null;
  if (inst && inst.setup) {
    inst.setup({ ctx, width, height, dpr: 1, aspectRatio: width / height }, defaultParams);
  }
  window.__art_instances['rhodonea-rose'] = inst;
}

const instance = window.__art_instances['rhodonea-rose'];
if (instance && instance.render) {
  instance.render(
    { ctx, width, height, dpr: 1, aspectRatio: width / height },
    { time, deltaTime: dt, frameCount: Math.floor(time * 60), fps: 60 },
    defaultParams
  );
}
Edit in Interactive Playground Zero Dependencies • Standalone Canvas 2D
ƒ

Mathematical Formulation

medium
Analytical Equation
r(θ)=Rsin(kθ),θi=id,pi=[r(θi)cosθir(θi)sinθi]r(\theta) = R \sin(k \theta), \quad \theta_i = i \cdot d^\circ, \quad \mathbf{p}_i = \begin{bmatrix} r(\theta_i)\cos\theta_i \\ r(\theta_i)\sin\theta_i \end{bmatrix}
Click to expand
Compact Formula
r = R*sin(k*θ + φ), chord_point = [r*cos(i*d°), r*sin(i*d°)]

Mathematical Tags

#rose #rhodonea #maurer #flower #botany #grandi #polar #crystals #geometry
Author: Math Art Core Target: 60 FPS

Export & Embed: Maurer Rhodonea Rose

4K PNG Snapshot

High-resolution single frame render

WebM Video (5s Loop)

60 FPS browser-captured stream

Standalone JS Script

Complete executable Canvas 2D algorithm

HTML Iframe Embed

<iframe src="https://art.fazleyrabbi.xyz/embed/rhodonea-rose" width="500" height="500" frameborder="0" loading="lazy"></iframe>
ESC
↑↓ Navigate Select
110 Mathematical Artworks
Made by Fazley Rabbi

Support the Project

Keep mathematical creative coding alive & open source

Or via Direct Payoneer ($0 Fee)
Payoneer Customer ID: $0 Fee Direct
24076084

💡 Payoneer app: Go to Pay → Pay to recipient → Enter ID 24076084.

Thank you for supporting generative mathematical animations! ✨