You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@spot.apache.org by ev...@apache.org on 2017/05/05 22:34:42 UTC
[3/7] incubator-spot git commit: Better way to show the Dendrogram's
domain text and update the elements when the screen is resized
Better way to show the Dendrogram's domain text and update the elements when the screen is resized
Project: http://git-wip-us.apache.org/repos/asf/incubator-spot/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-spot/commit/89598df1
Tree: http://git-wip-us.apache.org/repos/asf/incubator-spot/tree/89598df1
Diff: http://git-wip-us.apache.org/repos/asf/incubator-spot/diff/89598df1
Branch: refs/heads/master
Commit: 89598df1d2ae3cf4d6b0eb735fb0e2925ac0dad6
Parents: 89c9341
Author: bryanmontesv <br...@gmail.com>
Authored: Mon Mar 13 15:10:31 2017 -0700
Committer: Everardo Lopez Sandoval (Intel) <el...@elopezsa-mac02.zpn.intel.com>
Committed: Fri May 5 17:34:27 2017 -0500
----------------------------------------------------------------------
spot-oa/ui/dns/suspicious.html | 2 +-
.../ui/js/components/DendrogramMixin.react.js | 19 +++++++++++++------
2 files changed, 14 insertions(+), 7 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-spot/blob/89598df1/spot-oa/ui/dns/suspicious.html
----------------------------------------------------------------------
diff --git a/spot-oa/ui/dns/suspicious.html b/spot-oa/ui/dns/suspicious.html
index 9b783f1..18c85b2 100755
--- a/spot-oa/ui/dns/suspicious.html
+++ b/spot-oa/ui/dns/suspicious.html
@@ -54,10 +54,10 @@
.spot-row {
height: 50%;
}
+
.dendrogram {
overflow-x: hidden;
}
-
</style>
</head>
<body>
http://git-wip-us.apache.org/repos/asf/incubator-spot/blob/89598df1/spot-oa/ui/js/components/DendrogramMixin.react.js
----------------------------------------------------------------------
diff --git a/spot-oa/ui/js/components/DendrogramMixin.react.js b/spot-oa/ui/js/components/DendrogramMixin.react.js
index dd337dd..c1139b6 100755
--- a/spot-oa/ui/js/components/DendrogramMixin.react.js
+++ b/spot-oa/ui/js/components/DendrogramMixin.react.js
@@ -64,16 +64,23 @@ var DendrogramMixin = {
.style('fill', null);
});
+ const y1 = nodes.find(n => n.depth === 1).y;
+ const y2 = nodes.find(n => n.depth === 2).y;
+ const foreignObject_width = (y2 - y1) - 16; // 16 is the 1em given on the "x" (see below) but we need to take it from the last part of the line
+
// foreignObject is not supported by IE
nodeEl.append('foreignObject')
- .attr({'width': (n => n.depth === 0 ? "100px" : "20%"), 'height':"150"})
- .style('text-align', n => n.depth === 0 ? "right" : "left")
- .attr('x', n => n.depth === 0 ? -100 : 8)
+ .style('width', n => n.depth === 1 ? foreignObject_width : 'auto' )
+ .attr('x', n => n.depth === 0 ? '-8em' : '1em') //<--- this is the 1em
.attr('y', -6)
.append('xhtml:div')
- .attr({'class':'spot-text-wrapper','data-toggle': 'tooltip','fill': 'black'})
- .style('width','90%')
- .html(n => n.name);
+ .html(n => n.name)
+ .filter(n => n.depth === 1)
+ .style('width','auto')
+ .attr({'class': 'spot-text-wrapper', 'data-toggle': 'tooltip'});
+
+ nodeSel.update.selectAll('foreignObject')
+ .style('width', n => n.depth === 1 ? foreignObject_width : 'auto');
nodeSel.update.attr('transform', n => `translate(${n.y},${n.x})`);