Politur: nodePointerAreaPaint fuer pixelgenaues Hovern und Klicken im Graphen implementiert
This commit is contained in:
+7
-7
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
Vendored
+1
-1
@@ -7,7 +7,7 @@
|
|||||||
<link rel="manifest" href="/manifest.webmanifest" />
|
<link rel="manifest" href="/manifest.webmanifest" />
|
||||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
<title>Mission Control 2.0</title>
|
<title>Mission Control 2.0</title>
|
||||||
<script type="module" crossorigin src="/assets/index-y2RCBnMu.js"></script>
|
<script type="module" crossorigin src="/assets/index-C6kUDd9F.js"></script>
|
||||||
<link rel="stylesheet" crossorigin href="/assets/index--2fz5jZz.css">
|
<link rel="stylesheet" crossorigin href="/assets/index--2fz5jZz.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
@@ -154,9 +154,15 @@ export function GraphView({ data, selectedNodeId, onNodeSelect }: {
|
|||||||
backgroundColor="rgba(0,0,0,0)"
|
backgroundColor="rgba(0,0,0,0)"
|
||||||
cooldownTicks={120}
|
cooldownTicks={120}
|
||||||
|
|
||||||
// Hit-Detection an die gezeichnete Knotengröße anpassen
|
// Exakte Hit-Map auf unsichtbarem Canvas zeichnen für 100% zuverlässiges Hovern und Klicken
|
||||||
nodeVal={(node: any) => {
|
nodePointerAreaPaint={(node: any, color: string, ctx: CanvasRenderingContext2D) => {
|
||||||
return 6 + Math.min(degree[node.id] || 0, 15) * 0.8
|
const x = node.x ?? 0
|
||||||
|
const y = node.y ?? 0
|
||||||
|
const size = 6 + Math.min(degree[node.id] || 0, 15) * 0.8
|
||||||
|
ctx.fillStyle = color
|
||||||
|
ctx.beginPath()
|
||||||
|
ctx.arc(x, y, size + 5, 0, 2 * Math.PI, false) // 5px Puffer für einfaches Treffen
|
||||||
|
ctx.fill()
|
||||||
}}
|
}}
|
||||||
|
|
||||||
// Hover- und Klick-Logik
|
// Hover- und Klick-Logik
|
||||||
|
|||||||
Reference in New Issue
Block a user