Merge pull request #184 from chiayenhung/horizontal-tree

Horizontal tree
uber · Jan 8, 2020 · ccbc78d · ccbc78d
2 parents 5bc40de + 321d82e
commit ccbc78d
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 13 deletions.
diff --git a/src/components/edge.js b/src/components/edge.js
@@ -95,9 +95,7 @@ class Edge extends React.Component<IEdgeProps> {
     viewWrapperElem: HTMLDivElement | HTMLDocument = document
   ) {
     return viewWrapperElem.querySelector(
-      `#edge-${edge.source}-${
-        edge.target
-      }-container>.edge-container>.edge>.edge-path`
+      `#edge-${edge.source}-${edge.target}-container>.edge-container>.edge>.edge-path`
     );
   }
 

diff --git a/src/components/graph-view.js b/src/components/graph-view.js
@@ -412,8 +412,8 @@ class GraphView extends React.Component<IGraphViewProps, IGraphViewState> {
           forceRender ||
           !prevEdge || // selection change
           !GraphUtils.isEqual(prevEdge.edge, edge) ||
-          ((selectedEdge.edge && edge === selectedEdge.edge) ||
-            (prevSelectedEdge.edge && prevSelectedEdge.edge))
+          (selectedEdge.edge && edge === selectedEdge.edge) ||
+          (prevSelectedEdge.edge && prevSelectedEdge.edge)
         ) {
           // new edge
           this.asyncRenderEdge(edge);

diff --git a/src/index.js b/src/index.js
@@ -27,9 +27,7 @@ export type IEdgeType = IEdge;
 export { default as GraphUtils } from './utilities/graph-util';
 export { default as Node } from './components/node';
 export type INodeType = INode;
-export {
-  default as BwdlTransformer,
-} from './utilities/transformers/bwdl-transformer';
+export { default as BwdlTransformer } from './utilities/transformers/bwdl-transformer';
 export { GV as GraphView };
 export type LayoutEngineType = LayoutEngineConfigTypes;
 export default GV;
diff --git a/src/utilities/layout-engine/horizontal-tree.js b/src/utilities/layout-engine/horizontal-tree.js
@@ -21,18 +21,41 @@ import SnapToGrid from './snap-to-grid';
 
 class HorizontalTree extends SnapToGrid {
   adjustNodes(nodes: INode[], nodesMap?: any): INode[] {
-    const { nodeKey, nodeSize } = this.graphViewProps;
-    const size = (nodeSize || 1) * 1.5;
+    const {
+      nodeKey,
+      nodeSize,
+      nodeHeight,
+      nodeWidth,
+      nodeSizeOverridesAllowed,
+      nodeSpacingMultiplier,
+      nodeLocationOverrides,
+      graphConfig,
+    } = this.graphViewProps;
+    const spacing = nodeSpacingMultiplier || 1.5;
+    const size = (nodeSize || 1) * spacing;
     const g = new dagre.graphlib.Graph();
-
-    g.setGraph({ rankdir: 'LR' });
+    const height = nodeHeight ? nodeHeight * spacing : size;
+    const width = nodeWidth ? nodeWidth * spacing : size;
+
+    g.setGraph(
+      Object.assign(
+        {
+          rankdir: 'LR',
+        },
+        graphConfig
+      )
+    );
     g.setDefaultEdgeLabel(() => ({}));
 
     nodes.forEach(node => {
       if (!nodesMap) {
         return;
       }
 
+      const {
+        sizeOverrides: { width: widthOverride, height: heightOverride } = {},
+      } = node;
+
       const nodeId = node[nodeKey];
       const nodeKeyId = `key-${nodeId}`;
       const nodesMapNode = nodesMap[nodeKeyId];
@@ -45,14 +68,34 @@ class HorizontalTree extends SnapToGrid {
         return;
       }
 
-      g.setNode(nodeKeyId, { width: size, height: size });
+      g.setNode(nodeKeyId, {
+        width:
+          nodeSizeOverridesAllowed && widthOverride ? widthOverride : width,
+        height:
+          nodeSizeOverridesAllowed && heightOverride ? heightOverride : height,
+      });
       nodesMapNode.outgoingEdges.forEach(edge => {
         g.setEdge(nodeKeyId, `key-${edge.target}`);
       });
     });
 
     dagre.layout(g);
 
+    if (nodeLocationOverrides) {
+      for (const gNodeId in nodeLocationOverrides) {
+        if (nodeLocationOverrides.hasOwnProperty(gNodeId)) {
+          const nodeKeyId = `key-${gNodeId}`;
+          const gNode = g.node(nodeKeyId);
+          const locationOverride = nodeLocationOverrides[gNodeId];
+
+          if (gNode && locationOverride) {
+            gNode.x = locationOverride.x;
+            gNode.y = locationOverride.y;
+          }
+        }
+      }
+    }
+
     g.nodes().forEach(gNodeId => {
       const nodesMapNode = nodesMap[gNodeId];