diff --git a/mindinsight/ui/src/locales/zh-cn.json b/mindinsight/ui/src/locales/zh-cn.json
index b6b3a4f8..665ef6cd 100644
--- a/mindinsight/ui/src/locales/zh-cn.json
+++ b/mindinsight/ui/src/locales/zh-cn.json
@@ -67,7 +67,8 @@
"samplingData": "数据抽样",
"imagesampleSwitch": "切换标签",
"invalidId": "无效的训练作业",
- "summaryDirPath": "summary路径："
+ "summaryDirPath": "summary路径：",
+ "mixedItemMessage": "该参数含有多种类型数据，无法筛选展示"
},
"scalar": {
"titleText": "标量",
diff --git a/mindinsight/ui/src/views/train-manage/data-map.vue b/mindinsight/ui/src/views/train-manage/data-map.vue
index c8c09382..802f0338 100644
--- a/mindinsight/ui/src/views/train-manage/data-map.vue
+++ b/mindinsight/ui/src/views/train-manage/data-map.vue
@@ -525,7 +525,7 @@ export default {
``;
+ `viewBox="${viewBoxSize}">${CommonProperty.dataMapDownloadStyle}${svgXml}`;
// Write the svg stream encoded by base64 to the image object.
const src = `data:image/svg+xml;base64,
diff --git a/mindinsight/ui/src/views/train-manage/data-traceback.vue b/mindinsight/ui/src/views/train-manage/data-traceback.vue
index dd050106..91a70fea 100644
--- a/mindinsight/ui/src/views/train-manage/data-traceback.vue
+++ b/mindinsight/ui/src/views/train-manage/data-traceback.vue
@@ -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);
},
diff --git a/mindinsight/ui/src/views/train-manage/histogram.vue b/mindinsight/ui/src/views/train-manage/histogram.vue
index 050417d6..20c0bc78 100644
--- a/mindinsight/ui/src/views/train-manage/histogram.vue
+++ b/mindinsight/ui/src/views/train-manage/histogram.vue
@@ -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) => {
diff --git a/mindinsight/ui/src/views/train-manage/model-traceback.vue b/mindinsight/ui/src/views/train-manage/model-traceback.vue
index cbd9ed2a..78cd4e84 100644
--- a/mindinsight/ui/src/views/train-manage/model-traceback.vue
+++ b/mindinsight/ui/src/views/train-manage/model-traceback.vue
@@ -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) {
diff --git a/mindinsight/ui/src/views/train-manage/scalar.vue b/mindinsight/ui/src/views/train-manage/scalar.vue
index 46097d77..32820806 100644
--- a/mindinsight/ui/src/views/train-manage/scalar.vue
+++ b/mindinsight/ui/src/views/train-manage/scalar.vue
@@ -34,10 +34,9 @@ limitations under the License.
-
+
-
-
+ @input="updataInputValue">
+
+
{
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;
},
/**