What's New in Blazor-ApexCharts 7.0.0

Blazor-ApexCharts 7.0.0 is a big one. It swaps the vendored ApexCharts.js core from 5.16.0 up to 6.5.0, which means the entire v6 feature wave now reaches .NET through the same strongly-typed C# API you already use. You get a canvas renderer for large datasets, real-time streaming, bar chart race, and a set of premium interaction modules, all as typed options and methods rather than JavaScript.

It ships for both packages, Blazor-ApexCharts (Blazor Server, WebAssembly, WinForms, WPF) and Blazor-ApexCharts-MAUI, and multi-targets .NET 8, 9, and 10.

Key takeaways

• ApexCharts 6.5 under the hood. The bundled core jumps from 5.16 to 6.5, so v6 rendering and features are available without touching JavaScript.
• New capabilities, no key needed. A hybrid SVG/canvas renderer, real-time streaming, native touch gestures, OS-aware themes, extra easing curves, and bar chart race, none of which require a license key.
• Seven new premium modules. Undo/redo, perspectives, linked views with crossfilter, ink annotations, measure, context menu, and storyboard, surfaced as typed options, methods, and events.
• A new licensing model. Charts are never gated; the premium modules run in trial mode with a watermark until you apply an offline-validated key.
• Breaking by default in a few places. The v6 behavior changes (animated data updates, touch pinch/pan, smooth wheel zoom) are on by default, each with a one-line opt-out.

Which features need a license?

Charting needs no key. The premium modules are the interaction layer added in ApexCharts v6, and they show an APEXCHARTS watermark until you apply a key.

Area	License key	Key API
All chart types and standard options	Not needed	ApexChart<TItem>, ApexChartOptions<TItem>
Canvas renderer, streaming, gestures, OS themes, easing, bar race	Not needed	Chart.Renderer, Chart.Streaming, Chart.Pan, Theme.Follow, DataLabels.CountUp
Undo/redo, perspectives, crossfilter, ink, measure, context menu, storyboard	Required	Chart.History, Chart.Perspectives, Chart.Link, Chart.Ink, Chart.Measure, Chart.ContextMenu, StoryboardBindAsync

The features that need no key

Bar chart race

This is the most fun addition, and it needs no key. A bar chart race is a horizontal bar chart that re-ranks over time, with the value labels riding to their bar's new row and counting up to the new number. In 7.0.0 that is three option flags plus a series ordering:

<ApexChart TItem="Racer" Title="Bar chart race" Options="options">
    <ApexPointSeries TItem="Racer" Items="racers" Name="Score"
                     SeriesType="SeriesType.Bar"
                     ShowDataLabels="true"
                     XValue="@(e => e.Name)"
                     YValue="@(e => e.Value)"
                     OrderByDescending="e => e.Y" />
</ApexChart>

@code {
    private ApexChartOptions<Racer> options = new();

    protected override void OnInitialized()
    {
        options.Chart = new Chart
        {
            Animations = new Animations
            {
                DynamicAnimation = new DynamicAnimation { Enabled = true, Speed = 900 }
            }
        };
        options.PlotOptions = new PlotOptions { Bar = new PlotOptionsBar { Horizontal = true } };
        options.DataLabels = new DataLabels
        {
            Enabled = true,
            Animate = new DataLabelsAnimate { Enabled = true },
            CountUp = new DataLabelsCountUp { Enabled = true }
        };
    }
}

Mutate Value on a timer and call await chart.UpdateSeriesAsync(true). OrderByDescending re-ranks the bars each frame, Animate slides the labels along with them, and CountUp tweens each number instead of blinking it. For the mechanics behind the animation, see How to Build a Bar Chart Race in JavaScript.

Canvas renderer for large datasets

ApexCharts draws with SVG, which is why its tooltips and exports are so capable, but it hits a wall at a few thousand DOM nodes. The new hybrid "Strata" renderer keeps everything as SVG below a threshold and paints only the dense series layer to canvas above it, so axes, grid, and tooltips stay crisp SVG while the marks scale.

options.Chart = new Chart
{
    Renderer = Renderer.Auto,   // Svg, Canvas, or Auto
    RendererThreshold = 2000    // Auto switches to canvas above this many marks
};

// after render, read what actually ran:
string active = await chart.GetActiveRendererAsync();   // "svg" or "canvas"

Auto is the sensible default: small charts stay on SVG, mark-heavy ones (scatter, heatmap, dense lines) cross to canvas on their own. For what the renderer does and does not move to canvas, see Canvas Renderer (Strata).

Real-time streaming

Chart.Streaming gives you a rolling window that trims old points as new ones arrive, so a long-running feed does not grow memory without bound:

options.Chart = new Chart
{
    Streaming = new ChartStreaming { Enabled = true, MaxPoints = 50 }
};

Append with await chart.AppendDataAsync(newPoints) on your timer; the core trims the rendered window to MaxPoints and scrolls at constant velocity once it fills.

And a few more, no code needed

