freifunk/hopglass
8
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

forcegraph: node shadow hi-dpi fix

Browse source
This commit is contained in:
Nils Schneider 2015-08-02 00:45:28 +02:00
parent 8b10d2ec10
commit 22e2c6d3c5
1 changed files with 10 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
lib/forcegraph.js
View file

@ -252,6 +252,7 @@ define(["d3"], function (d3) {
} }
function redraw() { function redraw() {
var r = window.devicePixelRatio
var translate = zoomBehavior.translate() var translate = zoomBehavior.translate()
var scale = zoomBehavior.scale() var scale = zoomBehavior.scale()
var links = intLinks.filter(visibleLinks) var links = intLinks.filter(visibleLinks)
@ -307,11 +308,11 @@ define(["d3"], function (d3) {
// -- draw nodes -- // -- draw nodes --
var node = document.createElement("canvas") var node = document.createElement("canvas")
node.width = scale * nodeRadius * 8 node.width = scale * nodeRadius * 8 * r
node.height = node.width node.height = node.width
var nctx = node.getContext("2d") var nctx = node.getContext("2d")
nctx.scale(scale, scale) nctx.scale(scale * r, scale * r)
nctx.save() nctx.save()
nctx.translate(-node.width / scale, -node.height / scale) nctx.translate(-node.width / scale, -node.height / scale)
@ -324,17 +325,17 @@ define(["d3"], function (d3) {
nctx.strokeStyle = "rgba(255, 0, 0, 1)" nctx.strokeStyle = "rgba(255, 0, 0, 1)"
nctx.shadowOffsetX = node.width * 1.5 + 0 nctx.shadowOffsetX = node.width * 1.5 + 0
nctx.shadowOffsetY = node.height * 1.5 + 3 nctx.shadowOffsetY = node.height * 1.5 + 3
nctx.shadowBlur = 6 nctx.shadowBlur = 12
nctx.shadowColor = "rgba(0, 0, 0, 0.32)" nctx.shadowColor = "rgba(0, 0, 0, 0.16)"
nctx.stroke() nctx.stroke()
nctx.shadowOffsetX = node.width * 1.5 + 0 nctx.shadowOffsetX = node.width * 1.5 + 0
nctx.shadowOffsetY = node.height * 1.5 + 3 nctx.shadowOffsetY = node.height * 1.5 + 3
nctx.shadowBlur = 6 nctx.shadowBlur = 12
nctx.shadowColor = "rgba(0, 0, 0, 0.46)" nctx.shadowColor = "rgba(0, 0, 0, 0.23)"
nctx.stroke() nctx.stroke()
nctx.restore() nctx.restore()
nctx.translate(node.width / 2 / scale, node.height / 2 / scale) nctx.translate(node.width / 2 / scale / r, node.height / 2 / scale / r)
nctx.beginPath() nctx.beginPath()
nctx.moveTo(nodeRadius, 0) nctx.moveTo(nodeRadius, 0)
@ -345,9 +346,9 @@ define(["d3"], function (d3) {
nctx.stroke() nctx.stroke()
ctx.save() ctx.save()
ctx.scale(1 / scale, 1 / scale) ctx.scale(1 / scale / r, 1 / scale / r)
nodes.filter(visibleNodes).forEach(function (d) { nodes.filter(visibleNodes).forEach(function (d) {
ctx.drawImage(node, scale * d.x - node.width / 2, scale * d.y - node.height / 2) ctx.drawImage(node, scale * r * d.x - node.width / 2, scale * r * d.y - node.height / 2)
}) })
ctx.restore() ctx.restore()