修改外部指针id，增加自定义的三叉树

2022-03-17 15:15:10 +08:00
parent 7e3378bb82
commit 62c7e91b97
6 changed files with 469 additions and 215 deletions
@@ -48,6 +48,7 @@ export class ModelConstructor {
 	public construct(sources: Sources): LayoutGroupTable {
 		const layoutGroupTable = new Map<string, LayoutGroup>(),
 			layoutMap: { [key: string]: LayoutCreator } = SV.registeredLayout;
+      

 		Object.keys(sources).forEach(group => {
 			let sourceGroup = sources[group],
@@ -301,7 +302,8 @@ export class ModelConstructor {
 				// 若没有指针字段的结点则跳过
 				if (!markerData) continue;

-				let id = `${group}[${name}(${Array.isArray(markerData) ? markerData.join('-') : markerData})]`,
+				let id = `[${name}(${Array.isArray(markerData) ? markerData.join('-') : markerData})]`,
+        
 					marker = new SVMarker(id, name, group, layout, markerData, node, markerOptions[name]);

 				markerList.push(marker);
@@ -349,6 +351,7 @@ export class ModelConstructor {
 	): SVNode {
 		let label: string | string[] = this.resolveNodeLabel(options.label, sourceNode),
 			id = `${sourceNodeType}(${sourceNode.id.toString()})`,
+      
 			node = new SVNode(id, sourceNodeType, group, layout, sourceNode, label, options);

 		if (node.freed) {
@@ -0,0 +1,146 @@
+import { Util } from '../Common/util';
+
+export default Util.registerShape(
+	'tri-tree-node',
+	{
+    draw(cfg, group) {
+        cfg.size = cfg.size;
+
+        const width = cfg.size[0],
+              height = cfg.size[1];
+
+        const wrapperRect = group.addShape('rect', {
+            attrs: {
+                x: width / 2,
+                y: height / 2,
+                width: width,
+                height: height,
+                stroke: cfg.style.stroke || '#333',
+                cursor: cfg.style.cursor,
+                fill: '#eee'
+            },
+            name: 'wrapper'
+        });
+
+        group.addShape('rect', {
+            attrs: {
+                x: width / 4 + width / 2,
+                y: height / 2,
+                width: width / 2,
+                height: height / 4,
+                fill: '#eee',
+                stroke: cfg.style.stroke || '#333',
+                cursor: cfg.style.cursor
+            },
+            name: 'top',
+            draggable: true
+        });
+
+        group.addShape('rect', {
+            attrs: {
+                x: width / 4 + width / 2,
+                y: height / 2 + height / 4,
+                width: width / 2,
+                height: height / 4 * 3,
+                fill: cfg.color || cfg.style.fill,
+                stroke: cfg.style.stroke || '#333',
+                cursor: cfg.style.cursor
+            },
+            name: 'bottom',
+            draggable: true
+        });
+        const style = (cfg.labelCfg && cfg.labelCfg.style) || {};
+        if (cfg.label) {
+            
+            group.addShape('text', {
+                attrs: {
+                    x: width, // 居中
+                    y: height + height / 8,
+                    textAlign: 'center',
+                    textBaseline: 'middle',
+                    text: cfg.label,
+                    fill: style.fill || '#000',
+                    fontSize: style.fontSize || 16,
+                    cursor: cfg.style.cursor
+                },
+                name: 'text',
+                draggable: true
+            });
+        }
+        const isLeftEmpty =
+        !cfg.child || cfg.child[0] === undefined || cfg.child[0] === undefined || cfg.child[0] == '0x0',
+              isRightEmpty =
+        !cfg.child || cfg.child[1] === undefined || cfg.child[1] === undefined || cfg.child[1] == '0x0',
+        isparentEmpty = cfg.parent == "0x0" || cfg.l_parent == "0x0" || cfg.r_parent == "0x0";
+
+
+        if (isparentEmpty) {
+          {
+            group.addShape('text', {
+                attrs: {
+                    x: width, // 居中
+                    y: height / 4 * 3,
+                    textAlign: 'center',
+                    textBaseline: 'middle',
+                    text: "^",
+                    fill: style.fill || '#000',
+                    fontSize: style.fontSize || 14,
+                    cursor: cfg.style.cursor
+                },
+                name: 'parent',
+                draggable: true
+            });
+        }
+        }
+
+    //节点没有左孩子节点时
+    if (isLeftEmpty) {
+      group.addShape('text', {
+        attrs: {
+          x: width * (5 / 8),
+          y: height * (8 / 7),
+          textAlign: 'center',
+          textBaseline: 'middle',
+          text: '^',
+          fill: style.fill || '#000',
+          fontSize: 16,
+          cursor: cfg.style.cursor,
+        },
+        name: 'text',
+        draggable: true,
+      });
+    }
+    //节点没有右孩子节点时
+    if (isRightEmpty) {
+      group.addShape('text', {
+        attrs: {
+          x: width * (11 / 8),
+          y: height * (8 / 7),
+          textAlign: 'center',
+          textBaseline: 'middle',
+          text: '^',
+          fill: style.fill || '#000',
+          fontSize: 16,
+          cursor: cfg.style.cursor,
+        },
+        name: 'text',
+        draggable: true,
+      });
+    }
+
+
+        return wrapperRect;
+    },
+
+    getAnchorPoints() {
+        return [
+            [0.125, 0.5],
+            [0.875, 0.5],
+            [0.4, 1],
+            [0.5, 0],
+            [0.5, 0.125],
+            [0.6, 1],
+        ];
+    },
+}
+);
@@ -13,6 +13,7 @@ import G6 from '@antv/g6';
 import Pointer from "./RegisteredShape/pointer";
 import LinkListNode from "./RegisteredShape/linkListNode";
 import BinaryTreeNode from "./RegisteredShape/binaryTreeNode";
+import TriTreeNode from "./RegisteredShape/triTreeNode";
 import CLenQueuePointer from "./RegisteredShape/clenQueuePointer";
 import TwoCellNode from "./RegisteredShape/twoCellNode";
 import ThreeCellNode from "./RegisteredShape/threeCellNode";
@@ -65,6 +66,7 @@ SV.registeredShape = [
    Pointer, 
    LinkListNode, 
    BinaryTreeNode, 
+    TriTreeNode,
    TwoCellNode,
    ThreeCellNode,
    Cursor,
@@ -92,5 +94,6 @@ SV.registerLayout = function(name: string, layoutCreator: LayoutCreator) {
    }
    
    SV.registeredLayout[name] = layoutCreator;
+    
 };