Skip to content

Ellipse

An Ellipse draws an elliptical shape with independent X and Y radii (radiusX, radiusY), intrinsic rotation, and optional startAngle/endAngle for partial ellipses. Use ellipses when you need non-uniform curvature — for example, orbit paths, oval indicators, or stylized backgrounds.

Example

Usage

ts
import {
    createEllipse,
} from '@ripl/web';

const ellipse = createEllipse({
    fill: '#3a86ff',
    cx: 200,
    cy: 150,
    radiusX: 100,
    radiusY: 60,
    rotation: 0,
    startAngle: 0,
    endAngle: Math.PI * 2,
});

Properties

The ellipse's geometry is defined by cx, cy, radiusX, radiusY, rotation, startAngle, and endAngle.

NOTE

For the full property list, see the Ellipse API Reference.