Skip to content

M
mindinsight

MindSpore / mindinsight

通知 8
Star 3
Fork 2
M
mindinsight
提交 65493933 编写于 作者: M mindspore-ci-bot 提交者： Gitee
浏览文件
操作

!530 Scalar button information 

Merge pull request !530 from 王卫宁/prmaster
上级 e5ad3628 41d240e7
隐藏空白更改
内联 并排
Showing with 247 addition and 244 deletion
mindinsight/ui/src/views/train-manage/scalar.vue
浏览文件 @ 65493933
......@@ -298,8 +298,8 @@ export default {
thresholdErrorMsg: '',
thresholdRelational: '',
thresholdValue: [
{filterCondition: this.$t('scalar.lessThan'), value: ''},
{filterCondition: this.$t('scalar.lessThan'), value: ''},
{ filterCondition: this.$t('scalar.lessThan'), value: '' },
{ filterCondition: this.$t('scalar.lessThan'), value: '' },
],
filterOptions: [
{
......@@ -412,7 +412,7 @@ export default {
return;
}
document.title = `${decodeURIComponent(
this.$route.query.train_id,
this.$route.query.train_id
)}-${this.$t('scalar.titleText')}-MindInsight`;
// Adding a Listener
window.addEventListener('resize', this.resizeCallback, false);
......@@ -440,7 +440,7 @@ export default {
if (localStorage.getItem('thresholdCache')) {
try {
this.thresholdLocal = JSON.parse(
localStorage.getItem('thresholdCache'),
localStorage.getItem('thresholdCache')
);
this.clearCache();
} catch (e) {
......@@ -467,8 +467,8 @@ export default {
) {
delete this.thresholdLocal[this.decodeTrainingJobId];
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal),
'thresholdCache',
JSON.stringify(this.thresholdLocal)
);
}
}
......@@ -484,81 +484,81 @@ export default {
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params, false)
.then((res) => {
.then((res) => {
// error;
if (
!res ||
if (
!res ||
!res.data ||
!res.data.train_jobs ||
!res.data.train_jobs.length
) {
this.initOver = true;
return;
}
const tempTagList = [];
const dataList = [];
const propsList = [];
const data = res.data.train_jobs[0];
const runNmeColor = CommonProperty.commonColorArr[0];
data.tags.forEach((tagObj) => {
if (!this.oriDataDictionaries[tagObj]) {
this.oriDataDictionaries[tagObj] = true;
// Add the tag list
tempTagList.push({
label: tagObj,
checked: true,
show: true,
});
const sampleIndex = dataList.length;
// Adding Chart Data
dataList.push({
tagName: tagObj,
runNames: data.name,
colors: runNmeColor,
show: false,
updateFlag: false,
dataRemove: false,
fullScreen: false,
sampleIndex: sampleIndex,
domId: 'prDom' + this.DomIdIndex,
charData: {
oriData: [],
charOption: {},
},
zoomData: [null, null],
zoomDataTimer: null,
charObj: null,
invalidData: false,
});
propsList.push({
tagName: tagObj,
runNames: data.name,
colors: '',
});
this.DomIdIndex++;
}
});
this.tagOperateList = tempTagList;
this.tagPropsList = JSON.parse(JSON.stringify(tempTagList));
if (dataList.length === 1) {
dataList[0].fullScreen = true;
}
this.originDataArr = dataList;
this.propsList = propsList;
) {
this.initOver = true;
return;
}
const tempTagList = [];
const dataList = [];
const propsList = [];
const data = res.data.train_jobs[0];
const runNmeColor = CommonProperty.commonColorArr[0];
data.tags.forEach((tagObj) => {
if (!this.oriDataDictionaries[tagObj]) {
this.oriDataDictionaries[tagObj] = true;
// Add the tag list
tempTagList.push({
label: tagObj,
checked: true,
show: true,
});
const sampleIndex = dataList.length;
// Adding Chart Data
dataList.push({
tagName: tagObj,
runNames: data.name,
colors: runNmeColor,
show: false,
updateFlag: false,
dataRemove: false,
fullScreen: false,
sampleIndex: sampleIndex,
domId: 'prDom' + this.DomIdIndex,
charData: {
oriData: [],
charOption: {},
},
zoomData: [null, null],
zoomDataTimer: null,
charObj: null,
invalidData: false,
});
this.$nextTick(() => {
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
// Obtains data on the current page
this.updateTagInPage();
this.resizeCallback();
});
}, this.requestErrorCallback)
.catch((e) => {
this.initOver = true;
this.$message.error(this.$t('public.dataError'));
propsList.push({
tagName: tagObj,
runNames: data.name,
colors: '',
});
this.DomIdIndex++;
}
});
this.tagOperateList = tempTagList;
this.tagPropsList = JSON.parse(JSON.stringify(tempTagList));
if (dataList.length === 1) {
dataList[0].fullScreen = true;
}
this.originDataArr = dataList;
this.propsList = propsList;
this.initOver = true;
this.$nextTick(() => {
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
// Obtains data on the current page
this.updateTagInPage();
this.resizeCallback();
});
}, this.requestErrorCallback)
.catch((e) => {
this.initOver = true;
this.$message.error(this.$t('public.dataError'));
});
},
/**
......@@ -606,108 +606,108 @@ export default {
};
RequestService.getScalarsSample(params)
.then((res) => {
.then((res) => {
// error
if (!res || !res.data || !res.data.metadatas) {
if (!res || !res.data || !res.data.metadatas) {
// canceled
if (res.toString() === 'false') {
return;
}
if (sampleObject.charObj) {
sampleObject.charObj.clear();
sampleObject.onePoint = false;
}
if (res.toString() === 'false') {
return;
}
let hasInvalidData = false;
if (sampleObject.charObj) {
sampleObject.charObj.showLoading();
sampleObject.charObj.clear();
sampleObject.onePoint = false;
}
return;
}
let hasInvalidData = false;
const resData = res.data;
if (sampleObject.charObj) {
sampleObject.charObj.showLoading();
}
const tempObject = {
valueData: {
stepData: [],
absData: [],
relativeData: [],
},
logData: {
stepData: [],
absData: [],
relativeData: [],
},
};
let relativeTimeBench = 0;
if (resData.metadatas.length) {
relativeTimeBench = resData.metadatas[0].wall_time;
}
const resData = res.data;
// Initializing Chart Data
resData.metadatas.forEach((metaData) => {
if (metaData.value === null && !hasInvalidData) {
hasInvalidData = true;
}
tempObject.valueData.stepData.push([
metaData.step,
metaData.value,
]);
tempObject.valueData.absData.push([
metaData.wall_time,
metaData.value,
]);
tempObject.valueData.relativeData.push([
metaData.wall_time - relativeTimeBench,
metaData.value,
]);
const logValue = metaData.value >= 0 ? metaData.value : '';
tempObject.logData.stepData.push([metaData.step, logValue]);
tempObject.logData.absData.push([metaData.wall_time, logValue]);
tempObject.logData.relativeData.push([
metaData.wall_time - relativeTimeBench,
logValue,
]);
});
sampleObject.charData.oriData[0] = tempObject;
const tempObject = {
valueData: {
stepData: [],
absData: [],
relativeData: [],
},
logData: {
stepData: [],
absData: [],
relativeData: [],
},
};
let relativeTimeBench = 0;
if (resData.metadatas.length) {
relativeTimeBench = resData.metadatas[0].wall_time;
}
if (hasInvalidData) {
this.$set(sampleObject, 'invalidData', true);
} else {
this.$set(sampleObject, 'invalidData', false);
// Initializing Chart Data
resData.metadatas.forEach((metaData) => {
if (metaData.value === null && !hasInvalidData) {
hasInvalidData = true;
}
tempObject.valueData.stepData.push([
metaData.step,
metaData.value,
]);
tempObject.valueData.absData.push([
metaData.wall_time,
metaData.value,
]);
tempObject.valueData.relativeData.push([
metaData.wall_time - relativeTimeBench,
metaData.value,
]);
const logValue = metaData.value >= 0 ? metaData.value : '';
tempObject.logData.stepData.push([metaData.step, logValue]);
tempObject.logData.absData.push([metaData.wall_time, logValue]);
tempObject.logData.relativeData.push([
metaData.wall_time - relativeTimeBench,
logValue,
]);
});
sampleObject.charData.charOption = this.formateCharOption(
sampleIndex,
);
const tempOption = sampleObject.charData.charOption;
if (
tempOption.series[0].data.length === 1 ||
sampleObject.charData.oriData[0] = tempObject;
if (hasInvalidData) {
this.$set(sampleObject, 'invalidData', true);
} else {
this.$set(sampleObject, 'invalidData', false);
}
sampleObject.charData.charOption = this.formateCharOption(
sampleIndex
);
const tempOption = sampleObject.charData.charOption;
if (
tempOption.series[0].data.length === 1 ||
sampleObject.onePoint
) {
tempOption.series[0].showSymbol = true;
} else {
tempOption.series[0].showSymbol = false;
}
) {
tempOption.series[0].showSymbol = true;
} else {
tempOption.series[0].showSymbol = false;
}
this.$forceUpdate();
this.$forceUpdate();
this.$nextTick(() => {
if (sampleObject.charObj) {
sampleObject.charObj.hideLoading();
}
// Draw chart
if (!this.compare) {
this.updateOrCreateChar(sampleIndex, true);
}
});
})
.catch((e) => {
this.$nextTick(() => {
if (sampleObject.charObj) {
sampleObject.charObj.clear();
sampleObject.charObj.hideLoading();
}
// Draw chart
if (!this.compare) {
this.updateOrCreateChar(sampleIndex, true);
}
});
})
.catch((e) => {
if (sampleObject.charObj) {
sampleObject.charObj.clear();
}
});
});
},
......@@ -718,7 +718,7 @@ export default {
setOnePoint(sampleObject) {
const that = this;
sampleObject.charObj.on('datazoom', function(params) {
sampleObject.charObj.on('datazoom', function (params) {
const xAxisObject = params.batch[0];
const yAxisObject = params.batch[1];
const charData = sampleObject.charData.charOption.series[0].data;
......@@ -777,7 +777,7 @@ export default {
setRestore(sampleObject) {
const that = this;
sampleObject.charObj.on('restore', function(params) {
sampleObject.charObj.on('restore', function (params) {
const charData = sampleObject.charData.charOption.series[0].data;
const tempCharOption = sampleObject.charData.charOption;
......@@ -846,12 +846,12 @@ export default {
if (curOriData) {
if (sampleObject.log) {
dataObj.data = this.formateSmoothData(
curOriData.logData[this.curBenchX],
curOriData.logData[this.curBenchX]
);
dataObjBackend.data = curOriData.logData[this.curBenchX];
} else {
dataObj.data = this.formateSmoothData(
curOriData.valueData[this.curBenchX],
curOriData.valueData[this.curBenchX]
);
dataObjBackend.data = curOriData.valueData[this.curBenchX];
}
......@@ -981,23 +981,23 @@ export default {
position: (point, params, dom, rect, size) => {
const curDom = document.getElementById(sampleObject.domId);
if (!curDom) {
return {left: 0, bottom: '100%'};
return { left: 0, bottom: '100%' };
}
if (sampleObject.fullScreen) {
if (point[0] + size.contentSize[0] <= size.viewSize[0]) {
return {left: point[0], bottom: '10%'};
return { left: point[0], bottom: '10%' };
} else {
return {right: size.viewSize[0] - point[0], bottom: '10%'};
return { right: size.viewSize[0] - point[0], bottom: '10%' };
}
} else {
const parentNode = curDom.parentNode;
if (!parentNode) {
return {left: 0, bottom: '100%'};
return { left: 0, bottom: '100%' };
}
if (parentNode.offsetLeft > size.contentSize[0]) {
return {right: '100%', bottom: 0};
return { right: '100%', bottom: 0 };
} else {
return {left: '100%', bottom: 0};
return { left: '100%', bottom: 0 };
}
}
},
......@@ -1082,16 +1082,16 @@ export default {
`display:inline-block;"></td><td>${parma.seriesName}</td>` +
`<td>${that.formateYaxisValue(parma.value[1])}</td>` +
`<td>${that.formateYaxisValue(
curSerieOriData.stepData[parma.dataIndex][1],
curSerieOriData.stepData[parma.dataIndex][1]
)}</td>` +
`<td>${curSerieOriData.stepData[parma.dataIndex][0]}</td>` +
`<td>${curSerieOriData.relativeData[
parma.dataIndex
parma.dataIndex
][0].toFixed(3)}${unit}</td>` +
`<td>${that.dealrelativeTime(
new Date(
curSerieOriData.absData[parma.dataIndex][0] * 1000,
).toString(),
new Date(
curSerieOriData.absData[parma.dataIndex][0] * 1000
).toString()
)}</td>` +
`</tr>`;
}
......@@ -1108,6 +1108,7 @@ export default {
emphasis: {
iconStyle: {
textPosition: 'top',
textAlign: 'right',
},
},
// toolbox
......@@ -1151,7 +1152,9 @@ export default {
},
// restore
restore: {},
restore: {
title: this.$t('scalar.restore'),
},
},
},
series: seriesData,
......@@ -1173,9 +1176,9 @@ export default {
this.thresholdLocal[this.decodeTrainingJobId][sampleObject.tagName]
) {
const tempStorgeArr = JSON.parse(
JSON.stringify(
this.thresholdLocal[this.decodeTrainingJobId][sampleObject.tagName],
),
JSON.stringify(
this.thresholdLocal[this.decodeTrainingJobId][sampleObject.tagName]
)
);
let pieceStr = '';
pieceStr = this.formatePieceStr(tempStorgeArr);
......@@ -1209,8 +1212,8 @@ export default {
// Updating chart option
if (sampleObject.updateFlag) {
sampleObject.charObj.setOption(
sampleObject.charData.charOption,
sampleObject.dataRemove,
sampleObject.charData.charOption,
sampleObject.dataRemove
);
sampleObject.updateFlag = false;
sampleObject.dataRemove = false;
......@@ -1218,8 +1221,8 @@ export default {
} else {
// creat chart
sampleObject.charObj = echarts.init(
document.getElementById(sampleObject.domId),
null,
document.getElementById(sampleObject.domId),
null
);
sampleObject.charObj.setOption(sampleObject.charData.charOption, true);
this.setOnePoint(sampleObject);
......@@ -1325,13 +1328,13 @@ export default {
const oriIndexData = sampleObject.charData.oriData[index];
if (sampleObject.log) {
seriesData[index * 2].data = this.formateSmoothData(
oriIndexData.logData[this.curBenchX],
oriIndexData.logData[this.curBenchX]
);
seriesData[index * 2 + 1].data =
oriIndexData.logData[this.curBenchX];
} else {
seriesData[index * 2].data = this.formateSmoothData(
oriIndexData.valueData[this.curBenchX],
oriIndexData.valueData[this.curBenchX]
);
seriesData[index * 2 + 1].data =
oriIndexData.valueData[this.curBenchX];
......@@ -1545,56 +1548,56 @@ export default {
train_id: this.trainingJobId,
};
RequestService.getSingleTrainJob(params, ignoreError)
.then((res) => {
if (this.isReloading) {
this.$store.commit('setIsReload', false);
this.isReloading = false;
}
.then((res) => {
if (this.isReloading) {
this.$store.commit('setIsReload', false);
this.isReloading = false;
}
// Fault tolerance processing
if (!res || !res.data) {
return;
} else if (!res.data.train_jobs || !res.data.train_jobs.length) {
this.clearAllData();
return;
}
const data = res.data.train_jobs[0];
// Delete the data that does not exist
const tagRemoveFlag = this.removeNonexistentData(data);
// Fault tolerance processing
if (!res || !res.data) {
return;
} else if (!res.data.train_jobs || !res.data.train_jobs.length) {
this.clearAllData();
return;
}
const data = res.data.train_jobs[0];
// Delete the data that does not exist
const tagRemoveFlag = this.removeNonexistentData(data);
// Check whether new data exists and add it to the page
const tagAddFlag = this.checkNewDataAndComplete(data);
// Check whether new data exists and add it to the page
const tagAddFlag = this.checkNewDataAndComplete(data);
this.$nextTick(() => {
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
this.updateTagInPage(!tagRemoveFlag && !tagAddFlag);
this.resizeCallback();
});
this.$nextTick(() => {
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
this.updateTagInPage(!tagRemoveFlag && !tagAddFlag);
this.resizeCallback();
});
const tempTagList = [];
const propsList = [];
// Initial chart data
data.tags.forEach((tagObj) => {
const tempTagList = [];
const propsList = [];
// Initial chart data
data.tags.forEach((tagObj) => {
// Check whether the tag with the same name exists
tempTagList.push({
label: tagObj,
checked: true,
show: true,
});
tempTagList.push({
label: tagObj,
checked: true,
show: true,
});
// Add the tag list.
propsList.push({
tagName: tagObj,
runNames: data.name,
colors: '',
});
// Add the tag list.
propsList.push({
tagName: tagObj,
runNames: data.name,
colors: '',
});
this.tagPropsList = tempTagList;
this.propsList = propsList;
}, this.requestErrorCallback)
.catch((e) => {
this.$message.error(this.$t('public.dataError'));
});
this.tagPropsList = tempTagList;
this.propsList = propsList;
}, this.requestErrorCallback)
.catch((e) => {
this.$message.error(this.$t('public.dataError'));
});
},
/**
......@@ -1700,15 +1703,15 @@ export default {
if (index % 2 === 0) {
if (log) {
serie.data = this.formateSmoothData(
sampleObject.charData.oriData[index / 2].logData[
this.curBenchX
],
sampleObject.charData.oriData[index / 2].logData[
this.curBenchX
]
);
} else {
serie.data = this.formateSmoothData(
sampleObject.charData.oriData[index / 2].valueData[
this.curBenchX
],
sampleObject.charData.oriData[index / 2].valueData[
this.curBenchX
]
);
}
}
......@@ -1804,13 +1807,13 @@ export default {
tempOriData.forEach((originData, index) => {
if (log) {
tempOption.series[index * 2].data = this.formateSmoothData(
tempOriData[index].logData[this.curBenchX],
tempOriData[index].logData[this.curBenchX]
);
tempOption.series[index * 2 + 1].data =
tempOriData[index].logData[this.curBenchX];
} else {
tempOption.series[index * 2].data = this.formateSmoothData(
tempOriData[index].valueData[this.curBenchX],
tempOriData[index].valueData[this.curBenchX]
);
tempOption.series[index * 2 + 1].data =
tempOriData[index].valueData[this.curBenchX];
......@@ -1897,7 +1900,7 @@ export default {
this.thresholdLocal[this.decodeTrainingJobId][sampleItem.tagName]
) {
delete this.thresholdLocal[this.decodeTrainingJobId][
sampleItem.tagName
sampleItem.tagName
];
}
this.currentTagName = sampleItem.tagName;
......@@ -2246,7 +2249,7 @@ export default {
this.originDataArr.forEach((sampleObject) => {
if (this.multiSelectedTagNames[sampleObject.tagName]) {
this.thresholdLocal[this.decodeTrainingJobId][
sampleObject.tagName
sampleObject.tagName
] = chartPieces;
sampleObject.pieceStr = pieceStr;
......@@ -2257,14 +2260,14 @@ export default {
});
} else {
this.thresholdLocal[this.decodeTrainingJobId][
this.currentTagName
this.currentTagName
] = chartPieces;
this.currentSample.pieceStr = pieceStr;
this.setVisualMap(this.currentSample, chartPieces);
}
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal),
'thresholdCache',
JSON.stringify(this.thresholdLocal)
);
this.thresholdDialogVisible = false;
......@@ -2329,11 +2332,11 @@ export default {
this.thresholdLocal &&
this.thresholdLocal[this.decodeTrainingJobId] &&
this.thresholdLocal[this.decodeTrainingJobId][
sampleObject.tagName
sampleObject.tagName
]
) {
delete this.thresholdLocal[this.decodeTrainingJobId][
sampleObject.tagName
sampleObject.tagName
];
sampleObject.pieceStr = '';
const tempCharOption = sampleObject.charData.charOption;
......@@ -2360,7 +2363,7 @@ export default {
this.thresholdLocal[this.decodeTrainingJobId][this.currentTagName]
) {
delete this.thresholdLocal[this.decodeTrainingJobId][
this.currentTagName
this.currentTagName
];
this.currentSample.pieceStr = '';
const tempCharOption = this.currentSample.charData.charOption;
......@@ -2372,7 +2375,7 @@ export default {
tempCharOption.visualMap = null;
tempCharOption.series[0].markLine = null;
tempCharOption.series[0].lineStyle[
'color'
'color'
] = this.currentSample.colors;
}
this.currentSample.charObj.setOption(tempCharOption, false);
......@@ -2380,8 +2383,8 @@ export default {
}
this.clearCache();
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal),
'thresholdCache',
JSON.stringify(this.thresholdLocal)
);
this.delThresholdVisible = false;
},
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或