Blazor-ApexCharts 7.1 and 8.0: Funnel Charts, Ignite UI Theming and the ApexCharts 8.8 Core

Blazor-ApexCharts 7.1.0 shipped on October 30, 2026, after 7.0.0, with funnel and pyramid charts, and 8.0.0 followed on November 8, moving the bundled ApexCharts.js core from 6.5.0 to 8.8.1. Both ship as Blazor-ApexCharts and Blazor-ApexCharts-MAUI; 8.0 changes what a legend click and the mouse wheel do, and code that reads four properties back needs a change.

Key takeaways

• Funnel and pyramid chart types (7.1).
• Ignite UI theming with one service option, and no extra licence key (8.0).
• Chart.Nonce for a strict Content Security Policy, and FormatYAxisLabelForAxis to format each y axis (8.0).
• Four properties changed type: assigning them still compiles, reading them back may not.
• Locales and motion: Azerbaijani and Animations.RespectReducedMotion (7.1), Basque (8.0).

Which behaviours changed in 8.0?

Change	What you will see	How to reverse it
Pie, donut and polar area legend click	The click hides or shows the slice instead of selecting it; OnDataPointSelection no longer fires from the legend	Set Legend.OnItemClick.ToggleDataSeries = false and call ToggleDataPointSelectionAsync in OnLegendClicked
Mouse-wheel zoom	The wheel zooms only with Ctrl or Cmd held, or a trackpad pinch; a plain wheel scrolls the page and shows a hint	Chart.Zoom.AllowMouseWheelZoom = true
Legend-hidden series	A series hidden from the legend stays hidden when the chart updates	Call ShowSeriesAsync with its name
Data labels	Labels that collide across series move apart; bar labels slide to their new place on an update	DataLabels.Animate.Enabled = false snaps them; the collision step has no C# option
Token font	--apx-font-family on the page sets the chart font	Set Chart.FontFamily
Token colours	A Chart.ForeColor, grid or axis colour you set wins over --apx-fore and --apx-grid, even when it equals the default	Leave the colour unset to follow the token
Global options	Copied per DI scope, one per Blazor Server circuit, so changing the startup object no longer reaches running charts	Call SetGlobalOptionsAsync in each user's scope
JavascriptPath	Your script also needs apexcharts.full.min.js beside it, and features/ignite-ui.js for Ignite UI	Copy the larger file set

Which C# code needs a change?

Assigning these four properties still compiles; code that reads them back as the old type does not:

Property	Release	Was	Now
PlotOptionsBar.DumbbellColors	7.1.0	List<string>	DumbbellColorList
LegendMarkers.StrokeWidth	7.1.0	double?	Size
AnnotationsPoint.Y	8.0.0	double?	object
AnnotationsYAxis.Width	8.0.0	double?	object

A dumbbell entry can now be one colour or a start and end pair, a legend marker takes one stroke width per series, a point annotation can name a category row on a horizontal bar or rangeBar chart, and a y-axis annotation width, which broke the chart when given as a number (#611), is now sent as a CSS length such as "50%" or "200px". A library compiled against 7.x needs a rebuild.

var point = new AnnotationsPoint { X = "Mar", Y = 12.5 };   // still compiles

// 7.x: double y = point.Y ?? 0;
double y = point.Y is string ? 0 : Convert.ToDouble(point.Y);   // 8.0: Y may also be a category string

How do I draw a funnel or a pyramid?

ChartType.Funnel and ChartType.Pyramid draw from bar series, so an ApexPointSeries with SeriesType.Bar feeds them. PlotOptions.Funnel sets the stage shape (Rectangle or Trapezoid) and, for a trapezoid, how the last stage ends (Flat or Taper).

options.Chart = new Chart { Type = ChartType.Funnel };
options.PlotOptions = new PlotOptions
{
    Funnel = new PlotOptionsFunnel
    {
        Shape = FunnelShape.Trapezoid,
        LastShape = FunnelLastShape.Taper
    }
};

Sort a funnel with OrderByDescending="e => e.Y" to put the widest stage on top, and a pyramid with OrderBy="e => e.Y". See the funnel chart docs and the Blazor chart demos.

How do charts follow an Ignite UI theme?

Turn the add-on on in the chart service, and every chart takes its palette, text, gridlines, tooltip, font and light or dark variant from the Ignite UI theme on the page:

builder.Services.AddApexCharts(o => o.IgniteUI = true);   // AddApexChartsMaui on MAUI

The add-on ships in the package and loads before the first chart renders. Options you set, --apx-* tokens and a named theme still win over it. Theme = new Theme { DesignSystem = false } turns it off for one chart. Setup is in Ignite UI theming, and one theme across the Apex products covers the family.

What else is new in 8.0?

FormatYAxisLabelForAxis formats each y axis from .NET (#595), passing the axis index, and also formats tooltip values unless TooltipY.Formatter is set. It runs on WebAssembly only.

<ApexChart TItem="Sale" Options="options" FormatYAxisLabelForAxis="FormatAxis">
    ...
</ApexChart>

@code {
    private string FormatAxis(decimal value, int axisIndex) =>
        axisIndex == 0 ? value.ToString("C0") : $"{value:N0} units";
}

Chart.Nonce carries a CSP nonce onto the <style> elements ApexCharts injects, for a style-src without 'unsafe-inline'. See Content Security Policy.

Other fixes

All in 8.0 unless marked.

• RenderAsync keeps the page's scroll position when it rebuilds a chart (#565).
• ApexChart implements IAsyncDisposable, so disposing a chart after a Blazor Server circuit is lost no longer throws JSDisconnectedException (#655).
• A brush chart renders only after its target charts exist (#420).
• FormatXAxisLabel and FormatYAxisLabel no longer break the render on Blazor Server or MAUI; the axes keep their default labels (#585).
• A single Markers.Shape now applies to every series, so tooltip markers show for each one (#619).
• Event handlers keep working inside a .NET custom tooltip (#644).
• X-axis annotation labels take LabelPosition.Top, Center or Bottom (#349).
• SelectedData<TItem>.Source tells a click on a data point from a selection made in code (#442).
• Events and ApexPointTooltip no longer throw after the host passes a new Options instance (#487, 7.1).

The full lists are in the 7.1.0 and 8.0.0 changes on GitHub.

Upgrading

dotnet add package Blazor-ApexCharts --version 8.0.0
dotnet add package Blazor-ApexCharts-MAUI --version 8.0.0   # MAUI apps

Then check:

• Code that reads DumbbellColors, LegendMarkers.StrokeWidth, AnnotationsPoint.Y or AnnotationsYAxis.Width.
• Pie, donut and polar area charts that select from the legend: set Legend.OnItemClick.ToggleDataSeries = false and call ToggleDataPointSelectionAsync in OnLegendClicked.
• Charts that zoom with the mouse wheel.
• Code that changes GlobalOptions after startup to reach every user.
• A custom JavascriptPath.
• A component that subclasses ApexChart<TItem> and declares DisposeAsync: override DisposeAsyncCore instead.

Premium module keys are set as in 7.0, with LicenseKey. See Upgrading to 8.0 in the docs, and the core release posts from 6.7 (legend click) through 8.3 and 8.4 (wheel zoom) to 8.8 for the core changes. The wrapper itself is MIT-licensed; the ApexCharts core it bundles follows the ApexCharts licence and plans.

Frequently asked questions