solved Spherical coordinates to Cartesian coordinates

[Bricktheworld]

I am trying to rotate a box around another box in a sphere on the x, y, and z axis. How can I do this using the rotation of the box to determine spherical and cartesian coordinates of the other box?

[JohnK]

Hi and a warm welcome to the forum from me. Instead of finding angles you could just make the central box the parent of the orbiting box.

[Bricktheworld]

Thank you!

I guess I should have said in the post that I also want to rotate the box in the center and for the orbiting box to follow. How would this work with the rotating?

[JohnK]

Best idea is to do a simple playground of two boxes and try it out and see what happens.

[Bricktheworld]

Thank you!

[Wingnut]

Hey Brick.  https://www.babylonjs-playground.com/#MYY6S#6

This has a getCart() func and a plot1() func that does SOMETHING related to theta and phi.  Pretty much over my head, but there are URLs in the playground that might help.

In this playground, it is used for a custom particle-starting-position function in lines 12-15.

Just for fun, let's turn-on a diagonal-orbiting box2, and a box1 in the center, and then make the orbiter lookAt the center box, and make the center box lookAt the orbiter.  It's all done in the renderLoop... lines 131-142.  Sines and cosines are FUN!

https://www.babylonjs-playground.com/#MYY6S#7

No parenting, no setPivotMatrix on box2, just good clean fun. 

I dunno if ANY of this is helpful, but what the heck, eh?

What's that?  You say you want to see the parented setPivotMatrix version?  ok fine. 

https://www.babylonjs-playground.com/#MYY6S#8

Just some stuff to play-with.  Be well, party on.

[Bricktheworld]

Thank you! I think this is what I need

[Bricktheworld]

@WingnutHi! I've been playing around with this and I am wondering if you know of a way to replace box2 with a camera without using an arcrotatecamera? Thanks!

[Wingnut]

Yeah, umm, have you tried parenting a freeCamera to box2, and then possibly making box2 invisible?

Here ya go.  https://www.babylonjs-playground.com/#MYY6S#9

In fact, you can just disable box2 (if not needed) (line 134), and then... in the render loop (138-142), you can replace box2 occurrences... with camera.

https://www.babylonjs-playground.com/#MYY6S#10

Like that.    I increased the orbit altitude to 540 in lines 138 and 140... in order to back-away the camera a bit... make it look cooler.  Adjust at will.  Line 141 is like a camera.lookAt(box1), yes?  Nod.

Down-arrow backs-away the camera in #9 demo (but you don't see box2 because it is set invisible.  In #10 demo, the down arrow does nothing.  It COULD, if you made the down-arrow increase that 540 value.  Up arrow COULD be wired to decrease the 540 value, too.

Hope this helps.

[Bricktheworld]

Thank you! I am now realizing why everyone is starting to tag you in their questions!

Just one more question is there any way I can control the "box'" rotations using mouse controls? 

Thanks again!

[Wingnut]

Sure, but it takes a bit of work.  Did you want to use a mouse drag?  Anywhere on screen?

Here's a bad broken example of some stuff.  https://www.babylonjs-playground.com/#PZGBU#8

It's complicated, a bit.  ALT drag ON MESH, rotates it on one axis, CONTROL-SHIFT drag on mesh, rotates it on a different axis, and SHIFT drag... does another.

In this example, the dragging MUST happen UPON the skull, and when pointer goes DOWN, there MUST be ground behind the click place (for important getGroundPosition() function).  You can probably eliminate getGroundPosition func and call, because you can use scene.pointerX and scene.pointerY to get "Where was the mouse pointer located... when user went onPointerDown?".

This PG is a derivative of our playground's built-in drag'n'drop demo.   Notice how to addEventListeners (often on canvas) and remove them in scene.dispose()... etc etc.

You will probably be happy to shift/alt/control drag ANYWHERE on screen, and have your box1 rotate (dragging "upon" box1... not necessary).

The secret is onPointerMove... which takes some study (experiments/console.log stuff).  OnPointerMove is not a wait-till-drag-is-done mover.  It triggers constantly during a drag, updating stuff (like box1.rotations) on-the-fly.  Little diffs, processed constantly.  Scene.pointerX and .pointerY are your friends, and so is onPointerDown, which "establishes" where the drag started.

I need sleep now, but I'll be back soon, and if you need help, I'll be nearby.  Use your playground search-in-code and/or forum search... to search for scene.pointerX and diff and similar terms... for more mouse controlling examples. 

You can probably remove the pick.hit stuff... because you won't be dragging upon box1.  Box1 will be rotating with drag, not positioning.  Just like the skull, it is REAL EASY to drag TOO FAR and thus NOT be dragging upon the skull anymore.  It would be better to allow control/alt/shifted drag ANYWHERE on the screen, to rotate box1 or skull (remove picked.hit stuff - we don't care if user clicked ON the mesh).

And don't forget gui buttons like babylon.gui and canvas2d, or even absolute-positioned html buttons.  Those could be used to make clickable buttons that rotate box1, right?  Gamepad buttons, touch-screen gesture swipes, deviceOrientation device tilting, its wide open.  The amount and type of inputs that COULD be "bound" to your box1 rotation... is nearly unlimited.  If you think about them all... REAL HARD, you'll get a brain tumor. 

Have fun experimenting.  You have all the tools you need to take over the world.    Cya later.

[Bricktheworld]

Thanks!