增加可控制可视化结构的显示/隐藏接口

src/Model/modelConstructor.ts

@@ -11,8 +11,10 @@ export type LayoutGroup = {
     link: Link[];
     pointer: Pointer[];
     layouter: Layouter;
+    layouterName: string;
     options: LayoutGroupOptions;
     modelList: Model[];
+    isHide: boolean;
 };
 
 
@@ -70,7 +72,9 @@ export class ModelConstructor {
                 pointer: pointerList,
                 options: options,
                 layouter: layouter,
-                modelList: [...elementList, ...pointerList]
+                modelList: [...elementList, ...pointerList],
+                layouterName,
+                isHide: false
             });
         });
         

src/Model/modelData.ts

@@ -42,6 +42,7 @@ export interface G6EdgeModel {
 export class Model {
     id: string;
     type: string;
+    isLeak: boolean;
     
     props: G6NodeModel | G6EdgeModel;
     shadowG6Item;
@@ -55,6 +56,7 @@ export class Model {
         this.renderG6Item = null;
         this.G6Item = null;
         this.props = <G6NodeModel | G6EdgeModel>{ };
+        this.isLeak = false;
     }
 
     /**

src/View/container/container.ts

@@ -1,6 +1,6 @@
 import { Engine } from "../../engine";
 import { Model, Pointer } from "../../Model/modelData";
-import { AnimationOptions, InteractionOptions, LayoutGroupOptions, LayoutOptions } from "../../options";
+import { AnimationOptions, InteractionOptions, LayoutGroupOptions } from "../../options";
 import { SV } from "../../StructV";
 import { Animations } from "../animation";
 import { g6Behavior, Renderer } from "../renderer";
@@ -138,9 +138,11 @@ export class Container {
                 duration: this.animationsOptions.duration,
                 timingFunction: this.animationsOptions.timingFunction,
                 callback: () => {
-                    this.renderer.removeModel(item);
-                    item.renderG6Item = item.G6Item = null;
-    
+                    if(item.isLeak === false) {
+                        this.renderer.removeModel(item);
+                        item.renderG6Item = item.G6Item = null;
+                    }
+                    
                     counter++;
     
                     if(counter === removeModels.length) {

src/View/viewManager.ts

@@ -102,30 +102,37 @@ export class ViewManager {
         const leakModelList: Model[] = prevModelList.filter(item => !modelList.find(n => n.id === item.id)),
               elements: Element[] = <Element[]>leakModelList.filter(item => item instanceof Element && item.freed === false),
               links: Link[] = <Link[]>leakModelList.filter(item => item instanceof Link),
-              elementIds: string[] = [];
+              elementIds: string[] = [],
+              res: Model[] = [];
 
-            elements.forEach(item => {
-                elementIds.push(item.id);
-                item.set('style', {
-                    fill: '#ccc'
-                });
+        elements.forEach(item => {
+            elementIds.push(item.id);
+            item.set('style', {
+                fill: '#ccc'
+            });
+        });
+
+        for(let i = 0; i < links.length; i++) {
+            let sourceId = links[i].element.id,
+                targetId = links[i].target.id;
+
+            links[i].set('style', {
+                stroke: '#333'
             });
 
-            for(let i = 0; i < links.length; i++) {
-                let sourceId = links[i].element.id,
-                    targetId = links[i].target.id;
-
-                links[i].set('style', {
-                    stroke: '#333'
-                });
-
-                if(elementIds.find(item => item === sourceId) === undefined || elementIds.find(item => item === targetId) === undefined) {
-                    links.splice(i, 1);
-                    i--;
-                }
+            if(elementIds.find(item => item === sourceId) === undefined || elementIds.find(item => item === targetId) === undefined) {
+                links.splice(i, 1);
+                i--;
             }
+        }
 
-        return [...elements, ...links];
+        res.push(...elements, ...links);
+
+        res.map(item => {
+            item.isLeak = true;
+        });
+
+        return res;
     }
 
     // ----------------------------------------------------------------------------------------------
@@ -206,12 +213,14 @@ export class ViewManager {
 
         if(this.leakContainer) {
             this.mainContainer.afterRemoveModels(() => {
-                this.leakContainer.render(leakModelList);
+                
+            });
+
+            this.leakContainer.render(leakModelList);
 
                 if(leakModelList.length) {
                     EventBus.emit('onLeak', leakModelList);
                 }
-            });
         }
 
         this.prevModelList = modelList;

src/engine.ts

@@ -1,6 +1,6 @@
 import { Element, Link, Pointer } from "./Model/modelData";
 import { Sources } from "./sources";
-import { ModelConstructor } from "./Model/modelConstructor";
+import { LayoutGroupTable, ModelConstructor } from "./Model/modelConstructor";
 import { AnimationOptions, EngineOptions, InteractionOptions, LayoutGroupOptions, ViewOptions } from "./options";
 import { ViewManager } from "./View/viewManager";
 import { SV } from "./StructV";
@@ -11,6 +11,7 @@ export class Engine {
     private modelConstructor: ModelConstructor = null;
     private viewManager: ViewManager
     private prevStringSourceData: string;
+    private layoutGroupTable: LayoutGroupTable;
     
     public engineOptions: EngineOptions;
     public viewOptions: ViewOptions;
@@ -81,10 +82,10 @@ export class Engine {
         this.prevStringSourceData = stringSourceData;
 
         // 1 转换模型（data => model）
-        const layoutGroupTable = this.modelConstructor.construct(sourceData);
+        this.layoutGroupTable = this.modelConstructor.construct(sourceData);
         
         // 2 渲染（使用g6进行渲染）
-        this.viewManager.renderAll(layoutGroupTable);
+        this.viewManager.renderAll(this.layoutGroupTable);
     }
 
     /**
@@ -175,6 +176,29 @@ export class Engine {
         return links;
     }
 
+    /**
+     * 隐藏某些组
+     * @param groupNames 
+     */
+    public hideGroups(groupNames: string | string[]) {
+        const names = Array.isArray(groupNames)? groupNames: [groupNames],
+              instance = this.viewManager.getG6Instance();
+
+        this.layoutGroupTable.forEach(item => {
+            const hasName = names.find(name => name === item.layouterName);
+
+            if(hasName && !item.isHide) {
+                item.modelList.forEach(model => instance.hideItem(model.G6Item));
+                item.isHide = true;
+            }
+
+            if(!hasName && item.isHide) {
+                item.modelList.forEach(model => instance.showItem(model.G6Item));
+                item.isHide = false;
+            }
+        });
+    }
+
     /**
      * 调整容器尺寸
      * @param containerName