From b0ff600c3006d403c0afec7a265dce0d35f96095 Mon Sep 17 00:00:00 2001 From: Steven Van Rossem Date: Tue, 31 Oct 2017 16:18:59 +0100 Subject: [PATCH] update graph 3djs file to have a sticky graph in dashboard --- src/emuvim/dashboard/js/graph.js | 51 ++++++++++++++++++++++---------- 1 file changed, 36 insertions(+), 15 deletions(-) diff --git a/src/emuvim/dashboard/js/graph.js b/src/emuvim/dashboard/js/graph.js index b158bf0..bbf2fff 100755 --- a/src/emuvim/dashboard/js/graph.js +++ b/src/emuvim/dashboard/js/graph.js @@ -1,3 +1,30 @@ +// action to take on double mouse click, call rest api to start xterm + function dblclick() { + var vnf_name = d3.select(this).text() + console.debug(vnf_name) + var rest_url = "http://127.0.0.1:5001/restapi/monitor/term?vnf_list=" + vnf_name + + d3.json(rest_url, function(error, json) { + if (error) throw error; + console.debug(json) + }); + } + + //functions to make the nodes stick after they have been manually maoved + function tick() { + link.attr("x1", function(d) { return d.source.x; }) + .attr("y1", function(d) { return d.source.y; }) + .attr("x2", function(d) { return d.target.x; }) + .attr("y2", function(d) { return d.target.y; }); + + node.attr("cx", function(d) { return d.x; }) + .attr("cy", function(d) { return d.y; }); + } + + function dragstart(d) { + d3.select(this).classed("fixed", d.fixed = true); + } + var width = 960, height = 500, color = d3.scale.category10(); @@ -10,7 +37,11 @@ var force = d3.layout.force() .gravity(0.05) .distance(100) .charge(-100) - .size([width, height]); + .size([width, height]) + .on("tick", tick); + +var drag = force.drag() + .on("dragstart", dragstart); d3.json("http://127.0.0.1:5001/restapi/network/d3jsgraph", function(error, json) { if (error) throw error; @@ -22,15 +53,15 @@ d3.json("http://127.0.0.1:5001/restapi/network/d3jsgraph", function(error, json) var link = svg.selectAll(".link") .data(json.links) - .enter().append("line") + .enter().append("line") .attr("class", "link"); var node = svg.selectAll(".node") .data(json.nodes) .enter().append("g") .attr("class", "node") - .call(force.drag) .on("dblclick", dblclick) + .call(drag); node.append("circle") .attr("r", 10) @@ -50,17 +81,7 @@ d3.json("http://127.0.0.1:5001/restapi/network/d3jsgraph", function(error, json) node.attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; }); }); - // action to take on double mouse click, call rest api to start xterm - function dblclick() { - var vnf_name = d3.select(this).text() - console.debug(vnf_name) - var rest_url = "http://127.0.0.1:5001/restapi/monitor/term?vnf_list=" + vnf_name - - d3.json(rest_url, function(error, json) { - if (error) throw error; - console.debug(json) - }); - } + -}); \ No newline at end of file +}); -- 2.25.1