reaviz / reagraph

🕸 WebGL Graph Visualizations for React. Maintained by @goodcodeus.

Home Page:https://reagraph.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Unable to make clusters if clusterAttribute it not defined

thobhanifreddy opened this issue · comments

Describe the bug

I have different types of nodes and I am trying to form a cluster based on certain properties. Some nodes might not have the cluster attribute I am trying to use.

This causes run time error:

Couldn't find the grouping attribute for the nodes. Make sure to set it up with forceInABox.groupBy("clusterAttr") before calling .links()

One workaround I found, was to pass cluster attribute as undefined for nodes that do not have cluster attribute. But this causes all the nodes with an undefined cluster attribute to form a cluster with no label.

Screenshot 2023-12-28 at 10 43 43

Steps to Reproduce the Bug or Issue

  1. Try to make a graph with the following nodes:
[
  {
    id: 'a',
    label: 'a',
    data: {
      type: 'a'
    }
  },
  {
    id: 'b',
    label: 'b',
    data: {
      type: 'a'
    }
  },
  {
    id: 'c',
    label: 'c',
    data: {
      type: 'a'
    }
  },
  {
    id: 'd',
    label: 'd',
    data: {
      type: 'a'
    }
  },
  {
    id: 'e',
    label: 'e'
  },
  {
    id: 'f',
    label: 'f'
  }
];

you should see the error:
Couldnt find the grouping attribute for the nodes. Make sure to set it up with forceInABox.groupBy("clusterAttr") before calling .links()

  1. Now try to create a graph with the following nodes
[
  {
    id: 'a',
    label: 'a',
    data: {
      type: 'a'
    }
  },
  {
    id: 'b',
    label: 'b',
    data: {
      type: 'a'
    }
  },
  {
    id: 'c',
    label: 'c',
    data: {
      type: 'a'
    }
  },
  {
    id: 'd',
    label: 'd',
    data: {
      type: 'a'
    }
  },
  {
    id: 'e',
    label: 'e',
    data: {
      type: undefined
    }
  },
  {
    id: 'f',
    label: 'f',
    data: {
      type: undefined
    }
  }
];

You should see following graph:

Screenshot 2023-12-28 at 10 53 02

Expected behavior

I was expecting a partial cluster. Some nodes can be in the cluster while some nodes can be without the cluster.

something like this:

Screenshot 2023-12-28 at 10 55 19

Screenshots or Videos

No response

Platform

  • Reagraph Version: 4.15.2
  • OS: All
  • Browser: All
  • NodeJS version: 18.X

Your Example Website or App

No response

Additional context

No response

I tried to fix it locally by doing something like this #161