Create query for tracking metrics #1150
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
rashidakanchwala
approved these changes
Nov 8, 2022
There was a problem hiding this comment.
Amazing, thanks @jmholzer
we will merge this in a feature branch. I will create one tomorrow and we can merge this in that.
tynandebold
changed the base branch from
main
to
feature/divide-exp-tracking-details-into-tabs
…eate-query-for-tracking-metrics Signed-off-by: Tynan DeBold <thdebold@gmail.com>
…://github.com/kedro-org/kedro-viz into create-query-for-tracking-metrics Signed-off-by: Tynan DeBold <thdebold@gmail.com>
tynandebold
approved these changes
Nov 9, 2022
There was a problem hiding this comment.
The output looks great. Thank you, Jannic!
Note that I've changed the base branch to be this one: feature/divide-exp-tracking-details-into-tabs. That will be the main feature branch of all the metrics plot work we're doing. (cc @rashidakanchwala)
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
…org/kedro-viz into create-query-for-tracking-metrics Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
…ricsDataSet Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com>
| for run_id in dataset: | ||
| runs[run_id] = [] | ||
| for metric in dataset[run_id]: | ||
| metric_name = f"{dataset_name}.{metric}" |
There was a problem hiding this comment.
i think metric_name can be just dataset_name instead of dataset_name.metric
tynandebold
added a commit
that referenced
this pull request
Jan 18, 2023
* Add top-level tabs and logic to switch the content Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Position sticky the tabs for horizontal visibility Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update component comments; small refactor; hide accordion header in Plots tab Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a MetricsPlots component with the chart-types tab system Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Create query for tracking metrics (#1150) * Add MetricPlotType Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricPlotType as a strawberry enum type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add option to limit results for get_all_runs Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add endpoint for metric data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add implementations for formatting metrics data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor run_metrics_data query to return a MetricDataset Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricDataset type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Remove MetricPlotType type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor format_run_metric_data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add run_metrics_data to schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add doc strings Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricDataset to schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add pylint ignore Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Modify runs and metrics initialisation to use .values() Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Remove unused import Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor metric naming not to account for dataset name 'root' Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add end-to-end test for the runMetricsData query Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Rename MetricDataset to MetricPlotDataset to avoid confusion with MetricsDataSet Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Rename MetricDataset to MetricPlotDataset in schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add type hints for runs and metrics in _initialise_metric_data_template Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor return type of runMetricsData query Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Add metric plot data query on front-end (#1176) * Feature/parallel chart (#1152) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Clearer variable naming Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Clearer naming; use real data again Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> * Intergrate time series (#1181) * Time series tooltip (#1192) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * WIP * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * call-yaxis-on-parellel * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * hovering and all * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Add scroll and reposition the charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * css and hovering * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * clean-up * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * now tooltip left * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * connected to real data * tooltip in time series Signed-off-by: huongg <huongg1409@gmail.com> * util func to get position Signed-off-by: huongg <huongg1409@gmail.com> * adjust the left and right gap Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Feature/final touches on metrics plots (#1195) * Raise parallel coordinates plot lines; start on runs list cards active indicators Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update runs-list-card.test.js Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Show matching indicators in runs list cards Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update metric line color, dark theme, par. coords Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Metric axis hover tweaks, par. coords. Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add run selection indicators to run metadata area Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Rearrange order of colors for selected runs on time series Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Metric label shortening and tooltip text lengthening Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Limit the number of runs when displaying metrics plots Signed-off-by: Tynan DeBold <thdebold@gmail.com> * fix for wrong highlight on value and tick Signed-off-by: huongg <huongg1409@gmail.com> * Typo fix and comment improvement Signed-off-by: Tynan DeBold <thdebold@gmail.com> * eliminating all the lines, values, ticks that are not highlighted Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: huongg <huongg1409@gmail.com> * update the right colour code for selectedMarkerColors Signed-off-by: huongg <huongg1409@gmail.com> * Add zoom to timeseries (#1191) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * WIP * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * call-yaxis-on-parellel * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * hovering and all * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Add scroll and reposition the charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * css and hovering * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * clean-up * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * now tooltip left * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * connected to real data * Add zoom to timeseries Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * call zoom on x-axis Signed-off-by: huongg <huongg1409@gmail.com> * Add path on zoom update Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * reference line zoom -WIP * Add dottedLinePath to updateZoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * SelectedLine add to zoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add id to path for selectedLine Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Zoom functionality finally works with all chart elements Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add brush to zoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add transition on xAxis values Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix default position to be above xAxis - selected area Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * fix merge issue * Use selectAll instead of select - brush to be applied on all charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add selectAll to one more place Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * fixes for zoom * Reset zoom when new run is selected Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Clear comments Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Chnaged color and class renamed Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Format the component Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add default value to rangeSelection Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add minified d3 build to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Changed jest transformIgnorePatterns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * change it back as it was jest - transformIgnorePatterns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add d3-brush to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add d3-zoom to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * add all Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * revert last changes Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Repositioned brush Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * bring brush to back so hover functionality works * handle nulls (#1199) * Dynamically set the width of parallel coords plot when there are many metrics Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Demo data with more metrics (#1202) * added more metrics for nicer looking data * Update rf_score.json * Update rf_score.json * Take metric name from end instead of beginning Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Hook up the query again for parallel coordinates Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add spacing to last time series chart Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Feature/parallel coords tests (#1200) * tests use cases Signed-off-by: huongg <huongg1409@gmail.com> * test for graph metrics Signed-off-by: huongg <huongg1409@gmail.com> * create util function to get unique values Signed-off-by: huongg <huongg1409@gmail.com> * test for hover interaction Signed-off-by: huongg <huongg1409@gmail.com> * tests for single and comparison mode run Signed-off-by: huongg <huongg1409@gmail.com> * test for hovering metric Signed-off-by: huongg <huongg1409@gmail.com> * test for showing tooltip Signed-off-by: huongg <huongg1409@gmail.com> * text is highlighted once from the metrics Signed-off-by: huongg <huongg1409@gmail.com> * move setChartWidth and Height to the parents component Signed-off-by: huongg <huongg1409@gmail.com> * include mock selected Runs Signed-off-by: huongg <huongg1409@gmail.com> * set default value to 0 if xScale or yScale returns a NaN Signed-off-by: huongg <huongg1409@gmail.com> * use metricsLimit for the tests Signed-off-by: huongg <huongg1409@gmail.com> * update variable name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update variable names Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * include ignore pattern in the package.json inside test-lib/react-app (#1203) Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> * Use mock data so Mackay can test Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Fix small SCSS warning messages Signed-off-by: Tynan DeBold <thdebold@gmail.com> * fix-color-names * Time series - tests (#1198) * First test case scenarios - wip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * add test for 'renders without crashing' - wip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add tests Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * update tests descriptions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for the tooltip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for 'blend' class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Use mockData for selectedRuns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add variable for hoveredMockValue and update test descriptions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix test scenarios for '--blend' class when hoveredElementId is null Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for ordered selectedGroup Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add default chart width to remove the errors Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Update tests for 'blend' class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Update hovered run line test Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add one more test case for applied blend class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for dblclick event Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Clear code Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Formatted code Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add clipPath for selected zoom area (#1204) * Add clipPath for selected zoom area Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix brush clipPath dimensions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Sorted props Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Improve the Demo Data so it can show a better metric timeline (#1209) * Small refactor and update Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Style update on run comparison to ensure hidden title can't be selected Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove dummy data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove session store before merge Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update release notes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update session store with Rashida's nice examples Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Max metrics to 50; small warning added for runs without plots Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Jannic <37243923+jmholzer@users.noreply.github.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Huong Nguyen <32060364+Huongg@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: huongg <huongg1409@gmail.com> Co-authored-by: Cvetanka Nechevska <88193161+cvetankanechevska@users.noreply.github.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Resolves #1133
Development notes
QA notes
Checklist
RELEASE.mdfile