Skip to content

M
mindinsight

MindSpore / mindinsight

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

!546 Add training log path to training panel sub-page and profiling page 

Merge pull request !546 from 秦君艳/path
上级 1491de23 8beb39ba
显示空白变更内容
内联 并排
Showing with 389 addition and 273 deletion
mindinsight/ui/src/views/profiling/profiling.vue
浏览文件 @ 362a05e4
......@@ -20,6 +20,10 @@ limitations under the License.
:class="{collapse:collapse}">
<div class="helper"
v-show="!collapse">
<div class="summary-path">
{{$t('trainingDashboard.summaryDirPath')}}
<span>{{ summaryPath}}</span>
</div>
<div class="cur-card">
<label>{{$t('profiling.curCard')}}</label>
<el-select v-model="curDashboardInfo.curCardNum"
......@@ -61,6 +65,7 @@ import RequestService from '../../services/request-service';
export default {
data() {
return {
summaryPath: this.$route.query.summaryPath,
tipsArrayList: [
'step_trace-iter_interval',
'minddata_pipeline-general',
......@@ -331,11 +336,26 @@ export default {
}
.helper {
padding: 32px;
padding-top: 20px;
height: 100%;
overflow-y: auto;
margin-left: 24px;
background: #edf0f5;
word-wrap: break-word;
.summary-path {
line-height: 24px;
font-size: 14px;
overflow: hidden;
font-weight: bold;
padding-bottom: 10px;
word-break: break-all;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
.nowrap-style {
white-space: nowrap;
}
......
mindinsight/ui/src/views/train-manage/data-map.vue
浏览文件 @ 362a05e4
......@@ -19,7 +19,14 @@ limitations under the License.
<div class="cl-data-map-manage">
<div class='data-map-p32'>
<div class="cl-title cl-data-map-title">
<div class="cl-title-left">{{$t('dataMap.titleText')}}</div>
<div class="cl-title-left">{{$t('dataMap.titleText')}}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
</div>
<div class="cl-title-right">
<div class="cl-close-btn"
@click="jumpToTrainDashboard">
......@@ -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%;
......
mindinsight/ui/src/views/train-manage/graph.vue
浏览文件 @ 362a05e4
......@@ -59,6 +59,12 @@ limitations under the License.
<div class="cl-title cl-graph-title">
<div class="cl-title-left">
{{ $t('graph.titleText') }}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
<span @click="showUserGuide"
class="guide">
<i class="guide-icon"></i>
......@@ -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;
......
mindinsight/ui/src/views/train-manage/histogram.vue
浏览文件 @ 362a05e4
......@@ -18,7 +18,14 @@ limitations under the License.
<div class="histogram-bk">
<!-- Title area -->
<div class="cl-title cl-histogram-title">
<div class="cl-title-left">{{$t('histogram.titleText')}}</div>
<div class="cl-title-left">{{$t('histogram.titleText')}}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
</div>
<div class="cl-title-right">
<div class="cl-close-btn"
@click="jumpToTrainDashboard">
......@@ -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,7 +271,10 @@ export default {
document.title = this.$t('histogram.titleText') + '-MindInsight';
return;
}
document.title = decodeURIComponent(this.$route.query.train_id) +'-' + this.$t('histogram.titleText') +
document.title =
decodeURIComponent(this.$route.query.train_id) +
'-' +
this.$t('histogram.titleText') +
'-MindInsight';
this.getOriginData();
if (this.isTimeReload) {
......@@ -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;
......
mindinsight/ui/src/views/train-manage/image.vue
浏览文件 @ 362a05e4
......@@ -18,7 +18,14 @@ limitations under the License.
<div class="cl-image-manage">
<div class="image-bk">
<div class="cl-title cl-image-title">
<div class="cl-title-left">{{$t('images.titleText')}}</div>
<div class="cl-title-left">{{$t('images.titleText')}}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
</div>
<div class="cl-title-right">
<div class="cl-close-btn"
@click="jumpToTrainDashboard">
......@@ -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 {
......
mindinsight/ui/src/views/train-manage/scalar.vue
浏览文件 @ 362a05e4
......@@ -19,7 +19,14 @@ limitations under the License.
<div class="scalar-bk">
<div class="cl-title cl-scalar-title"
v-show="originDataArr.length>0">
<div class="cl-title-left">{{$t("scalar.titleText")}}</div>
<div class="cl-title-left">{{$t("scalar.titleText")}}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
</div>
<div class="cl-title-right">
<ScalarButton class="scalar-btn"
:right="scalarCompare"
......@@ -291,6 +298,7 @@ export default {
compare: false, // Comparison Page
scalarCompare: this.$t('scalar')['comparison'],
trainingJobId: this.$route.query.train_id, // ID of the current training job
summaryPath: this.$route.query.summaryPath,
thresholdDialogVisible: false,
delThresholdVisible: false,
currentTagName: '',
......@@ -298,8 +306,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 +420,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 +448,7 @@ export default {
if (localStorage.getItem('thresholdCache')) {
try {
this.thresholdLocal = JSON.parse(
localStorage.getItem('thresholdCache')
localStorage.getItem('thresholdCache'),
);
this.clearCache();
} catch (e) {
......@@ -468,7 +476,7 @@ export default {
delete this.thresholdLocal[this.decodeTrainingJobId];
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal)
JSON.stringify(this.thresholdLocal),
);
}
}
......@@ -679,7 +687,7 @@ export default {
}
sampleObject.charData.charOption = this.formateCharOption(
sampleIndex
sampleIndex,
);
const tempOption = sampleObject.charData.charOption;
if (
......@@ -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,7 +1090,7 @@ 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[
......@@ -1090,8 +1098,8 @@ export default {
][0].toFixed(3)}${unit}</td>` +
`<td>${that.dealrelativeTime(
new Date(
curSerieOriData.absData[parma.dataIndex][0] * 1000
).toString()
curSerieOriData.absData[parma.dataIndex][0] * 1000,
).toString(),
)}</td>` +
`</tr>`;
}
......@@ -1177,8 +1185,8 @@ export default {
) {
const tempStorgeArr = JSON.parse(
JSON.stringify(
this.thresholdLocal[this.decodeTrainingJobId][sampleObject.tagName]
)
this.thresholdLocal[this.decodeTrainingJobId][sampleObject.tagName],
),
);
let pieceStr = '';
pieceStr = this.formatePieceStr(tempStorgeArr);
......@@ -1213,7 +1221,7 @@ export default {
if (sampleObject.updateFlag) {
sampleObject.charObj.setOption(
sampleObject.charData.charOption,
sampleObject.dataRemove
sampleObject.dataRemove,
);
sampleObject.updateFlag = false;
sampleObject.dataRemove = false;
......@@ -1222,7 +1230,7 @@ export default {
// creat chart
sampleObject.charObj = echarts.init(
document.getElementById(sampleObject.domId),
null
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];
......@@ -1705,13 +1713,13 @@ export default {
serie.data = this.formateSmoothData(
sampleObject.charData.oriData[index / 2].logData[
this.curBenchX
]
],
);
} else {
serie.data = this.formateSmoothData(
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];
......@@ -2267,7 +2275,7 @@ export default {
}
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal)
JSON.stringify(this.thresholdLocal),
);
this.thresholdDialogVisible = false;
......@@ -2384,7 +2392,7 @@ export default {
this.clearCache();
localStorage.setItem(
'thresholdCache',
JSON.stringify(this.thresholdLocal)
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;
......
mindinsight/ui/src/views/train-manage/summary-manage.vue
浏览文件 @ 362a05e4
......@@ -211,6 +211,7 @@ export default {
dir: profilerDir,
id: trainId,
path: path,
summaryPath: row.train_id,
},
});
window.open(routeUrl.href, '_blank');
......
mindinsight/ui/src/views/train-manage/tensor.vue
浏览文件 @ 362a05e4
......@@ -18,7 +18,14 @@ limitations under the License.
<div class="tensor-bk">
<!-- Title area -->
<div class="cl-title cl-tensor-title">
<div class="cl-title-left">{{$t('tensors.titleText')}}</div>
<div class="cl-title-left">{{$t('tensors.titleText')}}
<div class="path-message">
<span>{{$t('symbols.leftbracket')}}</span>
<span>{{$t('trainingDashboard.summaryDirPath')}}</span>
<span>{{summaryPath}}</span>
<span>{{$t('symbols.rightbracket')}}</span>
</div>
</div>
<div class="cl-title-right">
<div class="cl-close-btn"
@click="jumpToTrainDashboard">
......@@ -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;
......
mindinsight/ui/src/views/train-manage/training-dashboard.vue
浏览文件 @ 362a05e4
......@@ -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 {
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或