diff --git a/html/force.css b/html/force.css index b4141ac..80e0615 100644 --- a/html/force.css +++ b/html/force.css @@ -1,36 +1,9 @@ -.node ellipse { - fill: #fff; - stroke-width: 2.5px; -} - -.node text { - font-size: 10px; - color: #333; -} - -.link line { - stroke: #333; - stroke-opacity: 1; -} - -.link .label { - fill: transparent; - stroke: #C83771; - stroke-width: 1px; -} - -.strength { - font-size: 10px; - fill: #C83771; -} - #chart, #chart svg { display: block; vertical-align: middle; } #chart { - background-image: url(gplaypattern.png); position: relative; } @@ -59,6 +32,11 @@ #controlpanel { top: 10px; right: 10px; + font-size: 10pt; +} + +#controlpanel p { + margin: 0; } #nodeinfo h1, p { diff --git a/html/force.js b/html/force.js index 963f413..8444699 100644 --- a/html/force.js +++ b/html/force.js @@ -12,8 +12,7 @@ function getOffset( el ) { var offset = getOffset(document.getElementById('chart')) var w = window.innerWidth - offset.left, - h = window.innerHeight - offset.top, - fill = d3.scale.category20() + h = window.innerHeight - offset.top var cp = d3.select("#chart").append("div") .attr("id", "controlpanel") @@ -280,7 +279,7 @@ function update() { link.selectAll("line") .style("stroke-width", function(d) { - return Math.min(1, d.strength * 2) + return Math.max(1, d.strength * 2) }) link.selectAll("path.label") @@ -330,6 +329,9 @@ function update() { .call(force.drag) nodeEnter.append("ellipse") + .attr("class", function(d) { + return "group-" + d.group + }) node.selectAll("ellipse") .attr("rx", function(d) { @@ -340,13 +342,6 @@ function update() { if (d.group == 3) return 4 else return 10 }) - .style("fill", function(d) { - if (d.group == 3) return fill(d.group) - else return "" - }) - .style("stroke", function(d) { - return fill(d.group) - }) nodeEnter.filter(function(d) { return d.group != 3 diff --git a/html/nodes.html b/html/nodes.html index 9693585..8a86961 100644 --- a/html/nodes.html +++ b/html/nodes.html @@ -5,6 +5,7 @@