!148 UI fix graph tip issue

Merge pull request !148 from 潘慧/master_ph

mindinsight/ui/src/locales/zh-cn.json

@@ -183,7 +183,8 @@
     "guideContent2": "计算图中有命名空间节点，算子节点，虚拟节点，聚合节点，常量节点等几种类型节点。其中 \"Default\" 表示正向传播，\"Gradients\" 表示反向传播。",
     "guideContent3": "计算图中存在数据边和控制边。其中数据边表示数据的输入，控制边表示节点之间执行依赖关系。",
     "next": "下一步",
-    "finish": "完成"
+    "finish": "完成",
+    "dataTooLarge": "节点和边的数量过多，导致打开失败"
   },
   "profiler": {
     "titleText": "性能分析",

mindinsight/ui/src/views/train-manage/graph.vue

@@ -846,6 +846,7 @@ export default {
           title.textContent = title.textContent.split('^')[0];
         }
       });
+      d3.selectAll('g.edge>title').remove();
       // The graph generated by the plug-in has a useless title and needs to be deleted.
       document.querySelector('#graph g#graph0 title').remove();
       this.initGraphRectData();
@@ -969,10 +970,20 @@ export default {
                   this.loading.show = false;
                 },
             )
-            .catch(() => {
+            .catch((error) => {
             // A non-Google Chrome browser may not work properly.
               this.loading.show = false;
-              this.$bus.$emit('showWarmText', true);
+              if (error.includes('larger than maximum 65535 allowed')) {
+                this.$message.error(this.$t('graph.dataTooLarge'));
+              } else {
+                this.$bus.$emit('showWarmText', true);
+              }
+              if (name && this.allGraphData[name]) {
+                this.allGraphData[name].isUnfold = false;
+                this.allGraphData[name].children = [];
+                this.allGraphData[name].size = [];
+                this.allGraphData[name].html = '';
+              }
             });
       }, 50);
     },