Degree filter on large query

src/components/ConnectivityQuery.vue

@@ -569,6 +569,24 @@ export default defineComponent({
             store.commit.setDirectionalEdges(true);
             store.commit.setQueriedNetworkState(true);
             store.commit.setDegreeEntries(setNodeDegreeDict(store.state.networkPreFilter, store.state.networkOnLoad, store.state.queriedNetwork, store.state.directionalEdges));
+            if (promise.length >= 100) {
+              // Create dictionary of degree occurences
+              const orderedList = Object.values(store.state.nodeDegreeDict).sort((a, b) => a - b);
+              const degreeCount: {[key:number]:number} = {};
+              // eslint-disable-next-line no-plusplus
+              for (let i = 0; i < orderedList.length; i++) {
+                degreeCount[orderedList[i]] = (degreeCount[orderedList[i]] || 0) + 1;
+              }
+
+              // Set min value if the node degree occurence < 100
+              Object.entries(degreeCount).every(([degree, occurence]) => {
+                if (occurence < 100) {
+                  store.commit.setMinDegree(Number(degree));
+                  store.commit.setDegreeNetwork([Number(degree), store.state.maxDegree]);
+                  return false;
+                } return true;
+              });
+            }
           } else {
             // Update state with empty network
             store.dispatch.aggregateNetwork(undefined);

src/components/ControlPanel.vue

@@ -88,10 +88,11 @@ export default defineComponent({
     });
     const maxConnections = computed(() => store.state.maxConnections);
     const maxDegree = computed(() => store.state.maxDegree);
-    const degreeRange = ref([0, maxDegree.value]);
+    const minDegree = computed(() => store.state.minDegree);
+    const degreeRange = ref([minDegree.value, maxDegree.value]);
 
-    watch([maxDegree], () => {
-      degreeRange.value = [0, maxDegree.value];
+    watch([maxDegree, minDegree], () => {
+      degreeRange.value = [minDegree.value, maxDegree.value];
     });
 
     // Intermediate node table template objects

src/components/MultiMatrix.vue

@@ -163,7 +163,11 @@ export default defineComponent({
         // Loop through other props to add to tooltip
         Object.keys(networkElement).forEach((key) => {
           if (!['_key', '_rev', 'id', 'neighbors'].includes(key)) {
-            message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement[key]}`;
+            if (key === 'children' && networkElement.children !== undefined) {
+              message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement.children.length}`;
+            } else {
+              message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement[key]}`;
+            }
           }
         });
       }

src/store/index.ts

@@ -78,6 +78,7 @@ const {
     selectedHops: 1,
     nodeDegreeDict: {},
     maxDegree: 0,
+    minDegree: 0,
     networkPreFilter: null,
     queriedNetwork: false,
     filteredNetwork: false,
@@ -389,6 +390,10 @@ const {
       state.nodeDegreeDict = degreeObject.nodeDegreeDict;
     },
 
+    setMinDegree(state, minDegree: number) {
+      state.minDegree = minDegree;
+    },
+
     setDegreeNetwork(state, degreeRange: number[]) {
       // Determine correct network to use
       let baseNetwork: Network = { nodes: [], edges: [] };

src/types.ts

@@ -129,6 +129,7 @@ export interface State {
   selectedHops: number;
   nodeDegreeDict: { [key: string]: number };
   maxDegree: number;
+  minDegree: number;
   networkPreFilter: Network | null;
   queriedNetwork: boolean;
   filteredNetwork: boolean;