forcegraph: new, dark color theme
This commit is contained in:
parent
d1beb51868
commit
a240bb2f7a
@ -309,13 +309,18 @@ define(["d3"], function (d3) {
|
||||
}
|
||||
})
|
||||
|
||||
ctx.fillStyle = "#99173C"
|
||||
var clientColor = "#E6324B"
|
||||
var hilightColor = "#FA940F"
|
||||
var unknownColor = "#353634"
|
||||
var nodeColor = "#F2E3C6"
|
||||
|
||||
ctx.fillStyle = clientColor
|
||||
ctx.fill()
|
||||
|
||||
if (highlightedLinks.length) {
|
||||
ctx.save()
|
||||
ctx.lineWidth = 10
|
||||
ctx.strokeStyle = "#F2AB38"
|
||||
ctx.strokeStyle = hilightColor
|
||||
|
||||
highlightedLinks.forEach(function (d) {
|
||||
ctx.beginPath()
|
||||
@ -351,7 +356,7 @@ define(["d3"], function (d3) {
|
||||
ctx.arc(d.x, d.y, 8, 0, 2 * Math.PI)
|
||||
})
|
||||
|
||||
ctx.fillStyle = "#555152"
|
||||
ctx.fillStyle = unknownColor
|
||||
|
||||
ctx.fill()
|
||||
|
||||
@ -361,14 +366,14 @@ define(["d3"], function (d3) {
|
||||
ctx.arc(d.x, d.y, 8, 0, 2 * Math.PI)
|
||||
})
|
||||
|
||||
ctx.fillStyle = "#EFFFCD"
|
||||
ctx.fillStyle = nodeColor
|
||||
|
||||
ctx.fill()
|
||||
|
||||
if (highlightedNodes.length) {
|
||||
ctx.save()
|
||||
ctx.strokeStyle = "#F2AB38"
|
||||
ctx.fillStyle = "#EFFFCD"
|
||||
ctx.strokeStyle = hilightColor
|
||||
ctx.fillStyle = nodeColor
|
||||
ctx.lineWidth = 6
|
||||
|
||||
highlightedNodes.forEach(function (d) {
|
||||
@ -564,7 +569,7 @@ define(["d3"], function (d3) {
|
||||
e.target = newNodesDict[d.target.id]
|
||||
|
||||
if (d.vpn)
|
||||
e.color = "rgba(170, 162, 164, " + (0.6 / d.tq) + ")"
|
||||
e.color = "rgba(255, 255, 255, " + (0.6 / d.tq) + ")"
|
||||
else
|
||||
e.color = linkScale(d.tq).hex()
|
||||
|
||||
@ -597,8 +602,8 @@ define(["d3"], function (d3) {
|
||||
bctx.textAlign = "center"
|
||||
bctx.lineWidth = lineWidth
|
||||
bctx.lineCap = "round"
|
||||
bctx.strokeStyle = "rgba(85, 81, 82, 0.03)"
|
||||
bctx.fillStyle = "rgba(220, 233, 190, 0.8)"
|
||||
bctx.strokeStyle = "rgba(53, 54, 52, 0.1)"
|
||||
bctx.fillStyle = "rgba(242, 227, 198, 0.8)"
|
||||
bctx.miterLimit = 2
|
||||
bctx.strokeText(name, buffer.width / (2 * scale), buffer.height / (2 * scale))
|
||||
bctx.fillText(name, buffer.width / (2 * scale), buffer.height / (2 * scale))
|
||||
|
@ -11,7 +11,7 @@ function (chroma, Map, Sidebar, Tabs, Container, Meshstats, Linklist,
|
||||
var content
|
||||
var contentDiv
|
||||
|
||||
var linkScale = chroma.scale(chroma.interpolate.bezier(["green", "yellow", "red"])).domain([1, 5])
|
||||
var linkScale = chroma.scale(chroma.interpolate.bezier(["#04C714", "#FF5500", "#F02311"])).domain([1, 5])
|
||||
var sidebar
|
||||
|
||||
var buttons = document.createElement("div")
|
||||
|
@ -1,7 +1,7 @@
|
||||
.graph {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background: #2E2633;
|
||||
background: #2B2B2B;
|
||||
|
||||
canvas {
|
||||
display: block;
|
||||
|
Loading…
Reference in New Issue
Block a user