CODEWITHSUNDEEP
angularhighcharts
BHL
BHL

Reputation: 188

Highcharts area-spline fill gradient possibly undefined error

So I'm working with highcharts on angular 12 and trying to fill the area spline color with a gradient and I'm getting this error any idea how to solve this or what I could possibly be doing wrong ?

Any help would be appreciated ,Thanks in advance

enter image description here

enter image description here

Upvotes: 1

Views: 458

Answers (2)

Sebastian Wędzel
Sebastian Wędzel

Reputation: 11633

I tried to reproduce your issue and it seems fine: https://stackblitz.com/edit/highcharts-angular-basic-line-vauauu

Upvotes: 0

christoph
christoph

Reputation: 1051

What you see here is the beauty of TypeScript as it warns you during compile time that one part of your chain could return undefined and therefore lead to an error that aborts your script.

Use a guard clause to show the compiler you checked for undefined values.

if (!Highcharts?.getOptions()?.colors) {
  return;
}

// ... here comes your code
// the compiler will no longer show errors

Or make sure to have a proper default value, like this:

let color = '#615E9B';
if (Highcharts?.getOptions()?.colors) {
  color = Highcharts.getOptions().colors[0];
}

// Your code, but use color variable instead of Highcharts.getOptions().colors[0]

That is also possible inline, but hard to read and to maintain. I would suggest you to stick to few more lines of code that are easy to understand.

Upvotes: 1

Related Questions