Untitled

 ngOnChanges(changes: SimpleChanges): void {
    if (changes['data']) {
      const resultArrays = changes['data'].currentValue;
      console.log(resultArrays,"resultArrays");
      
      const seriesData: {
        true: { x: number, y: number }[],
        false: { x: number, y: number }[],
        undefined: { x: number, y: number }[]
    } = {
        true: [],
        false: [],
        undefined: []
    };
    resultArrays.forEach((item:any) => {
        const point = {
            x: new Date(item.Rtc).getTime(),
            y: item.RealTimeValue
        };
        const point1 = {
          x: new Date(item.Rtc).getTime(),
          y: item.SetValue
      };
        seriesData.undefined.push(point1);
        if (item.IsZero === '0') {
            seriesData.true.push(point);
        } else if (item.IsZero === '1') {
            seriesData.false.push(point);
        } 
    });
  

      // Define chart options
      this.chartOptions = {
        title: {
          text: ''
        },
        credits: {
          enabled: false
        },
        chart: {
          type: 'line',
          zoomType: 'x'
        },
        xAxis: [{
          title: {
            text: 'Date Time'
          },
         
         
          type: 'datetime'
        }],
        yAxis: [{
          title: {
            text: ''
          }
        }],
        series: [
          {
            name: 'Zero Value',
            data: seriesData.true,
            color: 'yellow',
            type: 'line'
          },
          {
            name: 'Span Value',
            data: seriesData.false,
            color: 'green',
            type: 'line'
          },
          {
            name: 'Set Value',
            data: seriesData.undefined,
            color: 'blue',
            type: 'line'
          }

        ], exporting: {
          buttons: {
            contextButton: {
              menuItems: [

                "downloadPNG",
                "downloadJPEG",
                "downloadPDF",
                "downloadSVG",

                "downloadCSV",
                "downloadXLS",

                "openInCloud"]
            }
          }
        }
      } as CustomChartOptions;



      // Merge with navigator options
      const chartOptionsWithChart: CustomChartOptions = {
        navigator: {
          enabled: true,
          xAxis: {
            type: 'datetime'
          }
        }
      };

      this.chartOptions = { ...this.chartOptions, ...chartOptionsWithChart };
    }
  }