diff --git a/html/force-light.css b/html/force-light.css
index 540b7a2..8c9c2c5 100644
--- a/html/force-light.css
+++ b/html/force-light.css
@@ -15,6 +15,11 @@
.link line {
stroke: #333;
stroke-opacity: 1;
+ stroke-width: 1.5px;
+}
+
+.link:hover line {
+ stroke-width: 5px;
}
.node ellipse {
diff --git a/html/force.js b/html/force.js
index ffaac29..db217dd 100644
--- a/html/force.js
+++ b/html/force.js
@@ -199,21 +199,6 @@ force.on("tick", function() {
.attr("x2", function(d) { return d.target.x })
.attr("y2", function(d) { return d.target.y })
- link.selectAll(".label")
- .attr("transform", function(d) {
- π = Math.PI
- Δx = d.source.x - d.target.x
- Δy = d.source.y - d.target.y
- m = Δy/Δx
- α = Math.atan(m)
- α += Δx<0?π:0
- sin = Math.sin(α)
- cos = Math.cos(α)
- x = (Math.min(d.source.x, d.target.x) + Math.abs(Δx) / 2)
- y = (Math.min(d.source.y, d.target.y) + Math.abs(Δy) / 2)
- return "matrix(" + [cos, sin, -sin, cos, x, y].join(",") + ")"
- })
-
vis.selectAll(".node").attr("transform", function(d) {
return "translate(" + d.x + "," + d.y + ")";
})
@@ -291,6 +276,10 @@ function reload() {
})
}
+var linkcolor = d3.scale.linear()
+ .domain([1, 1.2, 2])
+ .range(["#0a3", "orange", "red"]);
+
function update() {
var links = data.links
.filter(function (d) {
@@ -314,21 +303,17 @@ function update() {
linkEnter.append("line")
- link.selectAll("path.label")
- .remove()
-
- link.filter(function (d) {
- return d.quality != "TT" && d.quality != "1.000"
+ link.selectAll("line")
+ .filter( function (d) {
+ return d.type != 'client'
+ })
+ .style("stroke", function(d) {
+ return linkcolor(d.quality)
+ })
+ .append("title")
+ .text( function (d) {
+ return d.quality
})
- .append("path")
- .attr("class", "label")
- .attr("d", d3.svg.zigzag()
- .amplitude(function (d) {
- return Math.pow((1 - 1/d.quality), 0.5) * 8;
- })
- .len(30)
- .angularFrequency(4)
- )
link.exit().remove()
diff --git a/html/nodes.html b/html/nodes.html
index f3b0742..06b3873 100644
--- a/html/nodes.html
+++ b/html/nodes.html
@@ -8,7 +8,6 @@
-
diff --git a/html/zigzag.js b/html/zigzag.js
deleted file mode 100644
index 66a8803..0000000
--- a/html/zigzag.js
+++ /dev/null
@@ -1,57 +0,0 @@
-function zigzag_amplitude(d) {
- return d.amplitude;
-}
-
-function zigzag_len(d) {
- return d.len;
-}
-
-function zigzag_angularFrequency(d) {
- return d.angularFrequency;
-}
-
-d3.svg.zigzag = function() {
- var amplitude = zigzag_amplitude,
- len = zigzag_len,
- angularFrequency = zigzag_angularFrequency;
-
- function zigzag() {
- var A = amplitude.apply(this, arguments),
- l = len.apply(this, arguments),
- ω = angularFrequency.apply(this, arguments) + 1;
-
- start = -l/2;
- end = l/2;
-
- step = l/ω;
-
- var s = "M" + start + ",0";
-
- for (var i = 1; i<ω; i++)
- s += "L" + (start + i*step) + "," + ((i%2)?A:-A);
-
- s += "L" + end + ",0";
-
- return s;
- }
-
- zigzag.amplitude = function(v) {
- if (!arguments.length) return amplitude;
- amplitude = d3.functor(v);
- return zigzag;
- };
-
- zigzag.len = function(v) {
- if (!arguments.length) return len;
- len = d3.functor(v);
- return zigzag;
- };
-
- zigzag.angularFrequency = function(v) {
- if (!arguments.length) return angularFrequency;
- angularFrequency = d3.functor(v);
- return zigzag;
- };
-
- return zigzag;
-};