'How to automatically generate and draw a smooth curve between two surfaces in JS?
I would like to be able to automatically generate smooth curves between two (flat) surfaces of DOM elements in JS, similar to the Curved Connector in Google Slides:
In GS, you can add a Curved Connector and then plug each end into any other anchor point. If the target anchor point belongs to a surface, the connector line will be perpendicular to it. Intermediate points are automatically generated and interpolated to make for a smooth curve. Here are four examples:
→ Not sure if there is a library out there? Thus far, I have sadly not found anything
Solution 1:[1]
d3-graphviz does all the magic:
- The edges are rendered straight by default, but are automatically bent to avoid other nodes.
- It also has an auto layouting algorithm for layered/hierarchical graphs.
- It uses graphviz (with the help of wasm) under the hood.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Domi |