move most style definitions to force*.css
This commit is contained in:
parent
471c17f31e
commit
2dfca44c70
|
@ -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 {
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
<title>Freifunk Lübeck - Knotengraph</title>
|
||||
<link href='style.css' rel='stylesheet' type='text/css' />
|
||||
<link href='force.css' rel='stylesheet' type='text/css' />
|
||||
<link href='force-light.css' rel='stylesheet' type='text/css' />
|
||||
<script type="text/javascript" src="jquery.min.js"></script>
|
||||
<script type="text/javascript" src="bootstrap-button.js"></script>
|
||||
<script type="text/javascript" src="d3.v2.js"></script>
|
||||
|
|
Loading…
Reference in a new issue