Crescents

Download (cdnjs)

// Import jQuery and core jCanvas library first
import $ from 'jquery';
import 'jcanvas';

// UMD import
import 'jcanvas/dist/umd/jcanvas-crescents.min.js';

// ESM import
import 'jcanvas/dist/esm/jcanvas-crescents.min.js';

This plugin draws a crescent shape using the provided drawCrescent() method. This method also supports a special eclipse property, which is a multiple of the given radius, and determines how much the circle is eclipsed to create the crescent shape.

$('canvas').drawCrescent({
  fillStyle: '#000',
  x: 160,
  y: 150,
  radius: 100,
  eclipse: 0.75,
  rotate: -15
});

Notes

When the eclipse property has a value of 0, a full circle will be drawn. When the eclipse property has a value of 1, nothing will be drawn.