Pie & Donut Charts
Pie Chart
page.ApexChart(chart => {
chart.Title.Text("Market Share");
chart.AddPie("Company A", 44)
.AddPie("Company B", 33)
.AddPie("Company C", 13)
.AddPie("Others", 10);
chart.Colors(RGBColor.Pink, RGBColor.Blue, RGBColor.Yellow, RGBColor.Teal)
.DataLabels(d => d.Enable(true))
.Legend(l => l.ShowLegend(true).Position(ApexPosition.Bottom));
});
Donut Chart
page.ApexChart(chart => {
chart.Title.Text("Budget Allocation");
chart.AddDonut("Marketing", 35)
.AddDonut("Development", 40)
.AddDonut("Sales", 20)
.AddDonut("Support", 5);
chart.PlotOptions(p => p.PieOptions(pie => pie.DonutSize("65%")))
.DataLabels(d => d.Enable(false))
.Legend(l => l.ShowLegend(true).Position(ApexPosition.Right));
});
Polar Area
page.ApexChart(chart => {
chart.Title.Text("Skill Assessment");
chart.AddPolarArea("Research", 42)
.AddPolarArea("Marketing", 35)
.AddPolarArea("Operations", 28)
.AddPolarArea("Finance", 20)
.AddPolarArea("HR", 15);
chart.Stroke(s => s.SetColors(new[] { "#fff" }).SetWidth(2))
.Fill(f => f.SetOpacity(0.8));
});
Radar Chart
page.ApexChart(chart => {
chart.Title.Text("Team Comparison");
chart.AddSeries("Team A", 85, 72, 90, 81, 76, 88)
.AddSeries("Team B", 78, 80, 84, 86, 70, 79);
chart.PlotOptions(p => p.RadarOptions(r => r.PolygonsStrokeColors("#e8e8e8")))
.Stroke(s => s.ShowStroke(true).SetWidth(2))
.Fill(f => f.SetOpacity(0.35))
.Tooltip(t => t.Enable(true));
});