react-sigma icon indicating copy to clipboard operation
react-sigma copied to clipboard

Overlapping edges and edge labels

Open ahlvnils opened this issue 5 years ago • 2 comments

Hi!

I have a graph where I display the relation(s) between nodes as edge labels. This leads to overlapping edges and edge labels when there are multiple relations:

image

Do we have any way of manipulating the behavior of multiple edges? Perhaps a modification of the parallel edges plugin would help? https://github.com/jacomyal/sigma.js/tree/master/plugins/sigma.renderers.parallelEdges

I'd be happy to help if someone could point out where to begin.

Related to: #84 #64 #61

ahlvnils avatar Nov 17 '20 09:11 ahlvnils

Perhaps following example would help https://dunnock.github.io/react-sigma/?path=/story/plugins--edge-labels ? It is using curved edge for rendering and would work only for 2 edges in opposite directions though:

<EdgeShapes default="curve"/>

otherwise importing that plugin should not be that hard too..

dunnock avatar Nov 19 '20 19:11 dunnock

Thanks for the reply. I've tested out the curve edge shape, but most of my relations are one directional. I'll take a look at importing the parallel edges plugin.

ahlvnils avatar Nov 20 '20 09:11 ahlvnils