[significant Edit here:]
Since there have been no replys yet (thanks for the ‘likes’, though ), I’m editing this post in-place:
I exercised my brain and implemented throrough error handling. You cannot increase the distance between the two suspension points beyond what the current “Length” of the catenary supports. Likewise, you can’t shorten the length of the catenary below what the current distance between the two points requires for a straight-line connection. Attempts at swapping of the left-to-right P1 ==> P2 order are gracefully ignored.
I updated the video and the CodePen accordingly, and eliminated the previous Disclaimer about the lack of error handling.
======================================================
Friends, followers and admirerers of the catenary curve,
I found a source on how to draw a catenary of a specified length through 2 specified points and wrapped some Three.js interactivity around it. You can drag each point via position TransformControls for quick and easy manipulation. For precision (numerical) input there are sliders for the x,y components of each suspension point’s coordinates, as well as for the catenary length.
https://codepen.io/Chrisssie/pen/dPyadrz
Sources, in the order of creation:
[Edit:] the above Glowscript (trinket.io) is the gist of the authors video on the generation of that script:
https://www.youtube.com/watch?v=gkdnS6rISV0