Skip to content

M
mindinsight

MindSpore / mindinsight

通知 7
Star 3
Fork 2
M
mindinsight
提交 0f7165c5 编写于 作者: P ph
浏览文件
操作

fix issue

上级 f78d7f6d
隐藏空白更改
内联 并排
Showing with 233 addition and 143 deletion
mindinsight/ui/src/locales/zh-cn.json
浏览文件 @ 0f7165c5
......@@ -67,7 +67,8 @@
"samplingData": "数据抽样",
"imagesampleSwitch": "切换标签",
"invalidId": "无效的训练作业",
"summaryDirPath": "summary路径："
"summaryDirPath": "summary路径：",
"mixedItemMessage": "该参数含有多种类型数据，无法筛选展示"
},
"scalar": {
"titleText": "标量",
......
mindinsight/ui/src/views/train-manage/data-map.vue
浏览文件 @ 0f7165c5
......@@ -525,7 +525,7 @@ export default {
`<svg xmlns="http://www.w3.org/2000/svg" ` +
`xmlns:xlink="http://www.w3.org/1999/xlink" ` +
`width="${bbox.width}" height="${bbox.height}" ` +
`viewBox="${viewBoxSize}">${CommonProperty.graphDownloadStyle}<g>${svgXml}</g></svg>`;
`viewBox="${viewBoxSize}">${CommonProperty.dataMapDownloadStyle}<g>${svgXml}</g></svg>`;
// Write the svg stream encoded by base64 to the image object.
const src = `data:image/svg+xml;base64,
......
mindinsight/ui/src/views/train-manage/data-traceback.vue
浏览文件 @ 0f7165c5
......@@ -509,6 +509,7 @@ export default {
});
// The summaryList value could not be saved in the destroy state.
this.dataCheckedSummary = [];
this.tableFilter.summary_dir = {in: summaryList};
this.$store.commit('setSummaryDirList', summaryList);
if (!tempList.length) {
this.summaryDirList = [];
......@@ -967,6 +968,7 @@ export default {
sorted_name: data.prop,
sorted_type: data.order,
};
this.pagination.currentPage = 1;
params.body = Object.assign({}, tempParam, this.tableFilter);
this.queryLineagesData(params);
},
......
mindinsight/ui/src/views/train-manage/histogram.vue
浏览文件 @ 0f7165c5
......@@ -222,6 +222,14 @@ export default {
this.$store.commit('setIsReload', false);
this.isReloading = false;
}
if (this.changeAxisTimer) {
clearTimeout(this.changeAxisTimer);
this.changeAxisTimer = null;
}
if (this.changeViewTimer) {
clearTimeout(this.changeViewTimer);
this.changeViewTimer = null;
}
},
mounted() {
this.init();
......@@ -398,6 +406,7 @@ export default {
timeTypeChange(val) {
if (this.changeAxisTimer) {
clearTimeout(this.changeAxisTimer);
this.changeAxisTimer = null;
}
this.changeAxisTimer = setTimeout(() => {
this.curPageArr.forEach((item) => {
......@@ -412,6 +421,7 @@ export default {
viewTypeChange(val) {
if (this.changeViewTimer) {
clearTimeout(this.changeViewTimer);
this.changeViewTimer = null;
}
this.changeViewTimer = setTimeout(() => {
this.curPageArr.forEach((item) => {
......
mindinsight/ui/src/views/train-manage/model-traceback.vue
浏览文件 @ 0f7165c5
......@@ -151,6 +151,7 @@ export default {
'batch_size',
'device_num',
], // All keys whose values are int
keysOfMixed: [],
echart: {
chart: null,
allData: [],
......@@ -166,10 +167,7 @@ export default {
},
chartFilter: {}, // chart filter condition
tableFilter: {lineage_type: {in: ['model']}}, // table filter condition
sortInfo: {
sorted_name: 'summary_dir',
sorted_type: null,
},
sortInfo: {},
showTable: false,
noData: false,
haveCustomizedParams: false,
......@@ -281,6 +279,7 @@ export default {
selectAll: false, // Whether to select all columns
indeterminate: false,
};
this.keysOfMixed = [];
this.queryLineagesData(true);
},
/**
......@@ -324,10 +323,15 @@ export default {
tempParam.limit = this.pagination.pageSize;
tempParam.offset = this.pagination.currentPage - 1;
params.body = Object.assign(params.body, this.chartFilter);
params.body = Object.assign(
params.body,
this.chartFilter,
tempParam,
this.tableFilter,
);
} else {
params.body = Object.assign(params.body, this.tableFilter);
}
params.body = Object.assign(params.body, tempParam, this.tableFilter);
RequestService.queryLineagesData(params)
.then(
(res) => {
......@@ -344,6 +348,10 @@ export default {
this.keysOfIntValue.push(i);
} else if (customized[i].type === 'str') {
this.keysOfStringValue.push(i);
} else if (customized[i].type === 'mixed') {
// list of type mixed
this.keysOfMixed.push(i);
this.keysOfStringValue.push(i);
}
if (i.startsWith(this.replaceStr.userDefined)) {
customized[i].label = customized[i].label.replace(
......@@ -568,7 +576,16 @@ export default {
};
chartAxis.forEach((key) => {
item.value.push(i[key]);
if (
(i[key] || i[key] == 0) &&
this.keysOfMixed &&
this.keysOfMixed.length &&
this.keysOfMixed.includes(key)
) {
item.value.push(i[key].toString());
} else {
item.value.push(i[key]);
}
});
data.push(item);
});
......@@ -581,7 +598,7 @@ export default {
const values = {};
this.echart.showData.forEach((i) => {
if (i[key] || i[key] === 0) {
values[i[key]] = i[key];
values[i[key].toString()] = i[key].toString();
}
});
obj.type = 'category';
......@@ -693,6 +710,15 @@ export default {
// select use api
this.echart.chart.on('axisareaselected', (params) => {
const key = params.parallelAxisId;
if (
this.keysOfMixed &&
this.keysOfMixed.length &&
this.keysOfMixed.includes(key)
) {
this.$message.error(this.$t('modelTraceback.mixedItemMessage'));
this.initChart();
return;
}
const list = this.$store.state.selectedBarList || [];
const selectedAxisId = params.parallelAxisId;
if (list.length) {
......@@ -741,6 +767,12 @@ export default {
{},
this.chartFilter,
this.tableFilter,
);
const tableParams = {};
tableParams.body = Object.assign(
{},
this.chartFilter,
this.tableFilter,
this.sortInfo,
);
RequestService.queryLineagesData(filterParams)
......@@ -752,20 +784,47 @@ export default {
res.data.object &&
res.data.object.length
) {
let customized = {};
customized = JSON.parse(JSON.stringify(res.data.customized));
const customizedKeys = Object.keys(customized);
if (customizedKeys.length) {
this.keysOfStringValue = [
'summary_dir',
'network',
'optimizer',
'loss_function',
'train_dataset_path',
'test_dataset_path',
'dataset_mark',
];
this.keysOfIntValue = [
'train_dataset_count',
'test_dataset_count',
'epoch',
'batch_size',
'device_num',
];
this.keysOfMixed = [];
customizedKeys.forEach((i) => {
if (customized[i].type === 'int') {
this.keysOfIntValue.push(i);
} else if (customized[i].type === 'str') {
this.keysOfStringValue.push(i);
} else if (customized[i].type === 'mixed') {
// list of type mixed
this.keysOfMixed.push(i);
this.keysOfStringValue.push(i);
}
});
}
const list = this.setDataOfModel(res.data.object);
const summaryDirList = list.map((i) => i.summary_dir);
this.$store.commit('setSummaryDirList', summaryDirList);
this.echart.showData = this.echart.brushData = list;
this.initChart();
this.table.data = this.echart.brushData.slice(
0,
this.pagination.pageSize,
);
this.pagination.currentPage = 1;
this.pagination.total = this.echart.brushData.length;
this.$refs.table.clearSelection();
this.getTableList(tableParams);
} else {
this.summaryDirList = [];
this.$store.commit('setSummaryDirList', []);
......@@ -779,6 +838,26 @@ export default {
}
});
},
/**
* Get table data
* @param {Object} tableParams
*/
getTableList(tableParams) {
RequestService.queryLineagesData(tableParams)
.then(
(res) => {
if (res && res.data && res.data.object && res.data.object.length) {
const list = this.setDataOfModel(res.data.object);
this.table.data = list.slice(0, this.pagination.pageSize);
this.pagination.currentPage = 1;
this.pagination.total = this.echart.brushData.length;
this.$refs.table.clearSelection();
}
},
(error) => {},
)
.catch(() => {});
},
/**
* Resetting the Eechart
*/
......@@ -790,6 +869,7 @@ export default {
this.showTable = false;
this.chartFilter = {};
this.tableFilter.summary_dir = undefined;
this.sortInfo = {};
this.pagination.currentPage = 1;
this.echart.allData = [];
if (this.echart.chart) {
......
mindinsight/ui/src/views/train-manage/scalar.vue
浏览文件 @ 0f7165c5
......@@ -34,10 +34,9 @@ limitations under the License.
<!--operation area -->
<div class="cl-eval-operate-content"
v-show="!compare">
<multiselectGroupComponents ref="multiselectGroupComponents"
:checkListArr="tagOperateList"
@selectedChange="tagSelectedChanged"
></multiselectGroupComponents>
<multiselectGroupComponents ref="multiselectGroupComponents"
:checkListArr="tagOperateList"
@selectedChange="tagSelectedChanged"></multiselectGroupComponents>
</div>
<!-- Slider -->
<div class="cl-eval-slider-operate-content"
......@@ -56,14 +55,12 @@ limitations under the License.
<el-slider v-model="smoothValue"
:step="0.01"
:max="0.99"
@input="updataInputValue"
></el-slider>
<el-input v-model="smoothValueNumber"
class="w60"
@input="smoothValueChange"
@blur="smoothValueBlur"
></el-input>
@input="updataInputValue"></el-slider>
<el-input v-model="smoothValueNumber"
class="w60"
@input="smoothValueChange"
@blur="smoothValueBlur"></el-input>
</div>
<!-- Content display -->
<div class="cl-eval-show-data-content"
......@@ -290,7 +287,7 @@ export default {
const runNmeColor = CommonProperty.commonColorArr[0];
data.tags.forEach((tagObj) => {
if (!this.oriDataDictionaries[tagObj]) {
this.oriDataDictionaries[tagObj]=true;
this.oriDataDictionaries[tagObj] = true;
// Add the tag list
tempTagList.push({
label: tagObj,
......@@ -337,7 +334,7 @@ export default {
this.initOver = true;
this.$nextTick(() => {
this.multiSelectedTagNames=this.$refs.multiselectGroupComponents.updateSelectedDic();
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
// Obtains data on the current page
this.updateTagInPage();
......@@ -365,10 +362,10 @@ export default {
const curPageArr = [];
for (let i = startIndex; i < endIndex; i++) {
const sampleItem=this.curFilterSamples[i];
const sampleItem = this.curFilterSamples[i];
if (sampleItem) {
sampleItem.updateFlag=true;
sampleItem.show=true;
sampleItem.updateFlag = true;
sampleItem.show = true;
curPageArr.push(sampleItem);
}
}
......@@ -381,110 +378,110 @@ export default {
* Load the data on the current page
*/
updateCurPageSamples() {
this.curPageArr.forEach((sampleObject)=>{
const sampleIndex=sampleObject.sampleIndex;
this.curPageArr.forEach((sampleObject) => {
const sampleIndex = sampleObject.sampleIndex;
if (!sampleObject) {
return;
}
sampleObject.updateFlag = true;
const params = {
train_id: this.trainingJobId,
tag: sampleObject.tagName,
};
RequestService.getScalarsSample(params).then((res)=>{
// error
if (!res || !res.data || !res.data.metadatas) {
if (sampleObject.charObj) {
sampleObject.charObj.clear();
}
return;
}
let hasInvalidData = false;
if (sampleObject.charObj) {
sampleObject.charObj.showLoading();
}
RequestService.getScalarsSample(params)
.then((res) => {
// error
if (!res || !res.data || !res.data.metadatas) {
if (sampleObject.charObj) {
sampleObject.charObj.clear();
}
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;
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;
}
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,
]);
});
// 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;
sampleObject.charData.oriData[0] = tempObject;
if (hasInvalidData) {
this.$set(sampleObject, 'invalidData', true);
}
sampleObject.charData.charOption = this.formateCharOption(
sampleIndex,
);
if (hasInvalidData) {
this.$set(sampleObject, 'invalidData', true);
}
sampleObject.charData.charOption = this.formateCharOption(
sampleIndex,
);
this.$forceUpdate();
this.$forceUpdate();
this.$nextTick(() => {
if (sampleObject.charObj) {
sampleObject.charObj.hideLoading();
}
this.$nextTick(() => {
if (sampleObject.charObj) {
sampleObject.charObj.hideLoading();
}
// Draw chart
if (!this.compare) {
this.updateOrCreateChar(sampleIndex);
} else {
this.abort = true;
}
});
}).catch((e)=>{
if (sampleObject.charObj) {
sampleObject.charObj.clear();
}
});
// Draw chart
if (!this.compare) {
this.updateOrCreateChar(sampleIndex);
} else {
this.abort = true;
}
});
})
.catch((e) => {
if (sampleObject.charObj) {
sampleObject.charObj.clear();
}
});
});
},
/**
* Formatting Chart Data
* @param {Number} sampleIndex Chart subscript
......@@ -499,7 +496,7 @@ export default {
let returnFlag = false;
const seriesData = [];
const oriData = sampleObject.charData.oriData;
const runName=sampleObject.runNames;
const runName = sampleObject.runNames;
const curBackName = runName + this.backendString;
const dataObj = {
name: runName,
......@@ -886,9 +883,11 @@ export default {
if (sampleObject.fullScreen) {
sampleObject.charData.charOption.toolbox.feature.myToolFullScreen.iconStyle.borderColor =
'#3E98C5';
sampleObject.charData.charOption.grid.right = 80;
} else {
sampleObject.charData.charOption.toolbox.feature.myToolFullScreen.iconStyle.borderColor =
'#6D7278';
sampleObject.charData.charOption.grid.right = 10;
}
sampleObject.updateFlag = true;
......@@ -901,14 +900,13 @@ export default {
}, 0);
},
/**
* Update Chart by tag
* @param {Boolean} noPageDataNumChange No new data is added or deleted
*/
updateTagInPage(noPageDataNumChange) {
const curFilterSamples=[];
const curFilterSamples = [];
// Obtains the chart subscript
this.originDataArr.forEach((sampleItem) => {
if (this.multiSelectedTagNames[sampleItem.tagName]) {
......@@ -1012,13 +1010,12 @@ export default {
if (!selectedItemDict) {
return;
}
this.multiSelectedTagNames=selectedItemDict;
this.multiSelectedTagNames = selectedItemDict;
// Reset to the first page
this.pageIndex=0;
this.pageIndex = 0;
this.updateTagInPage();
},
/**
*window resize
*/
......@@ -1050,7 +1047,7 @@ export default {
this.tagOperateList = [];
this.pageIndex = 0;
this.originDataArr = [];
this.oriDataDictionaries={};
this.oriDataDictionaries = {};
this.curPageArr = [];
this.tagPropsList = [];
this.propsList = [];
......@@ -1090,10 +1087,10 @@ export default {
if (!oriData) {
return false;
}
const newTagDictionaries={}; // Index of the tag in the new data
const newTagDictionaries = {}; // Index of the tag in the new data
let dataRemoveFlag = false;
oriData.tags.forEach((tagName) => {
newTagDictionaries[tagName]=true;
newTagDictionaries[tagName] = true;
});
// Delete the tag that does not exist
const oldTagListLength = this.tagOperateList.length;
......@@ -1132,7 +1129,7 @@ export default {
const runColor = CommonProperty.commonColorArr[0];
oriData.tags.forEach((tagObj) => {
if (!this.oriDataDictionaries[tagObj]) {
this.oriDataDictionaries[tagObj]=true;
this.oriDataDictionaries[tagObj] = true;
this.tagOperateList.push({
label: tagObj,
checked: true,
......@@ -1198,7 +1195,7 @@ export default {
const tagAddFlag = this.checkNewDataAndComplete(data);
this.$nextTick(() => {
this.multiSelectedTagNames=this.$refs.multiselectGroupComponents.updateSelectedDic();
this.multiSelectedTagNames = this.$refs.multiselectGroupComponents.updateSelectedDic();
this.updateTagInPage(!tagRemoveFlag && !tagAddFlag);
this.resizeCallback();
......@@ -1209,7 +1206,7 @@ export default {
// Initial chart data
data.tags.forEach((tagObj) => {
// Check whether the tag with the same name exists
// Check whether the tag with the same name exists
tempTagList.push({
label: tagObj,
checked: true,
......@@ -1266,7 +1263,7 @@ export default {
if (this.firstNum === 0) {
return;
}
this.smoothValueNumber=Number(val);
this.smoothValueNumber = Number(val);
if (this.smoothSliderValueTimer) {
clearTimeout(this.smoothSliderValueTimer);
this.smoothSliderValueTimer = null;
......@@ -1279,26 +1276,26 @@ export default {
smoothValueChange(val) {
if (!isNaN(val)) {
if (Number(val)===0) {
this.smoothValue=0;
if (Number(val) === 0) {
this.smoothValue = 0;
}
if (Number(val)<0) {
this.smoothValue=0;
this.smoothValueNumber=0;
if (Number(val) < 0) {
this.smoothValue = 0;
this.smoothValueNumber = 0;
}
if (Number(val)>0) {
if (Number(val)>0.99) {
this.smoothValue=0.99;
this.smoothValueNumber=0.99;
if (Number(val) > 0) {
if (Number(val) > 0.99) {
this.smoothValue = 0.99;
this.smoothValueNumber = 0.99;
} else {
this.smoothValue=Number(val);
this.smoothValue = Number(val);
}
}
}
},
smoothValueBlur() {
this.smoothValueNumber=this.smoothValue;
this.smoothValueNumber = this.smoothValue;
},
/**
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或