LinearCartesianTicks Callback

[Shashmeer]

Hi,
I'm having trouble getting my tick callback method to fire in my server-side app
My testing so far has been on a stacked bar chart
Here is my code, the callback does not get called, and the format of the ticks of the chart stay as the default

private BarConfig _config;
protected override void OnInitialized()
{
    _config = new BarConfig
    {
        Options = new BarOptions
        {
            Scales = new BarScales
            {
                XAxes = new List<CartesianAxis>
		{
                    new BarCategoryAxis
                    {
                        Stacked = true,
                    },
                },
                YAxes = new List<CartesianAxis>
		{
                    new BarLinearCartesianAxis
                    {
                        Stacked = true,
                        Ticks = new LinearCartesianTicks()
                        {
                            FontSize = 16,
                            Callback = new DelegateHandler<AxisTickCallback>(YTickCallback)
                        }
                    }
                }
            }
        }
    };
}

private string YTickCallback(JValue value, int index, JArray values)
{
    return $"{value:C2}";
}

[Joelius300]

You're correct. Although this code is fine and will work on client-side Blazor (tested), callbacks with return value not supported on server-side Blazor.

If you open the developer tools of your browser, you should see a console message like this:

In order to achieve the result you want, you'll have to write a JavaScript method and attach it with a JavaScriptHandler. Check the XML-docs by hovering over the types and properties. If you need help with JavaScriptHandler, you can comment below and I'll try to give you instructions.

The underlying problem here is well known and documented under #90 so I'll close your issue. If you have any ideas on how to solve this issue, comment on #90. Thanks!

[Shashmeer]

Thank you for your prompt reply, and your work on this library!

Ok, I've created a JavaScript file, and referenced it properly in _Hosts.cshtml (I've tested to make sure the reference is working). In it, there's a function called yTickCallback using the callback from here: https://www.chartjs.org/docs/latest/axes/labelling.html

function yTickCallback(value, index, values) {
    return '$' + value;
}

And I've changed the relevant chart config code to:

Ticks = new LinearCartesianTicks()
{
    FontSize = 20,
    Callback = new JavaScriptHandler<AxisTickCallback>("yTickCallback")
}

However it doesn't appear to have an effect on the chart, and I'm not getting any errors in the console. Any ideas?

---EDIT---
I got it working by simply putting the js function into a namespace:

var customJsFunctions= {

    yTickCallback: function (value, index, values) {
        return '$' + value;
    }
}

And defining the callback with the namespace:

Ticks = new LinearCartesianTicks()
{
    FontSize = 20,
    Callback = new JavaScriptHandler<AxisTickCallback>("customJsFunctions.yTickCallback")
}

[Joelius300]

Perfect, I'm glad you got it working. If you have any other questions just open a new issue :)