Politur: Proportionale Hit-Erkennungszone (size + 5) in nodePointerAreaPaint fuer exaktes Hovern bei skalierten Knotengroessen

This commit is contained in:
Hitonabi
2026-07-09 12:48:15 +02:00
parent c0586c3fad
commit c452b873b7
4 changed files with 8 additions and 6 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+1 -1
View File
@@ -7,7 +7,7 @@
<link rel="manifest" href="/manifest.webmanifest" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<title>Mission Control 2.0</title>
<script type="module" crossorigin src="/assets/index-C1WKhrF6.js"></script>
<script type="module" crossorigin src="/assets/index-CqKqlxwP.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index--2fz5jZz.css">
</head>
<body>
+4 -2
View File
@@ -155,11 +155,13 @@ export function GraphView({ data, selectedNodeId, onNodeSelect }: {
backgroundColor="rgba(0,0,0,0)"
cooldownTicks={120}
// Ultraschneller, statischer Klick- & Hover-Puffer auf dem Hit-Canvas (verhindert teure Echtzeitrechnungen)
// Exakte Hit-Map auf unsichtbarem Canvas proportional zur visuellen Knotengröße zeichnen (inkl. 5px Puffer)
nodePointerAreaPaint={(node: any, color: string, ctx: CanvasRenderingContext2D) => {
ctx.fillStyle = color
ctx.beginPath()
ctx.arc(node.x ?? 0, node.y ?? 0, 16, 0, 2 * Math.PI, false)
const nId = typeof node === "object" ? node.id : node
const size = 6 + Math.min(degree[nId] || 0, 15) * 0.8
ctx.arc(node.x ?? 0, node.y ?? 0, size + 5, 0, 2 * Math.PI, false)
ctx.fill()
}}