Chart: add support for Line Annotations plugin

[tupx333]

Is your feature request related to a problem? Please describe. I am trying to do https://www.chartjs.org/chartjs-plugin-annotation/guide/types/line.html#configuration how can i do it

[stsrki]

As far as I see it, chartjs-plugin-annotation is a custom plugin for chartjs. Usage seems like all you need to do is add some options https://www.chartjs.org/chartjs-plugin-annotation/guide/usage.html

Here is the same example with using the OptionsObject for serializing the JSON options.

<LineChart @ref="lineChart" TItem="double" OptionsObject="@options" />

@code{
    object options = new
    {
        Plugins = new
        {
            Autocolors = false,
            Annotation = new
            {
                Annotations = new
                {
                    Box1 = new
                    {
                        Type = "box",
                        XMin = 1,
                        XMax = 2,
                        YMin = 50,
                        YMax = 70,
                        BackgroundColor = "rgba(255, 99, 132, 0.25)"
                    }
                }
            }
        }
    };
}

[tupx333]

I follow the your example but it not work i use annotation v0.5.7 and blazorise 0.9.2.5

[stsrki]

I think it is missing plugin registration, but I can't find a way to make it work in the browser

https://www.chartjs.org/chartjs-plugin-annotation/guide/integration.html#bundlers-webpack-rollup-etc

[stsrki]

https://www.chartjs.org/chartjs-plugin-annotation/latest/guide/types/line.html#configuration