From a483dbbe64c7c7f7ac0b1b3a9e5958957eb7b474 Mon Sep 17 00:00:00 2001 From: Ludek Novy <13610612+ludeknovy@users.noreply.github.com> Date: Wed, 25 Jan 2023 09:05:16 +0100 Subject: [PATCH] Fix: changing chart on aggregation change (#302) --- .../label-chart/label-chart.component.ts | 38 ++++++++++++------- 1 file changed, 24 insertions(+), 14 deletions(-) diff --git a/src/app/item-detail/label-chart/label-chart.component.ts b/src/app/item-detail/label-chart/label-chart.component.ts index b83b3eba..adc9b976 100644 --- a/src/app/item-detail/label-chart/label-chart.component.ts +++ b/src/app/item-detail/label-chart/label-chart.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnChanges, OnInit, SimpleChanges } from "@angular/core"; +import { Component, Input, OnChanges, SimpleChanges } from "@angular/core"; import * as Highcharts from "highcharts"; import { commonGraphSettings } from "src/app/graphs/item-detail"; import * as deepmerge from "deepmerge"; @@ -10,7 +10,7 @@ import { Metrics } from "../metrics"; templateUrl: "./label-chart.component.html", styleUrls: ["./label-chart.component.css", "../item-detail.component.scss"] }) -export class LabelChartComponent implements OnInit, OnChanges { +export class LabelChartComponent implements OnChanges { @Input() chartLines: ChartLine; @Input() label: string; @@ -25,6 +25,7 @@ export class LabelChartComponent implements OnInit, OnChanges { chart: Highcharts.Chart; chartCallback; labelCharts = new Map(); + expanded = false private responseTimeMetricGroup: string[]; metricChartMap = new Map([ @@ -47,7 +48,27 @@ export class LabelChartComponent implements OnInit, OnChanges { Metrics.ResponseTimeMax, Metrics.ResponseTimeP95, Metrics.ResponseTimeP99]; } - ngOnInit() { + + ngOnChanges(changes: SimpleChanges) { + + // chart expanded + if (!changes.activated?.previousValue && changes.activated?.currentValue) { + this.setChartAggregation() + this.getChartsKey(); + this.changeChart({ target: { innerText: this.chartMetric } }); + this.chart.reflow(); + this.expanded = true + } + // aggregation changed, we need to refresh the data but only for opened charts + if (changes.chartLines?.currentValue && this.expanded) { + this.chartLines = changes.chartLines.currentValue + this.setChartAggregation() + this.changeChart({ target: { innerText: this.chartMetric } }); + } + + } + + private setChartAggregation() { const threadLine = this.chartLines.overall.get(Metrics.Threads); const availableMetrics = Array.from(this.chartLines.labels.keys()); const responseTimesSeries = []; @@ -61,17 +82,6 @@ export class LabelChartComponent implements OnInit, OnChanges { } }); this.labelCharts.set("Response Times", { ...commonGraphSettings("ms"), series: [...responseTimesSeries, threadLine] }); - this.labelChartOptions = commonGraphSettings("ms"); - this.updateLabelChartFlag = true; - this.getChartsKey(); - - } - - ngOnChanges(changes: SimpleChanges) { - if (changes.activated.currentValue) { - this.changeChart({ target: { innerText: this.chartMetric } }); - this.chart.reflow(); - } }