Skip to main content

Circle Block

You simply need to give width, height and these values will define diameters of circle block.

new CircleBlock({width: 120, height: 60, backgroundColor: "black"})

Custom Radius

For creating something like elipse shape you can define different diameters with width and height on circle block.

new CircleBlock({...options, width: 50, height: 120})

Angles

You can define start and end point of circle block angle with startAngle and endAngle options.

new CircleBlock({...options, startAgnle: 0, endAngle: Math.PI})

Inner Radius

Inner radius can create pie like shapes with startAngle and endAngle options in circle block.

new CircleBlock({...options, startAgnle: 0, endAngle: Math.PI, innerRadius: 15})

Border

As in the rectangle block example circles also support border option.

new CircleBlock({...options, border: "30px solid white"})