From 8beb39ba6394ade91b83c1869228236a72515019 Mon Sep 17 00:00:00 2001 From: qin_jun_yan Date: Thu, 20 Aug 2020 20:17:20 +0800 Subject: [PATCH] Add training log path to training kanban sub-page and profiling page --- .../ui/src/views/profiling/profiling.vue | 20 + .../ui/src/views/train-manage/data-map.vue | 26 +- .../ui/src/views/train-manage/graph.vue | 14 + .../ui/src/views/train-manage/histogram.vue | 50 +- .../ui/src/views/train-manage/image.vue | 17 +- .../ui/src/views/train-manage/scalar.vue | 504 +++++++++--------- .../src/views/train-manage/summary-manage.vue | 1 + .../ui/src/views/train-manage/tensor.vue | 17 +- .../views/train-manage/training-dashboard.vue | 13 +- 9 files changed, 389 insertions(+), 273 deletions(-) diff --git a/mindinsight/ui/src/views/profiling/profiling.vue b/mindinsight/ui/src/views/profiling/profiling.vue index a567ddd..99d35a3 100644 --- a/mindinsight/ui/src/views/profiling/profiling.vue +++ b/mindinsight/ui/src/views/profiling/profiling.vue @@ -20,6 +20,10 @@ limitations under the License. :class="{collapse:collapse}">
+
+ {{$t('trainingDashboard.summaryDirPath')}} + {{ summaryPath}} +
-
{{$t('dataMap.titleText')}}
+
{{$t('dataMap.titleText')}} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
+
@@ -162,6 +169,7 @@ export default { trainJobID: '', selectedNode: [], noData: false, + summaryPath: this.$route.query.summaryPath, }; }, mounted() { @@ -213,8 +221,9 @@ export default { if (!data) { return; } - const key = `${parentKey ? parentKey + '/' : ''}${data.op_type || - ''}_${index}`; + const key = `${parentKey ? parentKey + '/' : ''}${ + data.op_type || '' + }_${index}`; const obj = { key: key, id: '', @@ -329,9 +338,7 @@ export default { this.graphviz = null; } }, 100); - d3.select('#graph') - .selectAll('title') - .remove(); + d3.select('#graph').selectAll('title').remove(); this.startApp(); }, /** @@ -631,6 +638,13 @@ export default { .cl-data-map-title { height: 56px; line-height: 56px; + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } } .data-map-p32 { height: 100%; diff --git a/mindinsight/ui/src/views/train-manage/graph.vue b/mindinsight/ui/src/views/train-manage/graph.vue index 25fc7ae..984bf29 100644 --- a/mindinsight/ui/src/views/train-manage/graph.vue +++ b/mindinsight/ui/src/views/train-manage/graph.vue @@ -59,6 +59,12 @@ limitations under the License.
{{ $t('graph.titleText') }} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
@@ -421,6 +427,7 @@ const d3 = {select, selectAll, zoom}; export default { data() { return { + summaryPath: this.$route.query.summaryPath, clickScope: {}, // Information about the node that is clicked for the first time. smallResize: {}, // The container of display area box. insideBox: {}, // Basic information about the display area box @@ -2968,6 +2975,13 @@ export default { .cl-graph-title { height: 56px; line-height: 56px; + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } .guide { cursor: pointer; margin-left: 10px; diff --git a/mindinsight/ui/src/views/train-manage/histogram.vue b/mindinsight/ui/src/views/train-manage/histogram.vue index 27ce6ad..4bfe670 100644 --- a/mindinsight/ui/src/views/train-manage/histogram.vue +++ b/mindinsight/ui/src/views/train-manage/histogram.vue @@ -18,7 +18,14 @@ limitations under the License.
-
{{$t('histogram.titleText')}}
+
{{$t('histogram.titleText')}} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
+
@@ -126,6 +133,7 @@ export default { return { tagList: [], // Tag list. trainingJobId: this.$route.query.train_id, // ID of the current training job. + summaryPath: this.$route.query.summaryPath, originDataArr: [], // List of all data. initOver: false, // Indicates whether the initialization is complete. curAxisName: 0, // Current time type. @@ -263,8 +271,11 @@ export default { document.title = this.$t('histogram.titleText') + '-MindInsight'; return; } - document.title = decodeURIComponent(this.$route.query.train_id) +'-' + this.$t('histogram.titleText') + - '-MindInsight'; + document.title = + decodeURIComponent(this.$route.query.train_id) + + '-' + + this.$t('histogram.titleText') + + '-MindInsight'; this.getOriginData(); if (this.isTimeReload) { this.autoUpdateSamples(); @@ -810,25 +821,23 @@ export default { '.cl-histogram-show-data-content', ).offsetTop; if (height + e.event.y + 20 > screenHeight && screenHeight > height) { - document.querySelector('#echartTip').style.top = `${e.event.y + - scrollTop - - height - - 20 - - offsetTop}px`; + document.querySelector('#echartTip').style.top = `${ + e.event.y + scrollTop - height - 20 - offsetTop + }px`; } else { - document.querySelector('#echartTip').style.top = `${e.event.y + - scrollTop + - 20 - - offsetTop}px`; + document.querySelector('#echartTip').style.top = `${ + e.event.y + scrollTop + 20 - offsetTop + }px`; } // Blank area on the right of the chart is 80 if (width + e.event.x + 80 > screenWidth && screenWidth > width) { - document.querySelector('#echartTip').style.left = `${e.event.x - - width - - 20}px`; + document.querySelector('#echartTip').style.left = `${ + e.event.x - width - 20 + }px`; } else { - document.querySelector('#echartTip').style.left = `${e.event.x + - 20}px`; + document.querySelector('#echartTip').style.left = `${ + e.event.x + 20 + }px`; } } @@ -1377,6 +1386,13 @@ export default { .cl-histogram-title { height: 56px; line-height: 56px; + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } .cl-close-btn { width: 20px; height: 20px; diff --git a/mindinsight/ui/src/views/train-manage/image.vue b/mindinsight/ui/src/views/train-manage/image.vue index a84bc57..8e9100d 100644 --- a/mindinsight/ui/src/views/train-manage/image.vue +++ b/mindinsight/ui/src/views/train-manage/image.vue @@ -18,7 +18,14 @@ limitations under the License.
-
{{$t('images.titleText')}}
+
{{$t('images.titleText')}} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
+
@@ -138,6 +145,7 @@ export default { brightness: 50, // Brightness contrast: 50, // Contrast trainingJobId: this.$route.query.train_id, // ID of the current training job + summaryPath: this.$route.query.summaryPath, multiSelectedTagNames: {}, // Dictionary for storing the name of the selected tags curFilterSamples: [], // List of images that meet the current filter criteria tagOperateList: [], // Tag list @@ -676,6 +684,13 @@ export default { .cl-image-title { height: 56px; line-height: 56px; + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } } } .title { diff --git a/mindinsight/ui/src/views/train-manage/scalar.vue b/mindinsight/ui/src/views/train-manage/scalar.vue index f6831f5..a6f701f 100644 --- a/mindinsight/ui/src/views/train-manage/scalar.vue +++ b/mindinsight/ui/src/views/train-manage/scalar.vue @@ -19,7 +19,14 @@ limitations under the License.
-
{{$t("scalar.titleText")}}
+
{{$t("scalar.titleText")}} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
+
{ + .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, - }); - 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.$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')); }); - }, this.requestErrorCallback) - .catch((e) => { - this.initOver = true; - this.$message.error(this.$t('public.dataError')); - }); }, /** @@ -606,108 +614,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') { + if (res.toString() === 'false') { + return; + } + if (sampleObject.charObj) { + sampleObject.charObj.clear(); + sampleObject.onePoint = false; + } return; } + let hasInvalidData = false; + if (sampleObject.charObj) { - sampleObject.charObj.clear(); - sampleObject.onePoint = false; + sampleObject.charObj.showLoading(); } - return; - } - let hasInvalidData = false; - if (sampleObject.charObj) { - sampleObject.charObj.showLoading(); - } + const resData = res.data; - const resData = res.data; - - const tempObject = { - valueData: { - stepData: [], - absData: [], - relativeData: [], - }, - logData: { - stepData: [], - absData: [], - relativeData: [], - }, - }; - let relativeTimeBench = 0; - if (resData.metadatas.length) { - relativeTimeBench = resData.metadatas[0].wall_time; - } - - // Initializing Chart Data - resData.metadatas.forEach((metaData) => { - if (metaData.value === null && !hasInvalidData) { - hasInvalidData = true; + const tempObject = { + valueData: { + stepData: [], + absData: [], + relativeData: [], + }, + logData: { + stepData: [], + absData: [], + relativeData: [], + }, + }; + let relativeTimeBench = 0; + if (resData.metadatas.length) { + relativeTimeBench = resData.metadatas[0].wall_time; } - 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; + // 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; - if (hasInvalidData) { - this.$set(sampleObject, 'invalidData', true); - } else { - this.$set(sampleObject, 'invalidData', false); - } + 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.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(() => { + this.$nextTick(() => { + if (sampleObject.charObj) { + sampleObject.charObj.hideLoading(); + } + // Draw chart + if (!this.compare) { + this.updateOrCreateChar(sampleIndex, true); + } + }); + }) + .catch((e) => { if (sampleObject.charObj) { - sampleObject.charObj.hideLoading(); - } - // Draw chart - if (!this.compare) { - this.updateOrCreateChar(sampleIndex, true); + sampleObject.charObj.clear(); } }); - }) - .catch((e) => { - if (sampleObject.charObj) { - sampleObject.charObj.clear(); - } - }); }); }, @@ -718,7 +726,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 +785,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 +854,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 +989,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 +1090,16 @@ export default { `display:inline-block;">${parma.seriesName}` + `${that.formateYaxisValue(parma.value[1])}` + `${that.formateYaxisValue( - curSerieOriData.stepData[parma.dataIndex][1] + curSerieOriData.stepData[parma.dataIndex][1], )}` + `${curSerieOriData.stepData[parma.dataIndex][0]}` + `${curSerieOriData.relativeData[ - parma.dataIndex + parma.dataIndex ][0].toFixed(3)}${unit}` + `${that.dealrelativeTime( - new Date( - curSerieOriData.absData[parma.dataIndex][0] * 1000 - ).toString() + new Date( + curSerieOriData.absData[parma.dataIndex][0] * 1000, + ).toString(), )}` + ``; } @@ -1176,9 +1184,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); @@ -1212,8 +1220,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; @@ -1221,8 +1229,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); @@ -1328,13 +1336,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]; @@ -1548,56 +1556,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')); - }); }, /** @@ -1703,15 +1711,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 + ], ); } } @@ -1807,13 +1815,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]; @@ -1900,7 +1908,7 @@ export default { this.thresholdLocal[this.decodeTrainingJobId][sampleItem.tagName] ) { delete this.thresholdLocal[this.decodeTrainingJobId][ - sampleItem.tagName + sampleItem.tagName ]; } this.currentTagName = sampleItem.tagName; @@ -2249,7 +2257,7 @@ export default { this.originDataArr.forEach((sampleObject) => { if (this.multiSelectedTagNames[sampleObject.tagName]) { this.thresholdLocal[this.decodeTrainingJobId][ - sampleObject.tagName + sampleObject.tagName ] = chartPieces; sampleObject.pieceStr = pieceStr; @@ -2260,14 +2268,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; @@ -2332,11 +2340,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; @@ -2363,7 +2371,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; @@ -2375,7 +2383,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); @@ -2383,8 +2391,8 @@ export default { } this.clearCache(); localStorage.setItem( - 'thresholdCache', - JSON.stringify(this.thresholdLocal) + 'thresholdCache', + JSON.stringify(this.thresholdLocal), ); this.delThresholdVisible = false; }, @@ -2445,7 +2453,13 @@ export default { background-color: #fff; display: flex; flex-direction: column; - + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } .cl-scalar-title { height: 56px; line-height: 56px; diff --git a/mindinsight/ui/src/views/train-manage/summary-manage.vue b/mindinsight/ui/src/views/train-manage/summary-manage.vue index 3b77a2b..25f58f1 100644 --- a/mindinsight/ui/src/views/train-manage/summary-manage.vue +++ b/mindinsight/ui/src/views/train-manage/summary-manage.vue @@ -211,6 +211,7 @@ export default { dir: profilerDir, id: trainId, path: path, + summaryPath: row.train_id, }, }); window.open(routeUrl.href, '_blank'); diff --git a/mindinsight/ui/src/views/train-manage/tensor.vue b/mindinsight/ui/src/views/train-manage/tensor.vue index eeb6427..45f1498 100644 --- a/mindinsight/ui/src/views/train-manage/tensor.vue +++ b/mindinsight/ui/src/views/train-manage/tensor.vue @@ -18,7 +18,14 @@ limitations under the License.
-
{{$t('tensors.titleText')}}
+
{{$t('tensors.titleText')}} +
+ {{$t('symbols.leftbracket')}} + {{$t('trainingDashboard.summaryDirPath')}} + {{summaryPath}} + {{$t('symbols.rightbracket')}} +
+
@@ -183,6 +190,7 @@ export default { return { tagList: [], // Tag list. trainingJobId: this.$route.query.train_id, // ID of the current training job. + summaryPath: this.$route.query.summaryPath, originDataArr: [], // List of all data. initOver: false, // Indicates whether the initialization is complete. curFullTagDic: {}, // Dictionary that contains all the current tags. @@ -1092,6 +1100,13 @@ export default { .cl-tensor-title { height: 56px; line-height: 56px; + .path-message { + display: inline-block; + line-height: 20px; + padding: 0px 4px 15px 4px; + font-weight: bold; + vertical-align: bottom; + } .cl-close-btn { width: 20px; height: 20px; diff --git a/mindinsight/ui/src/views/train-manage/training-dashboard.vue b/mindinsight/ui/src/views/train-manage/training-dashboard.vue index 2d4bd86..d8e3161 100644 --- a/mindinsight/ui/src/views/train-manage/training-dashboard.vue +++ b/mindinsight/ui/src/views/train-manage/training-dashboard.vue @@ -474,6 +474,7 @@ export default { path: '/train-manage/scalar', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); }, @@ -488,6 +489,7 @@ export default { path: '/train-manage/histogram', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); }, @@ -522,6 +524,7 @@ export default { path: '/train-manage/tensor', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); } @@ -538,6 +541,7 @@ export default { path: '/train-manage/data-map', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); }, @@ -552,6 +556,7 @@ export default { path: '/train-manage/graph', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); }, @@ -1500,6 +1505,7 @@ export default { path: '/train-manage/image', query: { train_id: this.trainingJobId, + summaryPath: this.summaryPath, }, }); }, @@ -2085,8 +2091,9 @@ export default { .path-message { display: inline-block; line-height: 20px; - padding: 18px 16px; + padding: 21px 4px 0 4px; font-weight: bold; + vertical-align: bottom; } .loading-icon { margin-left: 5px; @@ -2096,8 +2103,8 @@ export default { color: #000000; font-weight: bold; font-size: 20px; - line-height: 20px; - padding: 18px 0; + line-height: 56px; + padding: 0; } } .cl-dashboard-center { -- GitLab