|
@@ -305,16 +305,51 @@ define(["d3"], function (d3) {
|
|
|
|
|
|
|
|
|
// -- draw nodes --
|
|
|
- ctx.beginPath()
|
|
|
- nodes.filter(visibleNodes).forEach(function (d) {
|
|
|
- ctx.moveTo(d.x + nodeRadius, d.y)
|
|
|
- ctx.arc(d.x, d.y, nodeRadius, 0, 2 * Math.PI)
|
|
|
- })
|
|
|
|
|
|
- ctx.strokeStyle = nodeColor
|
|
|
- ctx.lineWidth = nodeRadius
|
|
|
+ var node = document.createElement("canvas")
|
|
|
+ node.width = scale * nodeRadius * 8
|
|
|
+ node.height = node.width
|
|
|
|
|
|
- ctx.stroke()
|
|
|
+ var nctx = node.getContext("2d")
|
|
|
+ nctx.scale(scale, scale)
|
|
|
+ nctx.save()
|
|
|
+
|
|
|
+ nctx.translate(-node.width / scale, -node.height / scale)
|
|
|
+ nctx.lineWidth = nodeRadius
|
|
|
+
|
|
|
+ nctx.beginPath()
|
|
|
+ nctx.moveTo(nodeRadius, 0)
|
|
|
+ nctx.arc(0, 0, nodeRadius, 0, 2 * Math.PI)
|
|
|
+
|
|
|
+ nctx.strokeStyle = "rgba(255, 0, 0, 1)"
|
|
|
+ nctx.shadowOffsetX = node.width * 1.5 + 0
|
|
|
+ nctx.shadowOffsetY = node.height * 1.5 + 3
|
|
|
+ nctx.shadowBlur = 6
|
|
|
+ nctx.shadowColor = "rgba(0, 0, 0, 0.32)"
|
|
|
+ nctx.stroke()
|
|
|
+ nctx.shadowOffsetX = node.width * 1.5 + 0
|
|
|
+ nctx.shadowOffsetY = node.height * 1.5 + 3
|
|
|
+ nctx.shadowBlur = 6
|
|
|
+ nctx.shadowColor = "rgba(0, 0, 0, 0.46)"
|
|
|
+ nctx.stroke()
|
|
|
+
|
|
|
+ nctx.restore()
|
|
|
+ nctx.translate(node.width / 2 / scale, node.height / 2 / scale)
|
|
|
+
|
|
|
+ nctx.beginPath()
|
|
|
+ nctx.moveTo(nodeRadius, 0)
|
|
|
+ nctx.arc(0, 0, nodeRadius, 0, 2 * Math.PI)
|
|
|
+
|
|
|
+ nctx.strokeStyle = nodeColor
|
|
|
+ nctx.lineWidth = nodeRadius
|
|
|
+ nctx.stroke()
|
|
|
+
|
|
|
+ ctx.save()
|
|
|
+ ctx.scale(1 / scale, 1 / scale)
|
|
|
+ nodes.filter(visibleNodes).forEach(function (d) {
|
|
|
+ ctx.drawImage(node, scale * d.x - node.width / 2, scale * d.y - node.height / 2)
|
|
|
+ })
|
|
|
+ ctx.restore()
|
|
|
|
|
|
// -- draw clients --
|
|
|
ctx.save()
|