You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@submarine.apache.org by li...@apache.org on 2020/07/23 00:49:09 UTC

[submarine] branch master updated: SUBMARINE-556. [WEB] Connect workbench with database for metric

This is an automated email from the ASF dual-hosted git repository.

liuxun pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/submarine.git


The following commit(s) were added to refs/heads/master by this push:
     new 73e40c5  SUBMARINE-556. [WEB] Connect workbench with database for metric
73e40c5 is described below

commit 73e40c58652b9eedb90e8904f0c602117e77c6c4
Author: kobe860219 <ko...@gmail.com>
AuthorDate: Mon Jul 20 15:00:20 2020 +0800

    SUBMARINE-556. [WEB] Connect workbench with database for metric
    
    ### What is this PR for?
    Connect workbench with database for metric.
    
    ### What type of PR is it?
    [Feature]
    
    ### Todos
    
    ### What is the Jira issue?
    https://issues.apache.org/jira/browse/SUBMARINE-556
    
    ### How should this be tested?
    https://travis-ci.org/github/kobe860219/submarine/builds/709419937
    
    ### Screenshots (if appropriate)
    
    ### Questions:
    * Does the licenses files need update? No
    * Is there breaking changes for older versions? No
    * Does this needs documentation? No
    
    Author: kobe860219 <ko...@gmail.com>
    
    Closes #349 from kobe860219/SUBMARINE-556 and squashes the following commits:
    
    592e41a [kobe860219] Remove col of Is_NaN
    6f7514a [kobe860219] Prettier code
    71e7aad [kobe860219] SUBMARINE-556. [WEB] Connect workbench with database for metric
    82355e3 [kobe860219] Done without mock and real test.
---
 .../experiment-info/experiment-info.component.html  |  2 +-
 .../experiment-info/experiment-info.component.ts    | 19 +++++++++++++++++--
 .../hyper-params/hyper-params.component.ts          |  3 ++-
 .../experiment-info/metrics/metrics.component.html  | 21 ++++++++++++++++++++-
 .../experiment-info/metrics/metrics.component.scss  |  5 ++++-
 .../experiment-info/metrics/metrics.component.ts    | 15 ++++++++++++++-
 .../src/app/services/experiment.service.ts          | 13 +++++++++++++
 7 files changed, 71 insertions(+), 7 deletions(-)

diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.html
index 3d521ea..34e481f 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.html
@@ -116,7 +116,7 @@
         [workerIndex]="selectedPod"
         [paramData]="paramData"
       ></submarine-hyper-params>
-      <submarine-metrics *ngSwitchCase="2"></submarine-metrics>
+      <submarine-metrics *ngSwitchCase="2" [workerIndex]="selectedPod" [metricData]="metricData"></submarine-metrics>
       <submarine-outputs
         *ngSwitchCase="3"
         [podName]="selectedPod"
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.ts
index 16e0366..4f26794 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/experiment-info.component.ts
@@ -37,6 +37,7 @@ export class ExperimentInfoComponent implements OnInit {
   podNameArr;
   podLogArr;
   paramData;
+  metricData;
 
   constructor(
     private router: Router,
@@ -76,7 +77,7 @@ export class ExperimentInfoComponent implements OnInit {
 
     this.experimentService
       .getExperimentParam({
-        jobName: null
+        jobName: this.experimentID
       })
       .subscribe(
         (result) => {
@@ -87,12 +88,26 @@ export class ExperimentInfoComponent implements OnInit {
           console.log(err);
         }
       );
+
+    this.experimentService
+      .getExperimentMetric({
+        jobName: this.experimentID
+      })
+      .subscribe(
+        (result) => {
+          this.metricData = result;
+        },
+        (err) => {
+          this.nzMessageService.error('Cannot load metric of ' + this.experimentID);
+          console.log(err);
+        }
+      );
   }
 
   onDeleteExperiment() {
     this.experimentService.deleteExperiment(this.experimentID).subscribe(
       () => {
-        this.nzMessageService.success('Delete user success!');
+        this.nzMessageService.success('Delete experiment success!');
         this.router.navigate(['/workbench/experiment']);
       },
       (err) => {
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/hyper-params/hyper-params.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/hyper-params/hyper-params.component.ts
index 584d429..0cd3680 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/hyper-params/hyper-params.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/hyper-params/hyper-params.component.ts
@@ -31,11 +31,12 @@ export class HyperParamsComponent implements OnInit {
   @Input() paramData;
   podParam = [];
 
-  constructor(private baseApi: BaseApiService, private httpClient: HttpClient) {}
+  constructor() {}
 
   ngOnInit() {}
 
   ngOnChanges(chg: SimpleChanges) {
+    this.podParam.length = 0;
     this.paramData.forEach((data) => {
       if (data.workerIndex == this.workerIndex) {
         this.podParam.push(data);
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.html b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.html
index daaa556..17366a6 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.html
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.html
@@ -17,4 +17,23 @@
   ~ under the License.
   -->
 
-<p>metrics works!</p>
+<div id="metricTable">
+  <nz-table #metricTable nzSize="middle" [nzBordered]="true" [nzFrontPagination]="false" [nzData]="podMetric">
+    <thead>
+      <tr>
+        <th>Key</th>
+        <th>Value</th>
+        <th>Time</th>
+        <th>Step</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr *ngFor="let metric of metricTable.data">
+        <td>{{ metric.key }}</td>
+        <td>{{ metric.value }}</td>
+        <td>{{ metric.timestamp }}</td>
+        <td>{{ metric.step }}</td>
+      </tr>
+    </tbody>
+  </nz-table>
+</div>
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.scss b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.scss
index 6c98c1e..6ee12d1 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.scss
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.scss
@@ -17,4 +17,7 @@
  * under the License.
  */
 
-
+ #metricTable {
+    background-color: white;
+    height: 500px;
+}
diff --git a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.ts b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.ts
index 3df7a0d..7ba3859 100644
--- a/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/pages/workbench/experiment/experiment-info/metrics/metrics.component.ts
@@ -17,7 +17,7 @@
  * under the License.
  */
 
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input, SimpleChanges } from '@angular/core';
 
 @Component({
   selector: 'submarine-metrics',
@@ -25,7 +25,20 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./metrics.component.scss']
 })
 export class MetricsComponent implements OnInit {
+  @Input() workerIndex;
+  @Input() metricData;
+  podMetric = [];
+
   constructor() {}
 
   ngOnInit() {}
+
+  ngOnChanges(chg: SimpleChanges) {
+    this.podMetric.length = 0;
+    this.metricData.forEach((data) => {
+      if (data.workerIndex == this.workerIndex) {
+        this.podMetric.push(data);
+      }
+    });
+  }
 }
diff --git a/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts b/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
index 2382253..41876ae 100644
--- a/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
+++ b/submarine-workbench/workbench-web-ng/src/app/services/experiment.service.ts
@@ -122,4 +122,17 @@ export class ExperimentService {
       })
     );
   }
+
+  getExperimentMetric(param: object): Observable<any> {
+    const apiUrl = this.baseApi.getRestApi('/metric/selective');
+    return this.httpClient.post<any>(apiUrl, param).pipe(
+      switchMap((res) => {
+        if (res.success) {
+          return of(res.result);
+        } else {
+          throw this.baseApi.createRequestError(res.message, res.code, apiUrl, 'post', param);
+        }
+      })
+    );
+  }
 }


---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@submarine.apache.org
For additional commands, e-mail: dev-help@submarine.apache.org