spring-cloud / spring-cloud-dataflow-ui

@@ -55,11 +55,29 @@
Loading
55 55
  }
56 56
57 57
  dagre.layout(g);
58 +
59 +
  let rankOffset: any = null;
60 +
61 +
  if (!(empty && start && end)) {
62 +
    const dagreOverlappingLinks = verticalLinksOverlapping(g, 2);
63 +
    if (dagreOverlappingLinks > 0) {
64 +
      rankOffset = centerAlignRanks(g);
65 +
      // Check the number of overlapping vertical links for rank centered version
66 +
      const rankCenteredOverlaps = verticalLinksOverlapping(g, 2, rankOffset);
67 +
      if (rankCenteredOverlaps >= dagreOverlappingLinks) {
68 +
        // If after ranks centering number of overlaps remains the same void rank offsets
69 +
        rankOffset = null;
70 +
      }
71 +
    }
72 +
  }
73 +
58 74
  g.nodes().forEach(v => {
59 75
    const node = <dia.Element> graph.getCell(v);
60 76
    if (node) {
77 +
      const graphNode = g.node(v);
61 78
      const bbox = node.getBBox();
62 -
      node.translate((g.node(v).x - g.node(v).width / 2) - bbox.x, (g.node(v).y - g.node(v).height / 2) - bbox.y);
79 +
      const offset = rankOffset && rankOffset[graphNode.y] ? rankOffset[graphNode.y] : 0;
80 +
      node.translate((graphNode.x + offset - graphNode.width / 2) - bbox.x, (graphNode.y - graphNode.height / 2) - bbox.y);
63 81
    }
64 82
  });
65 83
@@ -72,3 +90,81 @@
Loading
72 90
  });
73 91
}
74 92
93 +
export function verticalLinksOverlapping(g: dagre.graphlib.Graph, tolerance: number, ranksOffset?: any): number {
94 +
  let numberOfOverlaps = 0;
95 +
96 +
  // Find all nearly vertical links within the tolerance value
97 +
  const verticalLinks = g.edges().filter(e => {
98 +
    const source = g.node(e.v);
99 +
    const target = g.node(e.w);
100 +
    const offsetSource = ranksOffset && ranksOffset[source.y] ? ranksOffset[source.y] : 0;
101 +
    const offsetTarget = ranksOffset && ranksOffset[target.y] ? ranksOffset[target.y] : 0;
102 +
    if (Math.abs((source.x + offsetSource) - (target.x + offsetTarget)) < 2 * tolerance) {
103 +
      return true;
104 +
    } else {
105 +
      return false;
106 +
    }
107 +
  });
108 +
109 +
  // Check if any parts of these links overlap
110 +
  for (let i = 0; i < verticalLinks.length - 1; i++) {
111 +
    const link = verticalLinks[i];
112 +
    const source = g.node(link.v);
113 +
    const target = g.node(link.w);
114 +
    const offsetSourceB = ranksOffset && ranksOffset[source.y] ? ranksOffset[source.y] : 0;
115 +
    const offsetTargetB = ranksOffset && ranksOffset[target.y] ? ranksOffset[target.y] : 0;
116 +
    const minX = Math.min(source.x + offsetSourceB, target.x + offsetTargetB) - tolerance;
117 +
    const maxX = Math.max(source.x + offsetSourceB, target.x + offsetTargetB) + tolerance;
118 +
    const minY = Math.min(source.y, target.y);
119 +
    const maxY = Math.max(source.y, target.y);
120 +
    for (let j = i + 1; j < verticalLinks.length; j++) {
121 +
      const otherLink = verticalLinks[j];
122 +
      const otherSource = g.node(otherLink.v);
123 +
      const otherTarget = g.node(otherLink.w);
124 +
      const offsetSourceC = ranksOffset && ranksOffset[otherSource.y] ? ranksOffset[otherSource.y] : 0;
125 +
      const offsetTargetC = ranksOffset && ranksOffset[otherTarget.y] ? ranksOffset[otherTarget.y] : 0;
126 +
      if ((minX < otherSource.x + offsetSourceC && otherSource.x + offsetSourceC < maxX && minY < otherSource.y && otherSource.y < maxY)
127 +
        || (minX < otherTarget.x + offsetTargetC && otherTarget.x + offsetTargetC < maxX && minY < otherTarget.y && otherTarget.y < maxY)) {
128 +
        numberOfOverlaps++;
129 +
      }
130 +
    }
131 +
  }
132 +
  return numberOfOverlaps;
133 +
}
134 +
135 +
export function centerAlignRanks(g: dagre.graphlib.Graph): any {
136 +
  let minX = Number.POSITIVE_INFINITY, maxX = Number.NEGATIVE_INFINITY, minY = Number.POSITIVE_INFINITY,
137 +
    maxY = Number.NEGATIVE_INFINITY;
138 +
  const ranks: any = {};
139 +
  g.nodes().forEach(v => {
140 +
    const graphNode = g.node(v);
141 +
    let rank = ranks[graphNode.y];
142 +
    if (!rank) {
143 +
      rank = [];
144 +
      ranks[graphNode.y] = rank;
145 +
    }
146 +
    rank.push(graphNode);
147 +
    minX = Math.min(minX, graphNode.x - graphNode.width / 2);
148 +
    minY = Math.min(minY, graphNode.y - graphNode.height / 2);
149 +
    maxX = Math.max(maxX, graphNode.x + graphNode.width / 2);
150 +
    maxY = Math.max(maxY, graphNode.y + graphNode.height / 2);
151 +
  });
152 +
153 +
  const graphWidth = maxX - minX;
154 +
155 +
  const rankOffset = {};
156 +
  Object.keys(ranks).forEach(key => {
157 +
    const rank = ranks[key];
158 +
    if (Array.isArray(rank) && rank.length) {
159 +
      let rankMinX = Number.POSITIVE_INFINITY, rankMaxX = Number.NEGATIVE_INFINITY;
160 +
      rank.forEach(n => {
161 +
        rankMinX = Math.min(rankMinX, n.x - n.width / 2);
162 +
        rankMaxX = Math.max(rankMaxX, n.x + n.width / 2);
163 +
      });
164 +
      rankOffset[key] = minX + (graphWidth - (rankMaxX - rankMinX)) / 2 - rankMinX;
165 +
    }
166 +
  });
167 +
168 +
  return rankOffset;
169 +
}
170 +
Files Coverage
ui/src 72.78%
Project Totals (244 files) 72.78%
1945.1
TRAVIS_JDK_VERSION=oraclejdk8
TRAVIS_OS_NAME=linux

No yaml found.

Create your codecov.yml to customize your Codecov experience

Sunburst
The inner-most circle is the entire project, moving away from the center are folders then, finally, a single file. The size and color of each slice is representing the number of statements and the coverage, respectively.
Icicle
The top section represents the entire project. Proceeding with folders and finally individual files. The size and color of each slice is representing the number of statements and the coverage, respectively.
Grid
Each block represents a single file in the project. The size and color of each block is represented by the number of statements and the coverage, respectively.
Loading