TerraFluent.Chart.Reporting

Data Ring Chart in C#

Draw full-circle progress rings in C# with AddDataRing — one KPI per ring, ideal for dashboard tiles. Self-contained SVG, no JavaScript dependency.

Data Ring — KPI

ChartType.DataRing — full 360° progress ring.

Q2 2025 — Customer Satisfaction — DataRing: sweep-in animation · centre value · title caption Q2 2025 — Customer Satisfaction — DataRing: sweep-in animation · centre value · title caption — Series: CSAT Score. Values range from 87 to 87. Q2 2025 — Customer Satisfaction DataRing: sweep-in animation · centre value · title caption CSAT 87% CSAT Score: 87% CSAT Score terrafluent.dev terrafluent.dev

Data Ring — Dashboard Trio

Three DataRing charts side-by-side as a KPI dashboard.

CPU Usage CPU Usage — Series: CPU. Values range from 67 to 67. CPU Usage CPU 67% CPU: 67 CPU terrafluent.dev terrafluent.dev
Memory Memory — Series: RAM. Values range from 82 to 82. Memory RAM 82% RAM: 82 RAM terrafluent.dev terrafluent.dev
Disk I/O Disk I/O — Series: Disk. Values range from 34 to 34. Disk I/O Disk 34% Disk: 34 Disk terrafluent.dev terrafluent.dev

When to use a data ring chart

Reach for it when

  • A single percentage or progress value, shown as a full 360° sweep.
  • KPI dashboard tiles — several rings side by side read as a consistent set.
  • Completion and attainment metrics where 100% is a real, reachable target.

Use something else when

  • Values that can exceed the maximum; the ring has nowhere to go past a full circle.
  • Multi-part breakdowns — that is a donut chart, not a progress ring.
  • Very small render sizes without a centre label. The ring alone is not precise enough to read.

Data Ring Chart in C#

Lifted verbatim from the chart types reference, so it compiles against the shipped API. See the API reference for every overload and the exact data types each series method accepts.

string svg = ChartBuilder.Create()
    .Title("Q2 2025 — Customer Satisfaction")
    .Size(400, 400)
    .YAxis(y => { y.Min = 0; y.Max = 100; })
    .AsAnimated()
    .Series(s => s
        .AddDataRing("CSAT Score", 87, cfg =>
        {
            cfg.Color(ChartColor.ChartBlue);
            cfg.DonutCenter
               .Title("CSAT")
               .Color("#1a202c")
               .TitleColor("#718096")
               .FontSize(42)
               .TitleFontSize(14);
        }))
    .RenderToSvg();

Install

dotnet add package TerraFluent.Chart.Reporting
  • MIT licensed — free for commercial use, no chart limits, no watermarks.
  • Zero dependencies — nothing but the .NET base class library.
  • netstandard2.0 through net10.0 — .NET Framework 4.6.1+, .NET Core 2.0+, and every modern release.
  • Output is one SVG string — embed it in HTML, a PDF, or a Word document.