Skip to content

GitLab

Commit 151013aa authored by Lijiao's avatar Lijiao Committed by chicm-ms
Browse files

Fix issue #927: show experiment profile in the Overview page (#932)

parent 0e196f9b
Hide whitespace changes
Inline Side-by-side
Showing with 33 additions and 20 deletions
src/webui/src/components/Overview.tsx
View file @ 151013aa
...@@ -20,6 +20,7 @@ require('../static/style/overviewTitle.scss'); ...@@ -20,6 +20,7 @@ require('../static/style/overviewTitle.scss');
interface OverviewState { interface OverviewState {
tableData: Array<TableObj>; tableData: Array<TableObj>;
experimentAPI: object;
searchSpace: object; searchSpace: object;
status: string; status: string;
errorStr: string; errorStr: string;
...@@ -47,6 +48,7 @@ class Overview extends React.Component<{}, OverviewState> { ...@@ -47,6 +48,7 @@ class Overview extends React.Component<{}, OverviewState> {
super(props); super(props);
this.state = { this.state = {
searchSpace: {}, searchSpace: {},
experimentAPI: {},
status: '', status: '',
errorStr: '', errorStr: '',
trialProfile: { trialProfile: {
...@@ -143,6 +145,7 @@ class Overview extends React.Component<{}, OverviewState> { ...@@ -143,6 +145,7 @@ class Overview extends React.Component<{}, OverviewState> {
}); });
if (this._isMounted) { if (this._isMounted) {
this.setState({ this.setState({
experimentAPI: res.data,
trialProfile: trialPro[0], trialProfile: trialPro[0],
searchSpace: searchSpace, searchSpace: searchSpace,
isLogCollection: expLogCollection isLogCollection: expLogCollection
...@@ -390,7 +393,7 @@ class Overview extends React.Component<{}, OverviewState> { ...@@ -390,7 +393,7 @@ class Overview extends React.Component<{}, OverviewState> {
const { const {
trialProfile, searchSpace, tableData, accuracyData, trialProfile, searchSpace, tableData, accuracyData,
accNodata, status, errorStr, trialNumber, bestAccuracy, accNodata, status, errorStr, trialNumber, bestAccuracy,
titleMaxbgcolor, titleMinbgcolor, isLogCollection titleMaxbgcolor, titleMinbgcolor, isLogCollection, experimentAPI
} = this.state; } = this.state;
return ( return (
...@@ -425,9 +428,7 @@ class Overview extends React.Component<{}, OverviewState> { ...@@ -425,9 +428,7 @@ class Overview extends React.Component<{}, OverviewState> {
<Row className="experiment"> <Row className="experiment">
{/* the scroll bar all the trial profile in the searchSpace div*/} {/* the scroll bar all the trial profile in the searchSpace div*/}
<div className="experiment searchSpace"> <div className="experiment searchSpace">
<TrialPro <TrialPro experiment={experimentAPI} />
tiralProInfo={trialProfile}
/>
</div> </div>
</Row> </Row>
</Col> </Col>
......
src/webui/src/components/overview/TrialProfile.tsx
View file @ 151013aa
import * as React from 'react'; import * as React from 'react';
import { Experiment } from '../../static/interface';
import MonacoEditor from 'react-monaco-editor'; import MonacoEditor from 'react-monaco-editor';
import { MONACO } from '../../static/const'; import { MONACO } from '../../static/const';
interface TrialInfoProps { interface TrialInfoProps {
tiralProInfo: Experiment; experiment: object;
} }
class TrialInfo extends React.Component<TrialInfoProps, {}> { class TrialInfo extends React.Component<TrialInfoProps, {}> {
...@@ -13,19 +12,32 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> { ...@@ -13,19 +12,32 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> {
super(props); super(props);
} }
render() { componentWillReceiveProps(nextProps: TrialInfoProps) {
const { tiralProInfo } = this.props; const experiments = nextProps.experiment;
const showProInfo = []; Object.keys(experiments).map(key => {
showProInfo.push({ switch (key) {
revision: tiralProInfo.revision, case 'id':
authorName: tiralProInfo.author, case 'logDir':
trialConcurrency: tiralProInfo.runConcurren, case 'startTime':
tuner: tiralProInfo.tuner, case 'endTime':
assessor: tiralProInfo.assessor ? tiralProInfo.assessor : undefined, experiments[key] = undefined;
logCollection: tiralProInfo.logCollection ? tiralProInfo.logCollection : undefined, break;
advisor: tiralProInfo.advisor ? tiralProInfo.advisor : undefined, case 'params':
clusterMetaData: tiralProInfo.clusterMetaData ? tiralProInfo.clusterMetaData : undefined const params = experiments[key];
Object.keys(params).map(item => {
if (item === 'experimentName' || item === 'searchSpace'
|| item === 'trainingServicePlatform') {
params[item] = undefined;
}
});
break;
default:
}
}); });
}
render() {
const { experiment } = this.props;
return ( return (
<div className="profile"> <div className="profile">
<MonacoEditor <MonacoEditor
...@@ -33,7 +45,7 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> { ...@@ -33,7 +45,7 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> {
height="380" height="380"
language="json" language="json"
theme="vs-light" theme="vs-light"
value={JSON.stringify(showProInfo[0], null, 2)} value={JSON.stringify(experiment, null, 2)}
options={MONACO} options={MONACO}
/> />
</div> </div>
...@@ -41,4 +53,4 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> { ...@@ -41,4 +53,4 @@ class TrialInfo extends React.Component<TrialInfoProps, {}> {
} }
} }
export default TrialInfo; export default TrialInfo;
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment