mariusmuntean / ChartJs.Blazor

Brings Chart.js charts to Blazor
https://www.iheartblazor.com/
MIT License
692 stars 152 forks source link

Using .Net Core 3.0 "version". no update when updating dataset from timer #38

Closed guz-crypto closed 4 years ago

guz-crypto commented 5 years ago

Hi,

First of all, thanks for your amazing job.

I'm trying to use your library starting from sample.

If I use a button to add values to datasets the chart is updated, but if I update the dataset from a callback (timer) the update of the chart does not work until I call StateHasChanged() but I lost the "context" of the chart.

Could you help me about his ?

Regards

Joelius300 commented 5 years ago

Thanks, I'm glad you like it :)

If I use a button to add values to datasets the chart is updated, but if I update the dataset from a callback (timer) the update of the chart does not work until I call StateHasChanged()

This is expected blazor behaviour (e.g. see this (fairly old) issue). Using StateHasChanged() there is the correct approach.

but I lost the "context" of the chart.

I'm sorry but I don't quite understand what you mean by that. What is the "context"? What consequences of loosing "context" could you observe?

guz-crypto commented 5 years ago

Hi,

Concerning StateHasChanged() I found it but thanks for the answer (I'm starting using Blazor ;)).

Concerning the "context" I saw that I got the same thing with your sample.

If I decided to hide a set of sata on a multi lines chart. Calling StateHasChanged() or adding some data (with the button), reset the hided data.

How can I get a auto updated chart without losing the hided datas ?

Regards,

Joelius300 commented 5 years ago

Your issue made me realize two things.

First of all, we should've included the call to StateHasChanged in ChartBase::Update since we know the state will have changed. There's no advantage to leaving this up to the parent component.

And then there's also a nasty bug I don't quite know how to fix currently.
As you have found out yourself, any hidden datasets will be shown again if you update the chart. If you start a dataset off as hidden, it will be hidden again on update.
This is quite an obvious issue if you think about it. The field Hidden will be serialized and show or hide the dataset (override hidden) on update no matter what the current value (on js-side) is. The c# value for Hidden won't change during runtime when it's changed in js of course.

I don't really know how to fix this currently.
One way would be to try to deserialize the js-value and read it from there.
Another way would be to loop through the datasets received in the js-update function and set the enabled field to its current value. This would require a way of identifying the datasets, probably with a readonly id-field and a good ol' GUID-string.

EDIT: This third option below was my favourite but it won't work, the hidden field will just be undefined and the true value is still lost :/ One more option would be to make it a nullable field and set it to null in the c#-update function in order to not include it in the serialized dataset. This solution could be great in case there are other values that are frequently changed on js-side (if there are any; Tell me if you know some) since this could be done using a c#-attribute to set the value to null on update and is thus easily scalable.

I'm open to ideas and suggestions :)

Now to answer the question how you can get the expected behaviour. I think the easiest way to fix it on the current version is to implement the second solution and do it by index (since there's no id). You can copy the current js, adjust it and reference it manually.
Quite a bodge but if you need it right now it's probably the easiest way.

Joelius300 commented 5 years ago

I'd like to appologize. Since I'm watching this repository I received an email about this issue and mistook it as one in my own library.

I think the things I explained still apply but I'm very sorry about the misunderstanding. Of course I also don't take credit for this library.

Joelius300 commented 4 years ago

I'm adding this to the backlog since we need to investigate this issue and think about a possible solution for allowing the hidden flag to stay the same even after updating the chart.

mariusmuntean commented 4 years ago

I suppose the safest way would be to map the Js-side chart config to the C# config object. What concerns me there is a possible performance hit, which would occur exactly when the user interacts with the chart.

A simpler solution is to register callbacks for most chart interactions and have the C#-side notified about them. In the latest release I re-introduced C# click/hover handlers. The same mechanism could be used to register a C# callback for showing/hiding a dataset. That way the C# config could be kept in sync with the js-side config.

Joelius300 commented 4 years ago

Am I correct that this is fixed in the latest (actually the one before that) release?

Could you test it again @guz-crypto?

Joelius300 commented 4 years ago

This is no longer relevant as the config objects are now merged and the Hidden flags shouldn't be used anymore. Those Hidden properties are removed in #112 so the issue will be closed when that's merged.