Three.JS object after spline path - rotation / touch problems and constant speed problem

I think my problem is similar to: rotating an Orient object to the tangent of the spline point in THREE.JS , but I cannot access jsfiddle correctly, and I struggled with the second part of the explanation.

Basically, I created this jsfiddle: http://jsfiddle.net/jayfield1979/qGPTT/2/ , which shows a simple cube following the path created by the spline using SplineCurve3 navigate use the standard TrackBall mouse interaction.

Positioning a cube along a path is simple. However, I have two questions.

First, I use spline.getTanget( t ) , where t is the position along the path so that the cube rotates (the Y axis is just like UP). I think something is missing from me, because even if I extract the .y property of the tangent tangent, the rotation still seems to be turned off. Is there any numbering that needs this?

Secondly, the speed is very diverse along the way, obviously, a lot more points fit into the creation of denser curves, but I was wondering if there is a way to reorganize the path to a more even distribution of spaces between points? I came across the reparametrizeByArcLength function, but tried to find an explanation of how to use it.

Any help or explanation of a little mathematical dummy would be greatly appreciated.

+6
source share
1 answer

To maintain constant speed, use .getPointAt( t ) instead of .getPoint( t ) .

To keep the window tangent to the curve, you follow the same logic, which is explained in the answer to the rotation of the Orient object to the tangent of the spline point in THREE.JS .

  box.position.copy( spline.getPointAt(counter) ); tangent = spline.getTangentAt(counter).normalize(); axis.crossVectors( up, tangent ).normalize(); var radians = Math.acos( up.dot( tangent ) ); box.quaternion.setFromAxisAngle( axis, radians ); 

EDIT: Updated script: http://jsfiddle.net/qGPTT/509/

three.js r.88

+14
source

Source: https://habr.com/ru/post/952353/


All Articles