Skip to content

Add JavaScript function references and typed tick number format - #45

Merged
gvreddy04 merged 1 commit into
mainfrom
features/26110205-js-callback-functions
Nov 10, 2026
Merged

gvreddy04 merged 1 commit into
mainfrom
features/26110205-js-callback-functions

Conversation

@gvreddy04

Copy link
Copy Markdown
Collaborator

Chart.js options that take a JavaScript function can now be set from C#. The app registers each function by name in its own JavaScript file, and C# references it with ChartFunction. Only registered functions resolve: a name is never evaluated as code, and globals such as window.open or fetch can't be reached by name.

  • blazorexpress.chartjs.registerFunction(name, fn) registers a function; new ChartFunction("name") references it. References are resolved on create, on every update and when a dataset is added.
  • An unregistered name logs one console error naming the function and the option, and the option keeps its Chart.js default. A function that throws is logged once and the chart keeps drawing.
  • Function options: ChartAxesTicks.Callback; the 14 tooltip callbacks, External, Filter and ItemSort; legend OnClick, OnHover, OnLeave and labels Filter, Sort and GenerateLabels; datalabels Formatter, chart-wide and per dataset; ChartAnimation.OnProgress and OnComplete; ChartOptions OnClick, OnHover and OnResize.
  • A legend OnClick function replaces Chart.js's default toggle, as in Chart.js. The library still keeps the visibility the click changed across UpdateAsync and still raises OnLegendClick.
  • Colour properties on every dataset gain a ...Function sibling (for example BackgroundColorFunction), sent instead of the value when set; line and radar also get point colour functions. A function can return a canvas gradient.
  • LineChartDataset.SegmentStyle (ChartLineSegment) styles line segments with values or functions; Segment stays as it is.
  • ChartAxesTicks.Format (ChartNumberFormat) formats linear, logarithmic and radial axis labels as currency, percent or compact numbers with no JavaScript. The tooltip value uses the same format.
  • The library's datalabels background now works with a function colour.
  • Existing properties, defaults and their JSON are unchanged.

Adds six demos (currency ticks, tick and tooltip functions, legend filter, legend click function, segment styling, gradient fill), a "JavaScript functions" getting-started section, docs tables, an unlisted /demos/js-functions-self-check page that checks 44 cases on live charts, and JSON tests.

Chart.js options that take a JavaScript function can now be set from C#.
The app registers each function by name in its own JavaScript file, and
C# references it with ChartFunction. Only registered functions resolve:
a name is never evaluated as code, and globals such as window.open or
fetch can't be reached by name.

- blazorexpress.chartjs.registerFunction(name, fn) registers a function;
  new ChartFunction("name") references it. References are resolved on
  create, on every update and when a dataset is added.
- An unregistered name logs one console error naming the function and
  the option, and the option keeps its Chart.js default. A function that
  throws is logged once and the chart keeps drawing.
- Function options: ChartAxesTicks.Callback; the 14 tooltip callbacks,
  External, Filter and ItemSort; legend OnClick, OnHover, OnLeave and
  labels Filter, Sort and GenerateLabels; datalabels Formatter, chart-wide
  and per dataset; ChartAnimation.OnProgress and OnComplete; ChartOptions
  OnClick, OnHover and OnResize.
- A legend OnClick function replaces Chart.js's default toggle, as in
  Chart.js. The library still keeps the visibility the click changed
  across UpdateAsync and still raises OnLegendClick.
- Colour properties on every dataset gain a ...Function sibling (for
  example BackgroundColorFunction), sent instead of the value when set;
  line and radar also get point colour functions. A function can return
  a canvas gradient.
- LineChartDataset.SegmentStyle (ChartLineSegment) styles line segments
  with values or functions; Segment stays as it is.
- ChartAxesTicks.Format (ChartNumberFormat) formats linear, logarithmic
  and radial axis labels as currency, percent or compact numbers with no
  JavaScript. The tooltip value uses the same format.
- The library's datalabels background now works with a function colour.
- Existing properties, defaults and their JSON are unchanged.

Adds six demos (currency ticks, tick and tooltip functions, legend
filter, legend click function, segment styling, gradient fill), a
"JavaScript functions" getting-started section, docs tables, an unlisted
/demos/js-functions-self-check page that checks 44 cases on live charts,
and JSON tests.
@gvreddy04 gvreddy04 added this to the 1.3.0 milestone Nov 10, 2026
@gvreddy04 gvreddy04 self-assigned this Nov 10, 2026
@gvreddy04
gvreddy04 merged commit b877743 into main Nov 10, 2026
1 of 2 checks passed
@gvreddy04
gvreddy04 deleted the features/26110205-js-callback-functions branch November 10, 2026 16:55
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant