From 47bdd66bcf8cdb90ab31b6f0a129c2120fa01d77 Mon Sep 17 00:00:00 2001
From: "Thomas F. K. Jorna" <thomasfkjorna@gmail.com>
Date: Sat, 17 Jul 2021 17:06:28 +0200
Subject: labels now fade instead of cut in

---
 app/components/graph/graph.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'app/components/graph/graph.tsx')

diff --git a/app/components/graph/graph.tsx b/app/components/graph/graph.tsx
index bf5aff7..1b3bab8 100644
--- a/app/components/graph/graph.tsx
+++ b/app/components/graph/graph.tsx
@@ -207,12 +207,12 @@ export const Graph = observer(function Graph(props: GraphProps): JSX.Element {
             const textWidth = ctx.measureText(label).width;
             const bckgDimensions = [textWidth, fontSize].map(n => n + fontSize * 0.2); // some padding
 
-            ctx.fillStyle = 'rgba(20, 20, 20, 0.8)';
+        ctx.fillStyle = 'rgba(20, 20, 20, ' + Math.min((globalScale - physics.labelScale)/physics.labelScale, 1) + ')';
             ctx.fillRect(node.x - bckgDimensions[0] / 2, node.y - bckgDimensions[1] / 2, ...bckgDimensions);
 
             ctx.textAlign = 'center';
             ctx.textBaseline = 'middle';
-            ctx.fillStyle = "#ffffff"; //node.color;
+            ctx.fillStyle = 'rgb(255, 255, 255, ' + Math.min(4*(globalScale - physics.labelScale)/physics.labelScale, 1) + ')';
             ctx.fillText(label, node.x, node.y);
 
             node.__bckgDimensions = bckgDimensions; // to re-use in nodePointerAreaPaint
-- 
cgit v1.2.3

