[ML] Fix issues with watching the scope of single metric viewer data. (#19029)

This fixes a bug with the single metric viewer not updating correctly and not showing anomaly records.
This commit is contained in:
Walter Rafelsberger 2018-05-16 10:05:01 +02:00 committed by GitHub
parent 6811044f9d
commit 95e14bdebc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -344,6 +344,12 @@ module.controller('MlTimeSeriesExplorerController', function (
// Counter to keep track of what data sets have been loaded.
let awaitingCount = 3;
// This object is used to store the results of individual remote requests
// before we transform it into the final data and apply it to $scope. Otherwise
// we might trigger multiple $digest cycles and depending on how deep $watches
// listen for changes we could miss updates.
const refreshFocusData = {};
// finish() function, called after each data set has been loaded and processed.
// The last one to call it will trigger the page render.
function finish() {
@ -351,17 +357,18 @@ module.controller('MlTimeSeriesExplorerController', function (
if (awaitingCount === 0) {
// Tell the results container directives to render the focus chart.
// Need to use $timeout to ensure the broadcast happens after the child scope is updated with the new data.
let updatedFocusChartData = processDataForFocusAnomalies(
$scope.focusChartData,
$scope.anomalyRecords,
refreshFocusData.focusChartData = processDataForFocusAnomalies(
refreshFocusData.focusChartData,
refreshFocusData.anomalyRecords,
$scope.timeFieldName);
updatedFocusChartData = processScheduledEventsForChart(
$scope.focusChartData,
$scope.scheduledEvents);
refreshFocusData.focusChartData = processScheduledEventsForChart(
refreshFocusData.focusChartData,
refreshFocusData.scheduledEvents);
// All the data is ready now for a scope update
$scope.$evalAsync(() => {
$scope.focusChartData = updatedFocusChartData;
$scope = Object.assign($scope, refreshFocusData);
console.log('Time series explorer focus chart data set:', $scope.focusChartData);
$scope.loading = false;
@ -390,9 +397,9 @@ module.controller('MlTimeSeriesExplorerController', function (
searchBounds.max.valueOf(),
$scope.focusAggregationInterval.expression
).then((resp) => {
$scope.focusChartData = processMetricPlotResults(resp.results, $scope.modelPlotEnabled);
refreshFocusData.focusChartData = processMetricPlotResults(resp.results, $scope.modelPlotEnabled);
$scope.showModelBoundsCheckbox = ($scope.modelPlotEnabled === true) &&
($scope.focusChartData.length > 0);
(refreshFocusData.focusChartData.length > 0);
finish();
}).catch((resp) => {
console.log('Time series explorer - error getting metric data from elasticsearch:', resp);
@ -408,11 +415,11 @@ module.controller('MlTimeSeriesExplorerController', function (
ANOMALIES_MAX_RESULTS
).then((resp) => {
// Sort in descending time order before storing in scope.
$scope.anomalyRecords = _.chain(resp.records)
refreshFocusData.anomalyRecords = _.chain(resp.records)
.sortBy(record => record[$scope.timeFieldName])
.reverse()
.value();
console.log('Time series explorer anomalies:', $scope.anomalyRecords);
console.log('Time series explorer anomalies:', refreshFocusData.anomalyRecords);
finish();
});
@ -425,7 +432,7 @@ module.controller('MlTimeSeriesExplorerController', function (
1,
MAX_SCHEDULED_EVENTS
).then((resp) => {
$scope.scheduledEvents = resp.events[$scope.selectedJob.job_id];
refreshFocusData.scheduledEvents = resp.events[$scope.selectedJob.job_id];
finish();
}).catch((resp) => {
console.log('Time series explorer - error getting scheduled events from elasticsearch:', resp);
@ -452,8 +459,8 @@ module.controller('MlTimeSeriesExplorerController', function (
$scope.focusAggregationInterval.expression,
aggType)
.then((resp) => {
$scope.focusForecastData = processForecastResults(resp.results);
$scope.showForecastCheckbox = ($scope.focusForecastData.length > 0);
refreshFocusData.focusForecastData = processForecastResults(resp.results);
refreshFocusData.showForecastCheckbox = (refreshFocusData.focusForecastData.length > 0);
finish();
}).catch((resp) => {
console.log(`Time series explorer - error loading data for forecast ID ${forecastId}`, resp);