Properties for undirected graphs

[l-monninger]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[x] Feature request
[ ] Documentation issue or request
[ ] Other... Please describe:

Current behavior

I recently experimented with reaflow for a proof of concept. I and the stakeholders loved the graphs its was able to produce. However, they also wanted the ability to produce undirected graphs.

Roughly speaking, they want vis and reaflow. Currently, I'm not aware of whether reaflow exposes what I would need to accomplish to do this in and of itself. So, this is as much of question about how best achieve the desired graph as it is a request for features.

Expected behavior

1. Edge types: in addition to the reaflow defaults, edges could be made straight or long-arced. (I believe I know how to do this by rendering over the current edges, but I would love to not have to do that.)
2. Node tiers: nodes can be assigned tiers which determine their relative position on a directed graph. By mapping, x, y location on an undirected canvas to tier locations changes between the undirected graph and the directed graph would be made less abrasive. (It seems something like this is already taking place under the hood.)
3. Recommendations: what is the best way to create an undirected graph with reaflow?

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Environment

Libs:
- react version: X.Y.Z
- realayers version: X.Y.Z


Browser:
- [X ] Chrome (desktop) version XX
- [ X] Chrome (Android) version XX
- [X ] Chrome (iOS) version XX
- [X ] Firefox version XX
- [X ] Safari (desktop) version XX
- [X ] Safari (iOS) version XX
- [ X] IE version XX
- [X ] Edge version XX
 
For Tooling issues:
- Node version: XX  
- Platform:  

Others:

[amcdnl]

@l-monninger - I'm going to convert this to a discussion until we create objectives.

Edge types: in addition to the reaflow defaults, edges could be made straight or long-arced. (I believe I know how to do this by rendering over the current edges, but I would love to not have to do that.)

Can you provide an example illustration of the edge routing options you are requesting?

Node tiers: nodes can be assigned tiers which determine their relative position on a directed graph. By mapping, x, y location on an undirected canvas to tier locations changes between the undirected graph and the directed graph would be made less abrasive. (It seems something like this is already taking place under the hood.)

I don't know how to do this off hand but I do believe that ELKJS supports this. This library supports passing custom elkjs properties so

Recommendations: what is the best way to create an undirected graph with reaflow?

reaflow is really designed for building workflows. I see you work at a cyber security co, if you are looking at reaflow for network graphs like that, I don't think its the best solution. I have worked on network graph specific ui libraries but have not had a chance to open-source them. Perhaps reach out to me and we can chat about that.

[l-monninger]

Thanks for setting me straight!

Can you provide an example illustration of the edge routing options you are requesting?

The example network diagram in react-graph-vis is really what my stakeholders are after for a visualization of an undirected graph. Those long-arcing edges are an aesthetic they appreciate.

If you are looking at reaflow for network graphs like that, I don't think its the best solution.

The intended use of the tool isn't quite as singular as that. We do in fact have uses for both directed and undirected graphs which is the main reason I asked. The way you've applied ELK here is really quite nice. I likely ought to stick to one package, and I would love for that package to be reaflow. That said, if this isn't the right tool, it isn't the right tool.

Would love to chat about your WIP. As for what's currently available, would you say building atop Uber's react-vis is likely my next best bet? I was also experimenting with doing a very narrowly scoped graph canvas in house. Perhaps you have some pieces of advice if I go further down that route. Maybe this too is something we could sidebar.