From eef6483ea0ebec4820833558eb666af55d05d9b5 Mon Sep 17 00:00:00 2001 From: TripZz Date: Wed, 20 Nov 2024 00:19:51 +0100 Subject: [PATCH] NN-612 Create Subgraphs and hide unconnected subgraphs --- frontend/src/graph/GraphDataProvider.vue | 21 ++++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/frontend/src/graph/GraphDataProvider.vue b/frontend/src/graph/GraphDataProvider.vue index 4346963e..b3279cdf 100644 --- a/frontend/src/graph/GraphDataProvider.vue +++ b/frontend/src/graph/GraphDataProvider.vue @@ -9,6 +9,7 @@ import { Graph } from "graphology"; import louvain from 'graphology-communities-louvain'; import {circlepack} from 'graphology-layout'; + import {largestConnectedComponent} from 'graphology-components'; import betweennessCentrality from 'graphology-metrics/centrality/betweenness'; import pagerank from 'graphology-metrics/centrality/pagerank'; import chroma from "chroma-js"; @@ -43,9 +44,10 @@ } ); } - this.generateGraphLayout(); - this.generateGraphStatistics(); - this.generateGraphColor(); + this.generateGraphLayout(graph); + this.generateGraphStatistics(graph); + this.generateGraphColor(graph); + this.generateSubgraph(graph); testgraph.forEachNode((node, attr) => { const size = testgraph.degree(node); @@ -81,6 +83,19 @@ pagerank.assign(graph); }, + generateSubgraph(graph){ + /* Filters the highest connected component and hides all unconnected nodes. + Input: graph: graphObject + */ + const largest = new Set(largestConnectedComponent(testgraph)); + + graph.forEachNode((node) => { + !largest.has(node) + ? graph.setNodeAttribute(node, 'hidden', true) + : graph.removeNodeAttribute(node, 'hidden'); + }); + }, + generateGraphColor(graph){ /* Creates colorpalette with chroma.js and assign each node their respective color (community). Input: graph: graphObject