Skip to content

DrawArc

Draws an arc on the canvas.

Usage

tsx
import { Canvas, DrawArc } from 'flexium/canvas';

<Canvas width={200} height={200}>
  <DrawArc
    x={100}
    y={100}
    radius={50}
    startAngle={0}
    endAngle={Math.PI}
    stroke="blue"
  />
</Canvas>

Props

PropTypeDescription
xnumber | Signal<number>Center x-coordinate.
ynumber | Signal<number>Center y-coordinate.
radiusnumber | Signal<number>Arc radius.
startAnglenumber | Signal<number>Start angle in radians.
endAnglenumber | Signal<number>End angle in radians.
counterclockwisebooleanDraw counter-clockwise.
strokestring | Signal<string>The stroke color.
fillstring | Signal<string>The fill color (if closing the path).

Released under the MIT License.