Using Quaternions in Core

Quaternions allow more precise control of rotation and checking an object’s direction.

Overview

To practice using quaternions, this lesson will make a visual demonstration of a vector being rotated from one direction to another. This will be utilizing the quaternion’s slerp function.

Create a New Script

Return to the Escape the Room project in the Core Editor. In the Hierarchy window, expand the Client Context inside the Scripts folder. Create a new script here named QuaternionsDemo.

Add a Custom Property

Open the Properties window with the QuaternionsDemo script selected. Add a custom property of type Bool and name it RunTest. This property will control if the script runs so make sure to enable the property.

Display a Front and Back Position

For this demonstration, the vector will spin around the player starting in the forward looking direction and ending in the backward looking direction. Start by creating position vectors for the starting and ending point of the vector.

Double click the QuaternionsDemo script to open the Script Editor window. Add the following code:

local RUN_TEST = script:GetCustomProperty("RunTest")

local player = Game.GetLocalPlayer()

if not RUN_TEST then
	return
end

local playerPos = player:GetWorldPosition()
local playerRot = player:GetWorldRotation()

local frontPos = playerPos + (playerRot * Vector3.FORWARD * 300)
local behindPos = playerPos + (playerRot * Vector3.FORWARD * -300)

local steps = 1500

for i = 1, steps, 1 do
	CoreDebug.DrawSphere(frontPos, 20, {color = Color.GREEN})
	CoreDebug.DrawSphere(behindPos, 20, {color = Color.RED})
endCode language: JavaScript (javascript)

Preview the Project

Save the script and press the Play button to preview the project. There should be a sphere being drawn in front and behind the player.

Add a Quaternion Slerp

Now it’s time to create two quaternions (front and back facing) and have a vector transition (or slerp) from one to the other. You may have noticed a for loop in the previous code counting steps. This will control the speed of the transition.

Add the following code to the QuaternionsDemo script:

local RUN_TEST = script:GetCustomProperty("RunTest")

local player = Game.GetLocalPlayer()

if not RUN_TEST then
	return
end

local playerPos = player:GetWorldPosition()
local playerRot = player:GetWorldRotation()

local frontPos = playerPos + (playerRot * Vector3.FORWARD * 300)
local behindPos = playerPos + (playerRot * Vector3.FORWARD * -300)

--Create quaternion using a player's rotation
local startQuaternion = Quaternion.New(playerRot)
--Create quaternion using two positions
local endQuaternion = Quaternion.New(playerPos, behindPos)

local steps = 1500

for i = 1, steps, 1 do
	CoreDebug.DrawSphere(frontPos, 20, {color = Color.GREEN})
	CoreDebug.DrawSphere(behindPos, 20, {color = Color.RED})
	
	--Quaternion transition visualized by yellow line
	local currentQuat = Quaternion.Slerp(startQuaternion, endQuaternion, i/steps)
	local currentForwardVector = currentQuat:GetForwardVector() * 300

	CoreDebug.DrawLine(playerPos, playerPos + currentForwardVector,
	{
		color = Color.YELLOW,
		thickness = 5
	})
	
	--Make sure to wait a frame so line can be animated
	Task.Wait()
end	
Code language: PHP (php)

Preview the Project

Save the script and preview the project. There should now be a yellow line transitioning from the front of the player to behind the player.

Cleanup

Open the Properties window with the QuaternionsDemo script selected. Deactivate the RunTest custom property.