ILoveCoding1100
Posts: 2
Joined: Thu Aug 11, 2022 8:55 am

Update Chat Options (Highcharts-Angular)

Hi,

What is the preferred way to perform an update on the chart option object? As far as I understand highcharts there are (at least) two ways:

Suppose you have an config object:
config: Options = {
chart: {...
};

(1) manipulate the config object and use
[(update)]="updateFlag"
to update the chart.
Example: https://stackblitz.com/edit/highcharts ... onent.ts

(2) use immutable objects
Don't manipulate the config object but create a new one. In this case [(update)]="updateFlag" is not necessary. Right?

Is there preferred way? Or are there any better ways?
hubert.k
Posts: 1164
Joined: Mon Apr 11, 2022 11:48 am

Re: Update Chat Options (Highcharts-Angular)

Hi ILoveCoding1100!
Welcome to our forum and thanks for contacting us with your question!

The best way is setting updateFlag = true. It is a boolean to trigger an update on a chart as Angular is not detecting nested changes in an object passed to a component. You can check the simple demo below.

Docs: https://github.com/highcharts/highchart ... ns-details

Feel free to ask any further questions.
Regards!
Hubert Kozik
Highcharts Developer
ILoveCoding1100
Posts: 2
Joined: Thu Aug 11, 2022 8:55 am

Re: Update Chat Options (Highcharts-Angular)

Thank you for your feedback.

I'm the updateFlag is not necessary if I create every time a new options object, right?
hubert.k
Posts: 1164
Joined: Mon Apr 11, 2022 11:48 am

Re: Update Chat Options (Highcharts-Angular)

ILoveCoding1100,

Theoretically, it is possible to create a new object, but it must concern the change of options (changes.options) - code: https://github.com/highcharts/highchart ... ts#L27-L35

updateFlag is used to force these changes and update. I am not fully sure, how would you like to do immutable object change and I cannot reproduce it, but theoretically this flag is not necessary.

Regards!
Hubert Kozik
Highcharts Developer

Return to “Highcharts Usage”