Skip to content

Home

Jump to bottom
ipax77 edited this page May 22, 2026 · 2 revisions

pax.BlazorChartJs Wiki

pax.BlazorChartJs renders Chart.js charts in Blazor from typed C# configuration objects. Start with a minimal ChartComponent, then add callbacks, plugins, live updates, large-data update paths, events, legends, time axes, or shared defaults as the chart needs them.

Current version: v0.9.0-preview2

The wiki focuses on library features that are demonstrated by the public sample app:

  1. Getting Started - render the README chart with ChartJsConfig, labels, and a dataset.
  2. Callbacks and Plugins - call JavaScript from chart options through ChartJsFunction and register a custom plugin.
  3. Updating Charts - update values, labels, and dataset membership after first render.
  4. Large Data Updates - populate a chart with many points through SetDatasetBinaryData.
  5. Tooltip Callbacks - customize tooltip text, colors, point styles, and external rendering.
  6. Time Charts - register a date adapter and configure a time axis.
  7. Data Labels - configure chart-level and per-dataset datalabels.
  8. Events and HTML Legends - receive Chart.js events in C# and build a legend from LegendComponentBase.
  9. Defaults and Helpers - configure app defaults and use ChartComponent helper APIs.

Samples and source

Reading path

The basic chart page is enough to create a chart in a Blazor component. The advanced pages layer features on top of that model:

  • ChartJsFunction keeps JavaScript callbacks in a registered module while C# selects where they are used.
  • Custom plugins let Chart.js behavior and plugin options extend beyond the built-in wrapper types.
  • Smooth update helpers keep a rendered chart in sync with changing data and dataset lists.
  • Binary dataset updates are useful when the chart data payload is large.
  • Tooltip callbacks and datalabels cover two common presentation layers above dataset values.
  • Time scales need both a typed time axis and a registered Chart.js date adapter.
  • Event flags opt C# handlers into chart, animation, resize, and legend interactions.
  • LegendComponentBase turns generated Chart.js legend items into Blazor markup that can be styled and extended.
  • App defaults and ChartComponent helpers reduce repeated setup around shared charts.

Clone this wiki locally