• Native touch gestures. Two-finger pinch-zoom (Chart.Zoom.Pinch) and a new inertial Chart.Pan with Inertia and Friction.
• OS-aware themes. Theme.Follow = ThemeFollow.Os switches light/dark with the operating system; Theme.Name selects a registered theme.
• More easing. The Easing enum gains the v6 named curves (EaseInSine through EaseInOutBack), plus DynamicAnimation.Easing.

The premium modules

The seven premium modules are the ApexCharts v6 interaction layer. They work fully in trial mode so you can build and test against them, but show an APEXCHARTS watermark until a key is applied. Each is a typed option, with typed methods and events.

Module	What it does	Key API
Undo / Redo	Command journal for zooms, toggles, and edits	Chart.History, UndoAsync / RedoAsync
Perspectives	Serialize a view into a shareable token/URL	Chart.Perspectives, CapturePerspectiveAsync, PerspectiveToUrlAsync
Linked Views & Crossfilter	Coordinate a group of charts over shared data	Chart.Link, IApexChartService.RegisterCrossfilterAsync
Ink	Draggable, editable annotations	Chart.Ink, OnAnnotationDragged / OnAnnotationEdited
Measure	A delta ruler for change, percent, and slope	Chart.Measure, StartMeasureAsync, OnMeasured
Context Menu	Right-click actions at the clicked point	Chart.ContextMenu
Storyboard	Scroll-driven chart choreography	StoryboardBindAsync, OnBeatChange

Crossfilter, the Blazor way

Crossfilter is the standout, because it uses the chart service rather than a per-chart option. Register a shared record set once, and every chart that declares a matching Chart.Link.Id and a Dimension aggregates over it. Click a slice or bar in one and the rest re-aggregate over the filtered rows.

@inject IApexChartService ChartService

<ApexChart TItem="Trade" Title="By quarter" Options="quarterOptions">
    <ApexPointSeries TItem="Trade" Items="records" Name="Trades"
                     SeriesType="SeriesType.Donut"
                     XValue="@(t => t.Q)" YAggregate="@(g => (decimal)g.Count())" />
</ApexChart>

@code {
    protected override void OnInitialized()
    {
        quarterOptions.Chart = new Chart
        {
            Link = new ChartLink { Id = "trades", Dimension = "function(r){ return r.q; }" }
        };
    }

    protected override async Task OnInitializedAsync()
        => await ChartService.RegisterCrossfilterAsync("trades", records);
}

To react to filter changes in C#, call SubscribeCrossfilterAsync(id, dotNetRef) and handle the change event in a [JSInvokable] OnCrossfilterChange(CrossfilterState state) method; ResetCrossfilterAsync(id) clears everything.

One thing to note: the Dimension is a JavaScript function string, not a C# lambda. Function-valued options (crossfilter dimensions, Measure.Format, custom context-menu OnClick, storyboard beats) are passed as JS strings via the existing @eval convention, since they run inside the chart in the browser.

Premium methods and events

The premium modules add typed methods on ApexChart<TItem>, so you can drive them from code: UndoAsync / RedoAsync / JumpHistoryAsync, StartMeasureAsync / StopMeasureAsync / ClearMeasuresAsync, the ...PerspectiveAsync family (including ApplyPerspectiveFromUrlAsync to restore a shared #apex= link on render), and the Storyboard...Async family. They also raise typed events: the OnAnnotation* set for ink, OnMeasured for the ruler, and OnBeatChange for storyboard.

How do I apply a license key?

Apply a key once at startup, per chart, or at runtime. Keys validate offline, so there is no network call.

// Program.cs, application-wide (also AddApexChartsMaui for MAUI)
builder.Services.AddApexCharts(o => o.LicenseKey = "APEX-...");

Or set Chart.License on an individual chart, or call IApexChartService.SetLicenseAsync("APEX-...") at runtime. The wrapper package itself stays MIT-licensed; the key covers the premium ApexCharts modules it now surfaces. See pricing for keys.

Upgrading from 6.x

Install is unchanged:

dotnet add package Blazor-ApexCharts

Because the core moved to ApexCharts 6, a few behaviors are now on by default. None require code changes, but check these if your charts look different:

Change	Effect	Opt out
Dynamic data animation	Adding/removing points animates coherently	Chart.Animations.DynamicAnimation.Enabled = false
Touch pinch and pan	Two-finger zoom and pan on by default	Chart.Zoom.Pinch = false, Chart.Pan.Inertia = false
Mouse-wheel zoom	Now smooth and cursor-anchored	Zoom/toolbar options
Heatmap defaults	Tooltip anchored above the cell, zoom off, y-label thinning	Per-option overrides

Summary

Blazor-ApexCharts 7.0.0 brings the whole ApexCharts v6 feature set to .NET through typed C#. The key-free additions (canvas renderer, streaming, gestures, OS themes, easing, and bar chart race) cover the charting most apps need, and the seven premium modules add a genuine interaction layer (undo/redo, perspectives, crossfilter, ink, measure, context menu, and storyboard) behind an offline key. Add the package, and every one of these is a typed option, method, or event rather than a JavaScript integration.

Try the hosted demo, read the source on GitHub, grab the package on NuGet, or start with the Blazor charts docs. For the charting side of the suite, see What's New in ApexGantt 3.15.0.

Frequently asked questions