UiSvelte

ArcChart

ArcChart components display data in circular arc segments, ideal for showing progress, metrics, or multi-dimensional data visualization.

Preview

Arc 1 (75/ 300)
Arc 2 (50/ 300)
Arc 3 (30/ 300)

Builder

Center Content
Appearance
Thickness
Gap
Animation
Duration (ms)
States
Data Configuration

The component accepts the following props:

Prop
Type
Default
Title

Description Error

No data

There are no records to display

ArcData Type

Each arc in the data array should follow this structure:

The component accepts the following props:

Prop
Type
Default
Title

Description Error

No data

There are no records to display

Color Type

Available color options for arcs:

The component accepts the following props:

Prop
Type
Default
Title

Description Error

No data

There are no records to display

© 2025 UiSvelte