fix: filter empty series data (#89)

Co-authored-by: Raj Jaiswal <[email protected]>

Author: ryugaraj

src/core/chart-api/chart-extra-context.tsx

@@ -5,6 +5,7 @@ import type Highcharts from "highcharts";
 
 import { NonCancelableEventHandler } from "../../internal/events";
 import { getChartSeries } from "../../internal/utils/chart-series";
+import { getSeriesData } from "../../internal/utils/series-data";
 import { ChartLabels } from "../i18n-utils";
 import { CoreChartProps, Rect } from "../interfaces";
 import { getGroupRect, isSeriesStacked } from "../utils";
@@ -99,13 +100,13 @@ function computeDerivedState(chart: Highcharts.Chart): ChartExtraContext.Derived
   for (const s of getChartSeries(chart.series)) {
     const seriesX = new Set<number>();
     if (s.visible) {
-      for (const d of s.data) {
+      for (const d of getSeriesData(s.data)) {
         // Points with y=null represent the absence of value, there is no need to include them and those
         // should have no impact on computed rects or navigation.
 
         // Although "d" can't be undefined according to Highcharts API, it does become undefined for chart containing more datapoints
         // than the cropThreshold for that series (specific cases of re-rendering the chart with updated options listening to setExteme updates)
-        if (d && d.visible && d.y !== null) {
+        if (d.visible && d.y !== null) {
           seriesX.add(d.x);
           allXSet.add(d.x);
           addPoint(d);

src/core/chart-api/chart-extra-highlight.ts

@@ -4,6 +4,7 @@
 import type Highcharts from "highcharts";
 
 import * as Styles from "../../internal/chart-styles";
+import { getSeriesData } from "../../internal/utils/series-data";
 import { getPointId, getSeriesId } from "../utils";
 import { ChartExtraContext } from "./chart-extra-context";
 
@@ -140,7 +141,7 @@ export class ChartExtraHighlight {
       if (prevState === "inactive") {
         inactiveSeriesIds.add(getSeriesId(s));
       }
-      for (const p of s.data) {
+      for (const p of getSeriesData(s.data)) {
         const prevState = this.pointState.get(getSeriesId(s))?.get(this.getPointKey(p));
         if (prevState) {
           this.setPointState(p, prevState);
@@ -183,7 +184,7 @@ export class ChartExtraHighlight {
         (overridden as SeriesSetStateWithLock)[SET_STATE_LOCK] = true;
         s.setState = overridden;
       }
-      for (const d of s.data) {
+      for (const d of getSeriesData(s.data)) {
         if ((d.setState as PointSetStateWithLock)[SET_STATE_LOCK] === undefined) {
           const original = d.setState;
           // The overridden setState method does nothing unless setState[SET_STATE_LOCK] === false.

src/core/chart-api/index.tsx

@@ -7,6 +7,7 @@ import type Highcharts from "highcharts";
 import { fireNonCancelableEvent } from "../../internal/events";
 import { ReadonlyAsyncStore } from "../../internal/utils/async-store";
 import { getChartSeries } from "../../internal/utils/chart-series";
+import { getSeriesData } from "../../internal/utils/series-data";
 import { Writeable } from "../../internal/utils/utils";
 import {
   getChartAccessibleDescription,
@@ -307,14 +308,15 @@ export class ChartAPI {
   private showMarkersForIsolatedPoints() {
     let shouldRedraw = false;
     for (const s of this.context.chart().series) {
-      for (let i = 0; i < s.data.length; i++) {
-        const isEligibleSeries = !isXThreshold(s) && s.type !== "scatter" && !s.data[i].options.marker?.enabled;
+      const seriesData = getSeriesData(s.data);
+      for (let i = 0; i < seriesData.length; i++) {
+        const isEligibleSeries = !isXThreshold(s) && s.type !== "scatter" && !seriesData[i].options.marker?.enabled;
         if (
           isEligibleSeries &&
-          (s.data[i - 1]?.y === undefined || s.data[i - 1]?.y === null) &&
-          (s.data[i + 1]?.y === undefined || s.data[i + 1]?.y === null)
+          (seriesData[i - 1]?.y === undefined || seriesData[i - 1]?.y === null) &&
+          (seriesData[i + 1]?.y === undefined || seriesData[i + 1]?.y === null)
         ) {
-          s.data[i].update({ marker: { enabled: true } }, false);
+          seriesData[i].update({ marker: { enabled: true } }, false);
           shouldRedraw = true;
         }
       }

src/internal/utils/series-data.ts

@@ -0,0 +1,10 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+
+import type { Point } from "highcharts";
+
+// Although series data can't be undefined according to Highcharts API, it does become undefined for chart containing more datapoints
+// than the cropThreshold for that series (specific cases of re-rendering the chart with updated options listening to setExteme updates)
+export const getSeriesData = (data: Array<Point>): Array<Point> => {
+  return data.filter((d) => !!d);
+};