How to make a Tween rotate a GUI infinitely

So basically i’m making a compass GUI and it works fine, however, when the GUI object reaches 360 degrees, it rotates back to 0 obviously because it cant go past 360 but i havent been able to find a solution to this, this isnt a functional problem, but i really want it to look smoth. Here’s a video of the issue:

And here’s the code:

wait()

local player = game.Players.LocalPlayer
local mouse = player:GetMouse()
local rose = script.Parent
local TweenService = game:GetService("TweenService")

repeat wait() until game.Workspace.CurrentCamera ~= nil
local Camera = game.Workspace.CurrentCamera
local tweenInfo = TweenInfo.new(1, Enum.EasingStyle.Quint, Enum.EasingDirection.Out, 0, true, 0)

while wait(0.025) do

local Direction = (Vector2.new(Camera.Focus.x,Camera.Focus.z)-Vector2.new(Camera.CoordinateFrame.x,Camera.CoordinateFrame.z)).unit

local Tween = TweenService:Create(rose, tweenInfo, {Rotation = (math.atan2(Direction.y,Direction.x))*(-360/math.pi) + -90})

Tween:Play()

end
1 Like

My solution was to keep adding to the vector2 angle. For example from 240 degrees to 720 degrees.

1 Like

You need to set RepeatCount parameter to -1 . If that is set, then it will loop until manually stopped by the script. See this article for reference (look under the section called “Looping a Tween” ) : TweenService

1 Like

If you really want to use Tweens, you can:

  • Create an int value
  • Tween the value of the int value
  • When the int value is changed (IntValue.Changed), set the Rotation to IntValue.Value % 360

Or, you can just use a variable to do the same thing, though you would need to make your own code to act sort of like the tween service.

Edit:
Nvm, you can probably just change your TweenService:Create line to this:

local angle = (math.atan2(Direction.y,Direction.x))*(-360/math.pi) + -90
local Tween = TweenService:Create(rose, tweenInfo, {Rotation = angle%360})

also, maybe try this code too:

local angle = camera.CFrame.Orientation.Y
local Tween = TweenService:Create(rose, tweenInfo, {Rotation = angle%360})

The Rotation value on a GUI object doesn’t automatically loop back to 0 so I’m assuming you’re tweening the GUI’s rotation to the rotation of the camera, which does loop back when going beyond 360. Instead, use subtraction to find the difference between the current compass rotation and the camera’s rotation, and tween the compass to it’s current rotation + the difference. This would result in the GUI’s rotation value possibly going super high or super low in the negatives, but it will look seamless, and if you don’t want the value to be like that you can set it to an equivalent rotation value between 0 and 360 after each tween.

Use math.clamp() to clamp the value between 0 and 360.

local tweens = game:GetService("TweenService")
local players = game:GetService("Players")
local player = players.LocalPlayer
local mouse = player:GetMouse()
local camera = workspace.CurrentCamera

local rose = script.Parent
local tweenInfo = TweenInfo.new(1, Enum.EasingStyle.Quint, Enum.EasingDirection.Out, 0, false, 0)

while task.wait() do
	local direction = (Vector2.new(camera.Focus.X, camera.Focus.Z) - Vector2.new(camera.CFrame.X, camera.CFrame.Z)).Unit
	local tween = tweens:Create(rose, tweenInfo, {Rotation = math.clamp((math.atan2(direction.Y, direction.X)) * (-360/math.pi) + -90, 0, 360)})
	tween:Play()
end
1 Like

Alright, heres my take on your issue;
It switches from 360 to 0, so what you’ll need to do, to make it look good, is have the tween use a negative number when you’re at 360 and switching to 0.

I tried this and the compass no longer moves, not sure why tho since it doesnt throw any error

Your solution sounds interesting but im a noob and idk how to exactly do what you said, could you show me? (if it doesnt bother you)

Hey thanks for the help but doing what you said didnt seem to do any change