Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.27k stars 530 forks source link

[Bug]: Chart: ChartOptions.Interactions broken #5564

Closed technyon closed 3 months ago

technyon commented 3 months ago

Blazorise Version

1.5.3

What Blazorise provider are you running on?

None

Link to minimal reproduction or a simple code snippet

<LineChart TItem="..." Options="chartOptions">

...

private LineChartOptions chartOptions = new LineChartOptions()
    {
        Interactions = new ChartInteractions()
        {
            Intersect = false
        },
    };

Steps to reproduce

What is expected?

Settings from the Interactions property should be applied

What is actually happening?

I wanted to have tooltips for a streaming chart. I noticed they only appear when hovering a data point and not the lines, which is quite annoying in a scrolling chart. After some digging, I found out that setting Intersect to false should fix it, but it didn't. The official examples work though.

Further testing confirmed that enabling Intersect via "OptionsObject" works, but not via "Options". The reason most likely is a type in the ChartOptions class: The property is called Interactions, but Interaction is correct.

I was able to find a workaround by inheriting from ChartOptions and adding the Interaction property (without s at the end) in my inherited class:

    public class MyLineChartOptions : LineChartOptions
    {
        [JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
        public ChartInteractions Interaction { get; set; }
    }

This should be fixed though in the Blazorise code, either by renaming the property or by setting json serialization options tso that the property is serialized into the correct name.

What browsers do you see the problem on?

Chrome, Microsoft Edge

Any additional comments?

No response

stsrki commented 3 months ago

Thank you for reporting and finding the solution. It should be an easy fix.