0
\$\begingroup\$

I'm trying to make a rotation vertically and horizontally around a point at the same time but I'm not able to combine both.

I have this formula for the horizontal rotation:

camera.position.x = x * Math.cos(inc) + z * Math.sin(inc)
camera.position.z = z * Math.cos(inc) - x * Math.sin(inc)

And this one for the vertical:

camera.position.y = y * Math.cos(inc) + z * Math.sin(inc)
camera.position.z = z * Math.cos(inc) - y * Math.sin(inc)

I guess I need to use a Matrix, but not sure how. Here an example with Three.js: https://codepen.io/josema/pen/xyQoga

\$\endgroup\$
  • 3
    \$\begingroup\$ Are you just looking to convert a point in spherical coordinates (an azimuth angle in the horizontal plane and an altitude/polar angle off the horizontal) into a vector in Cartesian coordinates? If so, do previous questions about spherical coordinates cover what you need? \$\endgroup\$ – DMGregory Oct 25 '18 at 17:14
  • \$\begingroup\$ I already have the two rotations working individually. I'm just trying to combine them, but don't know how to make the formula. \$\endgroup\$ – EnZo Oct 25 '18 at 17:36
  • \$\begingroup\$ Do the formulas at the link above solve that problem? If not, can you describe in detail what behaviour you need that's not provided by those answers? \$\endgroup\$ – DMGregory Oct 25 '18 at 18:01
  • \$\begingroup\$ Imagine the horizontal rotation is permanent, and the vertical is controlled with the mouse. I just did a small change here codepen.io/josema/pen/xyQoga in case that helps you to understand. \$\endgroup\$ – EnZo Oct 26 '18 at 14:02
0
\$\begingroup\$

As @DMGregory mentioned above what I really needed was a way to translate a polar/spherical coordinates into cartesian coordinates.

In other words, I have two angles and one radius and a need to convert it into a Vector3/XYZ.

Here is the code:

function polarToCartesian( angleV, angleH, radius ) {

  var phi = ( 90 - angleV ) * DEG2RAD
  var theta = ( angleH + 180 ) * DEG2RAD

  return {
    x: -(radius * Math.sin(phi) * Math.sin(theta)),
    y: radius * Math.cos(phi),
    z: radius * Math.sin(phi) * Math.cos(theta),
  }

}

Source: https://gist.github.com/jhermsmeier/72626d5fd79c5875248fd2c1e8162489

\$\endgroup\$

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.