3 Ways to Rotate Objects in SceneKit | by Mark Lucking | Apr, 2022

A chess piece from the article on building a 3D chess game

As with many constructs in coding, there may be often a couple of technique to do the identical factor. Generally the variations between them are obvious, a loop a traditional case in hand. You’ll be able to have a repeat/whereas, a do/whereas or a for every loops.

After all, the framework inside SceneKit isn’t any totally different, and there are at the least 3 ways you’ll be able to rotate an object that come to thoughts for instance; a core a part of any 3D framework I’d contest.

However not like our looping instance the place the variations are obvious, understanding variations doing rotations may be perplexing. Certainly, utilizing totally different strategies to show to the identical angle can typically return totally different outcomes. Be a part of me on this paper to take a look at three options, along with a overview of the place they might fail/idiot you. The three I need to take a look at I listing right here.

  • SCNActions
  • Transpositions
  • Quaternions

I used these within the previous articles I printed on SceneKit. They’re in my thoughts, the best technique to animate rotations/transformations in your code.

Challenges — utilizing SCNActions, the primary downside you would possibly run into is a lack of precision. Whenever you run a SCNAction asking it to remain the place it’s on completion [which isn’t the default], you’ll quickly discover out {that a} rotation of 90 levels can come by means of as 89.9998. Now I don’t assume this issues for a lot of purposes, actually video games, however it might break issues in the event you be careful for it.

However precision isn’t the one [gotcha] since SCNActions are primarily utilizing Euler angles. A minimum of two extra points come to thoughts, each regarding shifting an object in a couple of aircraft. This animated GIF illustrates the primary one —

You’re a rotation on the X and Y planes of 45 levels. I’m making use of the identical rotations to each fashions, however I get totally different outcomes relying on the order during which I take advantage of the angles. It’s fairly delicate, however look rigorously and see the distinction. The extra I transfer after altering the sequence, the extra apparent it turns into.

The code behind the illustration is that’s the [gotcha] is within the line within the SCNAction.sequence. Copy and run it in your fashions, and also you’ll get the identical outcome. Be aware that I’m utilizing a subscription-type setup to hyperlink my GameScene to my SwiftUI interface.

Now change the SCNAction.sequence to a SCNAction.group and rerun the identical code. It’ll work the second time round; solely each will find yourself on the identical angle. The group on this context means doing the modifications in parallel.

However wait — since you’re not out of the woods but, working your rotations in parallel would possibly get across the sequence downside, however that is the second extra surreptitious downside that may come up [gotcha], is gimbal lock.

You get gimbal lock on a rotation when two of your axis line up in the identical aircraft. When this occurs, you lose the flexibility to maneuver in one in every of your three planes.

On condition that giro-scopes are fairly essential to planes and spacecraft, you may be assured that there’s a resolution to gimbal lock, too, though I’m not positive I’d go to the difficulty of implementing it in your code. You’ll be able to repair it by including a fourth axis on which you’ll be able to rotate.

I needed to say the actual repair to the gimbal problem is to make use of Matrix transformations, which is true — but it surely isn’t. I lead this part with an animated GIF that makes use of Euler angles and Matrix transformations to make the identical strikes.

I can align each the crimson and inexperienced axis, successfully placing myself right into a gimbal lock. Nevertheless, there’s a essential distinction. With Euler angles, I’m pressured to separate my rotations throughout the three planes and use one thing like SCNActions to mix them— with transformations, I can do all of them on the identical time [not shown here]. The benefit of doing so is that I think you’ll be able to calmly spot gimbal lock in your matrix code extra effectively.

The code to do the transformations on the left I present right here. On the draw back, I believe it’s a tad more durable to grasp in comparison with Euler angles.

The code proven is simply one of many three planes — all of them primarily the identical. After all, identical to SCNActions, the order during which you do the transformations will have an effect on the end result. A useful code function I used right here is the SCNTransation to do the animations. Tremendous beneficial for a truth since not like animations in SwiftUI it provides you a completion block that gained’t fireplace till the animation finishes.

Now, I have to confess on this instance — I’m not positive this illustrates the facility of these items, which may do much more than I shall be utilizing them for at present.

Quaternions are in graphics animation the gold commonplace; they’re quick, use much less house [than a matrix], and would not have the gimbal lock difficulty, however on the draw back they aren’t really easy to make use of.

That is code to maneuver our redNode orientation in the identical method we did with the matrix and Euler angles. Though the code seems to be a bit like C, it’s Swift.

With an animated GIF of the code trying very similar to the final one actually, observe that though it seems to be as if I misplaced a level of freedom utilizing quaternions I haven’t.

I believe it truthful to say that no matter methodology you finally use in your venture, you need to follow it. Utilizing other ways of rotating objects all through can be thought-about poor follow. You’ll be able to code round gimbal lock by rigorously selecting the path it would happen too. This is a great video for giving an entire overview of Euler angles.

All of which brings me to the tip of this paper. I hope you loved studying it as a lot as I did writing it and, like me, realized a factor or two within the course of.

Here’s a hyperlink to the code base I constructed to indicate the demos illustrated — there are two recordsdata in a single; it isn’t a plug-and-play piece of code and is obtainable as-is.

Need to Join?Be a part of me on LinkedIn to attach, collaborate or only a chat.

More Posts