Belle II Software  release-05-02-19
DependencyViewer Class Reference
Inheritance diagram for DependencyViewer:
Collaboration diagram for DependencyViewer:

Public Member Functions

def __init__ (self, store_arrays_with_dependencies_JSON)
 
def create (self)
 
def show (self)
 

Public Attributes

 store_arrays_with_dependencies_JSON
 A JSON from the processing of dependencies.
 
 random_name
 Part of the name representing the object for javascript.
 
 element_name
 The name representing the object for javascript.
 
 d3_include_string
 Tenplate for the include string.
 
 d3_element_string
 Template for the element itself.
 
 style_template
 Template for the style.
 
 nodes_template
 Template for inserting the node JSON.
 
 viewer_template
 Template for the full HTML.
 

Detailed Description

Show the dependencies in a nice and fancy way :-)

Definition at line 171 of file viewer.py.

Constructor & Destructor Documentation

◆ __init__()

def __init__ (   self,
  store_arrays_with_dependencies_JSON 
)
Create a new dependency viewer.

Definition at line 174 of file viewer.py.

174  def __init__(self, store_arrays_with_dependencies_JSON):
175  """Create a new dependency viewer."""
176 
177  self.store_arrays_with_dependencies_JSON = store_arrays_with_dependencies_JSON
178 
179 
180  self.random_name = ''.join(random.choice(string.ascii_letters) for _ in range(10))
181 
182  self.element_name = "dependencies_" + self.random_name
183 
184 
185  self.d3_include_string = """<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>"""
186 
187 
188  self.d3_element_string = """<div id="{element_name}"></div>""".format(element_name=self.element_name)
189 
190 
191  self.style_template = """<style>
192  /* d3 related settings */
193  .node {
194  font: 300 14px "Helvetica Neue", Helvetica, Arial, sans-serif;
195  fill: #bbb;
196  cursor: pointer;
197  }
198 
199  .node:hover {
200  fill: #000;
201  }
202 
203  .link {
204  stroke: rgba(20, 166, 255, 0.3);
205  stroke-width: 2px;
206  fill: none;
207  pointer-events: none;
208  }
209 
210  .node:hover,
211  .node--source,
212  .node--target {
213  font-weight: 700;
214  }
215 
216  .node--source {
217  fill: #2ca02c;
218  }
219 
220  .node--target {
221  fill: #d62728;
222  }
223 
224  .link--source,
225  .link--target {
226  stroke-opacity: 1;
227  stroke-width: 4px;
228  }
229 
230  .link--source {
231  stroke: #d62728;
232  }
233 
234  .link--target {
235  stroke: #2ca02c;
236  }
237  </style>"""
238 
239 
240  self.nodes_template = """<script>var test_nodes = JSON.parse('{nodes_json}');</script>""".format(
241  nodes_json=self.store_arrays_with_dependencies_JSON)
242 
243 
244  self.viewer_template = self.d3_include_string + self.nodes_template + self.d3_element_string + self.style_template + """
245  <script>
246  var diameter = 960;
247  var radius = diameter / 2;
248  var innerRadius = radius - 120;
249 
250  var cluster = d3.layout.cluster()
251  .size([360, innerRadius])
252  .sort(null)
253  .value(function(d) { return d.size; });
254 
255  var bundle = d3.layout.bundle();
256 
257  var line = d3.svg.line.radial()
258  .interpolate("bundle")
259  .tension(.85)
260  .radius(function(d) { return d.y; })
261  .angle(function(d) { return d.x / 180 * Math.PI; });
262 
263  var svg = d3.select("#""" + self.element_name + """").append("svg")
264  .attr("width", diameter)
265  .attr("height", diameter)
266  .append("g")
267  .attr("transform", "translate(" + radius + "," + radius + ")");
268 
269  var link = svg.append("g").selectAll(".link");
270  var node = svg.append("g").selectAll(".node");
271 
272  var nodes = cluster.nodes(test_nodes);
273  var links = relations(nodes);
274 
275  link = link
276  .data(bundle(links))
277  .enter()
278  .append("path")
279  .each(function(d) { d.source = d[0], d.target = d[d.length - 1]; })
280  .attr("class", "link")
281  .attr("d", line);
282 
283  node = node
284  .data(nodes.filter(function(n) { return !n.children; }))
285  .enter()
286  .append("text")
287  .attr("class", "node")
288  .attr("dy", ".31em")
289  .attr("transform", function(d) {
290  return "rotate(" + (d.x - 90) +
291  ")translate(" + (d.y + 8) + ",0)"
292  + (d.x < 180 ? "" : "rotate(180)");})
293  .style("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; })
294  .text(function(d) { return d.key; })
295  .on("mouseover", mouseovered)
296  .on("mouseout", mouseouted);
297 
298  function mouseovered(d) {
299  node.each(function(n) { n.target = n.source = false; });
300 
301  link.classed("link--target", function(l) { if (l.target === d) return l.source.source = true; })
302  .classed("link--source", function(l) { if (l.source === d) return l.target.target = true; })
303  .filter(function(l) { return l.target === d || l.source === d; })
304  .each(function() { this.parentNode.appendChild(this); });
305 
306  node.classed("node--target", function(n) { return n.target; })
307  .classed("node--source", function(n) { return n.source; });
308  }
309 
310  function mouseouted(d) {
311  link.classed("link--target", false)
312  .classed("link--source", false);
313 
314  node.classed("node--target", false)
315  .classed("node--source", false);
316  }
317 
318  d3.select(self.frameElement).style("height", diameter + "px");
319 
320  // Return a list of imports for the given array of nodes.
321  function relations(nodes) {
322  var map = {},
323  relation = [];
324 
325  // Compute a map from name to node.
326  nodes.forEach(function(d) {
327  map[d.name] = d;
328  });
329 
330  // For each import, construct a link from the source to target node.
331  nodes.forEach(function(d) {
332  if (d.relation) d.relation.forEach(function(i) {
333  relation.push({source: map[d.name], target: map[i]});
334  });
335  });
336 
337  return relation;
338  }
339  </script>
340  """
341 

Member Function Documentation

◆ create()

def create (   self)
Create the widget.

Reimplemented from IPythonWidget.

Definition at line 342 of file viewer.py.

◆ show()

def show (   self)
inherited
Show the widget

Reimplemented in ProgressBarViewer.

Definition at line 24 of file viewer.py.

24  def show(self):
25  """
26  Show the widget
27  """
28  from IPython.core.display import display
29 
30  a = self.create()
31  display(a)
32 
33 

The documentation for this class was generated from the following file:
display
Definition: display.py:1