)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

Draw an Egg on Canvas Javascript

  1. const TWO_PI = Math.PI * 2;
  2. const THREE_PI = 3 * Math.PI;
  3. const canvas = document.body.appendChild(
  4.   document.createElement('canvas')
  5. );
  6.  
  7. const c = canvas.getContext('2d');
  8. const halfWidth = (canvas.width = 250) / 2;
  9. const halfHeight = (canvas.height = 250) / 2;
  10.  
  11. const scale = 10;
  12.  
  13. c.fillStyle = '#f0e195';
  14. c.strokeStyle = '#c2a272';
  15. c.beginPath();
  16.  
  17. for (let theta = 0; theta <= TWO_PI; theta += 0.02) {
  18.   const x = (TWO_PI - Math.sin(theta)) * Math.cos(theta);
  19.   const y = THREE_PI * Math.sin(theta);
  20.   c.lineTo(halfWidth + x * scale, halfHeight - y * scale);
  21. }
  22.  
  23. c.fill();
  24. c.stroke();

Draw a parametric egg curve…

snippet.zone ~ 2021-22 /// {s/z}