edbnedbn/ui
ComponentsTablesChartsPDFsStandards
GitHub stars
Explorer
    • Overview
    • Usage
    • Area
    • Hover Highlight
    • Basic
    • Svg Renderer
    • Brush
    • Buffer
    • Hover Reveal
    • Animated Dashed Stroke
    • Bump Curve Type
    • Dashed Stroke
    • Default Type
    • Dotted Area Variant
    • Expanded Type
    • Gradient Area Variant
    • Gradient Colors
    • Gradient Colors Bump
    • Gradient Reverse Area Variant
    • Hatched Area Variant
    • Lines Area Variant
    • Loading State
    • Monotoney Curve Type
    • Solid Area Variant
    • Solid Stroke
    • Stacked Type
    • Step Curve Type
    • Bar
    • Basic
    • Svg Renderer
    • Buffer
    • Gradient Colors
    • Loading State
    • Default Variant
    • Expandable Variant
    • Max Highlight
    • Blocks Variant
    • Hatched Variant
    • Duotone Variant
    • Duotone Reverse Variant
    • Gradient Variant
    • Stripped Variant
    • Stacked Type
    • Percent Type
    • Horizontal Layout
    • Hover Highlight
    • Glowing Desktop
    • Glowing Mobile
    • Tooltip Default
    • Tooltip Frosted Glass
    • Chart Config Default
    • Chart Config Icons
    • Composed
    • Basic
    • Svg Renderer
    • Gradient Colors
    • Loading State
    • Hatched Variant
    • Duotone Variant
    • Gradient Variant
    • Stripped Variant
    • Dashed Stroke
    • Animated Dashed Stroke
    • Bump Curve
    • Dots
    • Hover Highlight
    • Glowing
    • Line
    • Basic
    • Svg Renderer
    • Gradient Colors
    • Gradient Colors Bump
    • Loading State
    • Bump Curve Type
    • Step Curve Type
    • Monotoney Curve Type
    • Solid Stroke
    • Dashed Stroke
    • Animated Dashed Stroke
    • Glowing Desktop
    • Glowing Mobile
    • Buffer
    • Hover Reveal
    • Dot Default
    • Dot Border
    • Dot Colored Border
    • Dot Ping
    • Legend Square
    • Legend Circle
    • Legend Circle Outline
    • Legend Rounded Square
    • Legend Rounded Square Outline
    • Legend Vertical Bar
    • Legend Horizontal Bar
    • Pie
    • Basic
    • Svg Renderer
    • Gradient Colors
    • Donut
    • Padded
    • Overlapping Padded
    • Labels
    • Loading State
    • Outside Labels
    • Radar
    • Basic
    • Svg Renderer
    • Lines Variant
    • Circle Grid
    • Gradient Colors
    • Loading State
    • Radial
    • Basic
    • Svg Renderer
    • Semi Variant
    • Gradient Colors
    • Loading State
    • Sankey
    • Basic
    • Svg Renderer
    • Gradient Colors
    • Loading State
    • Solid Link Variant
    • Source Link Variant
    • Labeled Nodes
    • Outside Labels
    • Solid Labeled Nodes
    • Allocation
    • Audience
    • Benchmark
    • Budget
    • Cache Tiers
    • Grid
    • Latency
    • Market Share
    • Monospace
    • Payouts
    • Peak
    • Pipeline
    • Portfolio
    • Progress Rings
    • Reliability Score
    • Revenue Mix
    • Ride
    • Shipments
    • Attribution

Progress Rings

Dotted progress rings with a centered stat, built from per-dot pie sectors

Apache ECharts 6Official docsEvil Charts · MIT

Installation

npx shadcn@4.19.0 add https://ui.edbn.me/r/echarts-pie-chart.json

Basic example

npx shadcn@4.19.0 add https://ui.edbn.me/r/progress-rings-echarts-pie-chart.json

Source