Add linkCurveRotation to adjust self-loop angles on curved links - #397
Add linkCurveRotation to adjust self-loop angles on curved links#397Geoc2022 wants to merge 2 commits into
Conversation
| x: (start.x + end.x) / 2 + d * Math.cos(a - Math.PI / 2), | ||
| y: (start.y + end.y) / 2 + d * Math.sin(a - Math.PI / 2) | ||
| x: (start.x + end.x) / 2 + d * Math.cos(a - Math.PI / 2 + rotation), | ||
| y: (start.y + end.y) / 2 + d * Math.sin(a - Math.PI / 2 + rotation) |
There was a problem hiding this comment.
Thanks for the PR @Geoc2022. I'm just trying to understand what's supposed to happen when this prop is used in the context of a regular link from one node to another. Is there some use case that the single linkCurvature doesn't cover and it also needs an additional rotation prop?
There was a problem hiding this comment.
It was intended to mirror the same functionality as in 3d-force-graph, but no, I can't think of many use cases in 2D that would require it. So, I think it's perfectly fine to remove it to improve clarity. Either way adding rotation to self-loops is the only important change.
There was a problem hiding this comment.
Ok, in that case would you mind removing the code that affects regular links? And for usage clarity I'd suggest changing the prop name to something more explicit that it applies only to self-links, like linkSelfCurveRotation.
2 participants
Currently, self-links (edges that start and end at the same node) are always positioned in the top-right quadrant, which can overlap other links and reduce readability.
This PR introduces a new property,
linkCurveRotation, that works similarly tolinkCurvature. It allows users to rotate the curvature axis of each link independently. The property accepts a number (in radians), a string, or a function.Now users can create diagrams like the following:
See #396 for more info.