From 68588121024393fe9a7c86064b7a4a30740b4d85 Mon Sep 17 00:00:00 2001
From: Harm Kube <h.kube@tu-braunschweig.de>
Date: Tue, 21 Dec 2021 09:08:23 +0100
Subject: [PATCH] Refactoring the drag-Event-Handling
---
config.js | 2 ++
display/graph.js | 25 +++++++++++--------------
2 files changed, 13 insertions(+), 14 deletions(-)
diff --git a/config.js b/config.js
index 42eee97..7097bd1 100644
--- a/config.js
+++ b/config.js
@@ -18,3 +18,5 @@ export const MODE = ks_global.mode;
export function setSpace(space) {
SPACE = space;
}
+
+export const DRAG_THRESHOLD = 10;
diff --git a/display/graph.js b/display/graph.js
index f6ba9ad..9108557 100644
--- a/display/graph.js
+++ b/display/graph.js
@@ -9,7 +9,7 @@ import {
CSS3DRenderer,
CSS3DSprite,
} from "three/examples/jsm/renderers/CSS3DRenderer.js";
-import { MODE } from "../config";
+import { MODE, DRAG_THRESHOLD } from "../config";
/**
* The main ForceGraph. Displays the graph and handles all connected events.
@@ -59,12 +59,7 @@ export default class Graph {
.nodeAutoColorBy("group")
.nodeColor((node) => this.getNodeColor(node))
.linkWidth((link) => this.getLinkWidth(link))
- .onNodeClick((node) => {
- this.focusOnNode(node);
- if (MODE === "default") {
- this.infoOverlay.updateInfoOverlay(node);
- }
- })
+ .onNodeClick((node) => this.onNodeClick(node))
.onNodeHover((node) => {
this.onNodeHover(node);
this.updateHighlight();
@@ -196,16 +191,18 @@ export default class Graph {
this.updateHighlight();
}
+ onNodeClick(node) {
+ this.focusOnNode(node);
+ if (MODE === "default") {
+ this.infoOverlay.updateInfoOverlay(node);
+ }
+ }
+
onNodeDragEnd(node, translate) {
// NodeDrag is handled like NodeClick if distance is very short
- if(Math.sqrt(Math.pow(translate.x, 2)+ Math.pow(translate.y, 2)+ Math.pow(translate.z, 2)) < 10) {
- this.focusOnNode(node);
- if (MODE === "default") {
- this.infoOverlay.updateInfoOverlay(node);
- }
- console.log("Hello Inside");
+ if(Math.sqrt(Math.pow(translate.x, 2)+ Math.pow(translate.y, 2)+ Math.pow(translate.z, 2)) < DRAG_THRESHOLD) {
+ this.onNodeClick(node);
}
- console.log("Hello Outside");
}
focusOnNode(node) {
--
GitLab