X-Git-Url: https://gerrit.fd.io/r/gitweb?a=blobdiff_plain;f=resources%2Ftools%2Fdash%2Fapp%2Fpal%2Ftrending%2Flayout.py;h=bd8dd8b240134eae576d9907bfe136d7b97ec9eb;hb=efddc84171ee1335d193bac15644a0419ef8c166;hp=9153081cc35182e08f39078c9d96c283c4a10d37;hpb=dc28d6ba2adc598699a71fc5757f08325840d358;p=csit.git diff --git a/resources/tools/dash/app/pal/trending/layout.py b/resources/tools/dash/app/pal/trending/layout.py index 9153081cc3..bd8dd8b240 100644 --- a/resources/tools/dash/app/pal/trending/layout.py +++ b/resources/tools/dash/app/pal/trending/layout.py @@ -15,7 +15,7 @@ """ -import plotly.graph_objects as go +import pandas as pd from dash import dcc from dash import html @@ -25,16 +25,25 @@ from dash.exceptions import PreventUpdate from yaml import load, FullLoader, YAMLError from datetime import datetime, timedelta -from pprint import pformat - -from .data import read_data +from ..data.data import Data +from .graphs import graph_trending_tput, graph_hdrh_latency class Layout: """ """ - def __init__(self, app, html_layout_file, spec_file, graph_layout_file): + STYLE_HIDEN = {"display": "none"} + STYLE_BLOCK = {"display": "block", "vertical-align": "top"} + STYLE_INLINE ={ + "display": "inline-block", + "vertical-align": "top", + "width": "33%" + } + NO_GRAPH = {"data": [], "layout": {}, "frames": []} + + def __init__(self, app, html_layout_file, spec_file, graph_layout_file, + data_spec_file): """ """ @@ -43,9 +52,20 @@ class Layout: self._html_layout_file = html_layout_file self._spec_file = spec_file self._graph_layout_file = graph_layout_file + self._data_spec_file = data_spec_file # Read the data: - self._data = read_data() + data_mrr = Data( + data_spec_file=self._data_spec_file, + debug=True + ).read_trending_mrr() + + data_ndrpdr = Data( + data_spec_file=self._data_spec_file, + debug=True + ).read_trending_ndrpdr() + + self._data = pd.concat([data_mrr, data_ndrpdr], ignore_index=True) # Read from files: self._html_layout = "" @@ -105,6 +125,10 @@ class Layout: def data(self): return self._data + @property + def layout(self): + return self._graph_layout + def add_content(self): """ """ @@ -154,15 +178,61 @@ class Layout: id="loading-graph", children=[ dcc.Graph( - id="graph" + id="graph-tput", + style=self.STYLE_HIDEN + ), + dcc.Graph( + id="graph-latency", + style=self.STYLE_HIDEN ) ], type="circle" + ), + html.Div( + children=[ + html.Div( + id="div-tput-metadata", + children=[ + dcc.Markdown("**Throughput**"), + html.Pre( + id="tput-metadata", + children="Click on data points in the graph" + ) + ], + style=self.STYLE_HIDEN + ), + html.Div( + id="div-latency-metadata", + children=[ + dcc.Markdown("**Latency**"), + html.Pre( + id="latency-metadata", + children="Click on data points in the graph" + ) + ], + style=self.STYLE_HIDEN + ), + html.Div( + id="div-latency-hdrh", + children=[ + dcc.Loading( + id="loading-hdrh-latency-graph", + children=[ + dcc.Graph( + id="graph-latency-hdrh" + ) + ], + type="circle" + ) + ], + style=self.STYLE_HIDEN + ) + ] ) ], style={ "vertical-align": "top", - "display": "none", + "display": "inline-block", "width": "80%", "padding": "5px" } @@ -195,9 +265,6 @@ class Layout: ) ] ), - # Debug output, TODO: Remove - html.H5("Debug output"), - html.Pre(id="div-ctrl-info") ] ) @@ -289,11 +356,12 @@ class Layout: html.Br(), dcc.DatePickerRange( id="dpr-period", - min_date_allowed=datetime(2021, 1, 1), + min_date_allowed=datetime.utcnow() - timedelta(days=180), max_date_allowed=datetime.utcnow(), initial_visible_month=datetime.utcnow(), start_date=datetime.utcnow() - timedelta(days=180), - end_date=datetime.utcnow() + end_date=datetime.utcnow(), + display_format="D MMMM YY" ) ] ) @@ -445,14 +513,17 @@ class Layout: return _sync_checklists(opt, sel, all, "cl-ctrl-testtype") @app.callback( - Output("graph", "figure"), - Output("div-ctrl-info", "children"), # Debug output TODO: Remove + Output("graph-tput", "figure"), + Output("graph-tput", "style"), + Output("div-tput-metadata", "style"), + Output("graph-latency", "figure"), + Output("graph-latency", "style"), + Output("div-latency-metadata", "style"), Output("selected-tests", "data"), # Store Output("cl-selected", "options"), # User selection Output("dd-ctrl-phy", "value"), Output("dd-ctrl-area", "value"), Output("dd-ctrl-test", "value"), - Output("div-plotting-area", "style"), State("selected-tests", "data"), # Store State("cl-selected", "value"), State("dd-ctrl-phy", "value"), @@ -486,29 +557,51 @@ class Layout: else: return list() + class RetunValue: + def __init__(self) -> None: + self._output = { + "graph-tput-figure": no_update, + "graph-tput-style": no_update, + "div-tput-metadata-style": no_update, + "graph-lat-figure": no_update, + "graph-lat-style": no_update, + "div-lat-metadata-style": no_update, + "selected-tests-data": no_update, + "cl-selected-options": no_update, + "dd-ctrl-phy-value": no_update, + "dd-ctrl-area-value": no_update, + "dd-ctrl-test-value": no_update, + } + + def value(self): + return tuple(self._output.values()) + + def set_values(self, kwargs: dict) -> None: + for key, val in kwargs.items(): + if key in self._output: + self._output[key] = val + else: + raise KeyError(f"The key {key} is not defined.") + + trigger_id = callback_context.triggered[0]["prop_id"].split(".")[0] - d_start = datetime( - int(d_start[0:4]), int(d_start[5:7]), int(d_start[8:10]) - ) - d_end = datetime( - int(d_end[0:4]), int(d_end[5:7]), int(d_end[8:10]) - ) + d_start = datetime(int(d_start[0:4]), int(d_start[5:7]), + int(d_start[8:10])) + d_end = datetime(int(d_end[0:4]), int(d_end[5:7]), int(d_end[8:10])) + + output = RetunValue() if trigger_id == "btn-ctrl-add": # Add selected test to the list of tests in store: if phy and area and test and cores and framesizes and testtypes: - - # TODO: Add validation - if store_sel is None: store_sel = list() - for core in cores: for framesize in framesizes: for ttype in testtypes: tid = ( - f"{phy}-" + f"{phy.replace('af_xdp', 'af-xdp')}-" f"{area}-" f"{framesize.lower()}-" f"{core.lower()}-" @@ -525,13 +618,32 @@ class Layout: "core": core.lower(), "testtype": ttype.lower() }) - return (no_update, no_update, store_sel, _list_tests(), None, - None, None, no_update) + output.set_values({ + "selected-tests-data": store_sel, + "cl-selected-options": _list_tests(), + "dd-ctrl-phy-value": None, + "dd-ctrl-area-value": None, + "dd-ctrl-test-value": None, + }) elif trigger_id in ("btn-sel-display", "dpr-period"): - fig, style = _update_graph(store_sel, d_start, d_end) - return (fig, pformat(store_sel), no_update, no_update, - no_update, no_update, no_update, style) + fig_tput, fig_lat = graph_trending_tput( + self.data, store_sel, self.layout, d_start, d_end + ) + output.set_values({ + "graph-tput-figure": \ + fig_tput if fig_tput else self.NO_GRAPH, + "graph-tput-style": \ + self.STYLE_BLOCK if fig_tput else self.STYLE_HIDEN, + "div-tput-metadata-style": \ + self.STYLE_INLINE if fig_tput else self.STYLE_HIDEN, + "graph-lat-figure": \ + fig_lat if fig_lat else self.NO_GRAPH, + "graph-lat-style": \ + self.STYLE_BLOCK if fig_lat else self.STYLE_HIDEN, + "div-lat-metadata-style": \ + self.STYLE_INLINE if fig_lat else self.STYLE_HIDEN + }) elif trigger_id == "btn-sel-remove": if list_sel: @@ -540,91 +652,65 @@ class Layout: if item["id"] not in list_sel: new_store_sel.append(item) store_sel = new_store_sel - fig, style = _update_graph(store_sel, d_start, d_end) - return (fig, pformat(store_sel), store_sel, _list_tests(), - no_update, no_update, no_update, style) - - def _update_graph(sel, start, end): - """ - """ - - if not sel: - return no_update, no_update - - def _is_selected(label, sel): - for itm in sel: - phy = itm["phy"].split("-") - if len(phy) == 4: - topo, arch, nic, drv = phy - else: - continue - if nic not in label: - continue - if drv != "dpdk" and drv not in label: - continue - if itm["test"] not in label: - continue - if itm["framesize"] not in label: - continue - if itm["core"] not in label: - continue - if itm["testtype"] not in label: - continue - return ( - f"{itm['phy']}-{itm['framesize']}-{itm['core']}-" - f"{itm['test']}-{itm['testtype']}" + if store_sel: + fig_tput, fig_lat = graph_trending_tput( + self.data, store_sel, self.layout, d_start, d_end ) + output.set_values({ + "graph-tput-figure": \ + fig_tput if fig_tput else self.NO_GRAPH, + "graph-tput-style": \ + self.STYLE_BLOCK if fig_tput else self.STYLE_HIDEN, + "div-tput-metadata-style": \ + self.STYLE_INLINE if fig_tput else self.STYLE_HIDEN, + "graph-lat-figure": \ + fig_lat if fig_lat else self.NO_GRAPH, + "graph-lat-style": \ + self.STYLE_BLOCK if fig_lat else self.STYLE_HIDEN, + "div-lat-metadata-style": \ + self.STYLE_INLINE if fig_lat else self.STYLE_HIDEN, + "selected-tests-data": store_sel, + "cl-selected-options": _list_tests() + }) else: - return None - - style={ - "vertical-align": "top", - "display": "inline-block", - "width": "80%", - "padding": "5px" - } + output.set_values({ + "graph-tput-figure": self.NO_GRAPH, + "graph-tput-style": self.STYLE_HIDEN, + "div-tput-metadata-style": self.STYLE_HIDEN, + "graph-lat-figure": self.NO_GRAPH, + "graph-lat-style": self.STYLE_HIDEN, + "div-lat-metadata-style": self.STYLE_HIDEN, + "selected-tests-data": store_sel, + "cl-selected-options": _list_tests() + }) + + return output.value() - fig = go.Figure() - dates = self.data.iloc[[0], 1:].values.flatten().tolist()[::-1] - x_data = [ - datetime( - int(date[0:4]), int(date[4:6]), int(date[6:8]), - int(date[9:11]), int(date[12:]) - ) for date in dates - ] - x_data_range = [ - date for date in x_data if date >= start and date <= end - ] - vpp = self.data.iloc[[1], 1:].values.flatten().tolist()[::-1] - csit = list(self.data.columns[1:])[::-1] - labels = list(self.data["Build Number:"][3:]) - for i in range(3, len(self.data)): - name = _is_selected(labels[i-3], sel) - if not name: - continue - y_data = [ - float(v) / 1e6 for v in \ - self.data.iloc[[i], 1:].values.flatten().tolist()[::-1] - ] - hover_txt = list() - for x_idx, x_itm in enumerate(x_data): - hover_txt.append( - f"date: {x_itm}
" - f"average [Mpps]: {y_data[x_idx]}
" - f"vpp-ref: {vpp[x_idx]}
" - f"csit-ref: {csit[x_idx]}" - ) - fig.add_trace( - go.Scatter( - x=x_data_range, - y= y_data, - name=name, - mode="markers+lines", - text=hover_txt, - hoverinfo=u"text+name" - ) - ) - layout = self._graph_layout.get("plot-trending", dict()) - fig.update_layout(layout) + @app.callback( + Output("tput-metadata", "children"), + Input("graph-tput", "clickData") + ) + def _show_tput_metadata(hover_data): + if not hover_data: + raise PreventUpdate + return hover_data["points"][0]["text"].replace("
", "\n"), - return fig, style + @app.callback( + Output("latency-metadata", "children"), + Output("graph-latency-hdrh", "figure"), + Output("div-latency-hdrh", "style"), + Input("graph-latency", "clickData") + ) + def _show_latency_metadata(hover_data): + if not hover_data: + raise PreventUpdate + graph = graph_hdrh_latency( + hover_data["points"][0]["customdata"], self.layout + ) + if not graph: + graph = no_update + return ( + hover_data["points"][0]["text"].replace("
", "\n"), + graph, + self.STYLE_INLINE if graph else self.STYLE_HIDEN + )