# Hermite Curve Tangents

**URL:** <https://forum.babylonjs.com/t/hermite-curve-tangents/28171>\
**Category:** Questions\
**Created:** [March 5, 2022, 6:00pm UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171 "2022-03-05T18:00:54Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![rdurnin](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/rdurnin/32/11381_2.png) [@rdurnin](https://forum.babylonjs.com/u/rdurnin)\
**Post date:** [March 5, 2022, 6:00pm UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171/1 "2022-03-05T18:00:55Z")

</div>

Hello, and I am working on generating a path which will wind through a number of points. I have selected the Hermite Curve3 type, as it gives me the most correct rendition of the curve I am trying to create, but the programmatically setting the tangent lengths continues to be a problem. The points are tangent to circles which have been placed on a plane, and I would like some advice on how to correctly recreate the curvature of the circle they have been extracted from in the curve.

Please have a look at the following pg:

> **[Babylon.js Playground](https://www.babylonjs-playground.com/#J3PLA8%232)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

In the \_createSplineSegment function (line 50) I have the center, radius, and tangent points available to interpolate the hermite tangents, but I have yet to come up with a formula which works across all cases. The distances between centers is non-uniform as are the angles between points.

Thanks for any help you might lend, and please let me know if I can offer any additional clarification,  
Robert

---

<div class="post-metadata">

**Author:** ![rdurnin](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/rdurnin/32/11381_2.png) [@rdurnin](https://forum.babylonjs.com/u/rdurnin)\
**Post date:** [March 7, 2022, 10:37am UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171/2 "2022-03-07T10:37:19Z")

</div>

I found an article describing how to calculate tangents using the deflection angle of the two points ([here](https://mathalino.com/reviewer/surveying-and-transportation-engineering/simple-curves-or-circular-curves)), but the retrieved value requires a scale factor which causes other issues.

The formula is essentially: radius \* tan(deflection / 2)

Here is an updated playground, which includes the calculation of the intersection point and the formula above.

> **[Babylon.js Playground](https://www.babylonjs-playground.com/#J3PLA8%234)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [March 7, 2022, 3:17pm UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171/3 "2022-03-07T15:17:04Z")

</div>

@carolhmj might be able to help here as she worked on some paths examples previously

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [March 7, 2022, 6:34pm UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171/4 "2022-03-07T18:34:33Z")

</div>

Hey there! I don’t think the Simple Curves calculation is going to work exactly all the time, because the Hermite spline is cubic, not quadratic. I tried creating a simple interface to explore the effect of the tangent length on the curve between two points on a circle, and it can’t fit exactly:

[Tangent to circle | Babylon.js Playground (babylonjs.com)](https://playground.babylonjs.com/#YVEAHN#6)

I think in your case, it might be better to calculate the points along the circles using trigonometric functions, and join them with the other sections.

---

<div class="post-metadata">

**Author:** ![rdurnin](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/rdurnin/32/11381_2.png) [@rdurnin](https://forum.babylonjs.com/u/rdurnin)\
**Post date:** [March 8, 2022, 4:57pm UTC](https://forum.babylonjs.com/t/hermite-curve-tangents/28171/5 "2022-03-08T16:57:48Z")

</div>

Hey Carol,

Thanks for looking at this, and for a viable solution to my issue. As I have the center/tan/radius already it should be easy enough to derive a set of points which represent the chord between the two points. The curve segments are used to create points for a Path3d object, and I don’t think I will lose anything to the method.

r