GUI -- TopoView - port numbers now offset along the link.
Change-Id: Ic093e5bb5f53d1d54ef4225917ff1177e4d5eef2
Showing
3 changed files
with
37 additions
and
18 deletions
... | @@ -517,13 +517,13 @@ | ... | @@ -517,13 +517,13 @@ |
517 | fill: #eee; | 517 | fill: #eee; |
518 | } | 518 | } |
519 | .dark #ov-topo svg .portLabel rect { | 519 | .dark #ov-topo svg .portLabel rect { |
520 | - fill: #555; | 520 | + fill: #222; |
521 | } | 521 | } |
522 | 522 | ||
523 | #ov-topo svg .portLabel text { | 523 | #ov-topo svg .portLabel text { |
524 | text-anchor: middle; | 524 | text-anchor: middle; |
525 | stroke-width: 0.1; | 525 | stroke-width: 0.1; |
526 | - font-size: 9pt; | 526 | + font-size: 11pt; |
527 | } | 527 | } |
528 | .light #ov-topo svg .portLabel text { | 528 | .light #ov-topo svg .portLabel text { |
529 | fill: #444; | 529 | fill: #444; | ... | ... |
... | @@ -426,15 +426,10 @@ | ... | @@ -426,15 +426,10 @@ |
426 | 426 | ||
427 | rect.attr(rectAroundText(el)); | 427 | rect.attr(rectAroundText(el)); |
428 | text.attr('dy', linkLabelOffset); | 428 | text.attr('dy', linkLabelOffset); |
429 | - el.attr('transform', transformPort(d)); | 429 | + el.attr('transform', sus.translate(d.x, d.y)); |
430 | }); | 430 | }); |
431 | } | 431 | } |
432 | 432 | ||
433 | - function transformPort(d) { | ||
434 | - // TODO: offset along the link, away from the node | ||
435 | - return sus.translate(d.baseX, d.baseY); | ||
436 | - } | ||
437 | - | ||
438 | // ========================== | 433 | // ========================== |
439 | // Module definition | 434 | // Module definition |
440 | 435 | ... | ... |
... | @@ -190,36 +190,60 @@ | ... | @@ -190,36 +190,60 @@ |
190 | } | 190 | } |
191 | 191 | ||
192 | function unenhance(d) { | 192 | function unenhance(d) { |
193 | - d.el.classed('enhanced', false); | 193 | + // guard against link element not set |
194 | + if (d.el) { | ||
195 | + d.el.classed('enhanced', false); | ||
196 | + } | ||
194 | api.portLabelG().selectAll('.portLabel').remove(); | 197 | api.portLabelG().selectAll('.portLabel').remove(); |
195 | } | 198 | } |
196 | 199 | ||
197 | function enhance(d) { | 200 | function enhance(d) { |
201 | + var data = [], | ||
202 | + point; | ||
203 | + | ||
204 | + // guard against link element not set | ||
205 | + if (!d.el) return; | ||
206 | + | ||
198 | d.el.classed('enhanced', true); | 207 | d.el.classed('enhanced', true); |
199 | $log.debug('[' + (d.srcPort || 'H') + '] ---> [' + d.tgtPort + ']', d.key); | 208 | $log.debug('[' + (d.srcPort || 'H') + '] ---> [' + d.tgtPort + ']', d.key); |
200 | 209 | ||
201 | // Define port label data objects. | 210 | // Define port label data objects. |
202 | // NOTE: src port is absent in the case of host-links. | 211 | // NOTE: src port is absent in the case of host-links. |
203 | 212 | ||
204 | - var data = [{ | 213 | + point = locatePortLabel(d); |
214 | + angular.extend(point, { | ||
205 | id: 'topo-port-tgt', | 215 | id: 'topo-port-tgt', |
206 | - num: d.tgtPort, | 216 | + num: d.tgtPort |
207 | - baseX: d.target.x, | 217 | + }); |
208 | - baseY: d.target.y | 218 | + data.push(point); |
209 | - }]; | ||
210 | 219 | ||
211 | if (d.srcPort) { | 220 | if (d.srcPort) { |
212 | - data.push({ | 221 | + point = locatePortLabel(d, 1); |
222 | + angular.extend(point, { | ||
213 | id: 'topo-port-src', | 223 | id: 'topo-port-src', |
214 | - num: d.srcPort, | 224 | + num: d.srcPort |
215 | - baseX: d.source.x, | ||
216 | - baseY: d.source.y | ||
217 | }); | 225 | }); |
226 | + data.push(point); | ||
218 | } | 227 | } |
219 | 228 | ||
220 | td3.applyPortLabels(data, api.portLabelG()); | 229 | td3.applyPortLabels(data, api.portLabelG()); |
221 | } | 230 | } |
222 | 231 | ||
232 | + function locatePortLabel(link, src) { | ||
233 | + var near = src ? 'source' : 'target', | ||
234 | + far = src ? 'target' : 'source', | ||
235 | + ln = link[near], | ||
236 | + lf = link[far], | ||
237 | + offset = 32; | ||
238 | + | ||
239 | + function dist(x, y) { return Math.sqrt(x*x + y*y); } | ||
240 | + | ||
241 | + var dx = lf.x - ln.x, | ||
242 | + dy = lf.y - ln.y, | ||
243 | + k = offset / dist(dx, dy); | ||
244 | + | ||
245 | + return {x: k * dx + ln.x, y: k * dy + ln.y}; | ||
246 | + } | ||
223 | 247 | ||
224 | // ========================== | 248 | // ========================== |
225 | // Module definition | 249 | // Module definition | ... | ... |
-
Please register or login to post a comment