diff --git a/config.js b/config.js index 42eee97a7f5390092fdd61e147edd9259bba4693..7097bd13f1714d34e23601ad24ba6f5354ca5015 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 f6ba9adf25168983dffbb6d4ee33bdf96a96d1b0..9108557f5bf979fc29f381f06b95f7b203a37e56 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) {