i’m trying to make a color wheel, which is going really well but for whatever reason the color that’s being returned is not at all equal to the color that’s actually being selected, why is this?
video:
code:
local function GetColorFromPosition(inputPosition: Vector2)
-- get wheel center and radius
local wheelCenter = colorWheel.AbsolutePosition + colorWheel.AbsoluteSize / 2
local wheelRadius = colorWheel.AbsoluteSize.X / 2
-- get offset
local positionOffset = inputPosition - wheelCenter
-- calculate distance
local distanceFromCenter = positionOffset.Magnitude
local normalizedDistance = math.clamp(distanceFromCenter / wheelRadius, 0, 1)
-- calculate angle
local angle = math.atan2(positionOffset.Y, -positionOffset.X)
if angle < 0 then
angle = angle + (math.pi * 2)
end
-- convert angle to hue
local hue = angle / (math.pi * 2)
-- convert hsv to color
local color = Color3.fromHSV(hue, normalizedDistance, 1)
return color
end
local function EditColor(input: InputObject)
-- get input type and state
local inputType = input.UserInputType
local inputState = input.UserInputState
print(isEditingColor)
if not isEditingColor then return end
-- controller support
if input.UserInputType == Enum.UserInputType.Gamepad1 then
if input.KeyCode == Enum.KeyCode.Thumbstick1 then
UpdateCursorWithController(input.Position, 5)
elseif input.KeyCode == Enum.KeyCode.DPadUp then
UpdateCursorWithController(Vector2.new(0, -1), 10)
elseif input.KeyCode == Enum.KeyCode.DPadDown then
UpdateCursorWithController(Vector2.new(0, 1), 10)
elseif input.KeyCode == Enum.KeyCode.DPadLeft then
UpdateCursorWithController(Vector2.new(-1, 0), 10)
elseif input.KeyCode == Enum.KeyCode.DPadRight then
UpdateCursorWithController(Vector2.new(1, 0), 10)
end
end
-- see if the player is trying to edit the color
if inputType == Enum.UserInputType.MouseMovement or inputState == Enum.UserInputState.Change then
local inputPosition = Vector2.new(input.Position.X, input.Position.Y)
UpdateColorWheelCursorPosition(inputPosition)
local color = GetColorFromPosition(inputPosition)
colorResultFrame.BackgroundColor3 = color
end
end
That seems to be working correctly then. If you print out the hue value instead, does it stay between 0 and 1, and is it 0 at the top (and almost 1 slightly to the left of the top)?
local function GetColorFromPosition(inputPosition: Vector2)
-- get wheel center and radius
local wheelCenter = colorWheel.AbsolutePosition + colorWheel.AbsoluteSize / 2
local wheelRadius = colorWheel.AbsoluteSize.X / 2
-- get offset
local positionOffset = inputPosition - wheelCenter
-- calculate distance
local distanceFromCenter = positionOffset.Magnitude
local normalizedDistance = math.clamp(distanceFromCenter / wheelRadius, 0, 1)
-- calculate angle
local angle = math.atan2(positionOffset.Y, positionOffset.X)
if angle < 0 then
angle = angle + (math.pi * 2)
end
-- convert angle to hue
local hue = (angle + math.pi / 2) / (math.pi * 2)
print(hue)
-- convert hsv to color
local color = Color3.fromHSV(hue, normalizedDistance, 1)
return color
end
local function EditColor(input: InputObject)
-- get input type and state
local inputType = input.UserInputType
local inputState = input.UserInputState
print(isEditingColor)
if not isEditingColor then return end
-- controller support
if input.UserInputType == Enum.UserInputType.Gamepad1 then
if input.KeyCode == Enum.KeyCode.Thumbstick1 then
UpdateCursorWithController(input.Position, 5)
elseif input.KeyCode == Enum.KeyCode.DPadUp then
UpdateCursorWithController(Vector2.new(0, -1), 10)
elseif input.KeyCode == Enum.KeyCode.DPadDown then
UpdateCursorWithController(Vector2.new(0, 1), 10)
elseif input.KeyCode == Enum.KeyCode.DPadLeft then
UpdateCursorWithController(Vector2.new(-1, 0), 10)
elseif input.KeyCode == Enum.KeyCode.DPadRight then
UpdateCursorWithController(Vector2.new(1, 0), 10)
end
end
-- see if the player is trying to edit the color
if inputType == Enum.UserInputType.MouseMovement or inputState == Enum.UserInputState.Change then
local inputPosition = Vector2.new(input.Position.X, input.Position.Y)
UpdateColorWheelCursorPosition(inputPosition)
local color = GetColorFromPosition(inputPosition)
colorResultFrame.BackgroundColor3 = color
end
end
EDIT:
the reason why yellow isn’t achievable is because the hue caps out at 1.2 and starts at 0.2
it reaches 1.2 when your cursor reaches yellow, and 0.2 is located on pink
I messed around and ended up with the following (working) code:
local colorWheel = script.Parent
local function GetColorFromPosition(inputPosition: Vector2)
-- get wheel center and radius
local wheelCenter = colorWheel.AbsolutePosition + colorWheel.AbsoluteSize / 2
local wheelRadius = colorWheel.AbsoluteSize.X / 2
-- get offset
local positionOffset = (inputPosition - wheelCenter)
-- calculate distance
local distanceFromCenter = positionOffset.Magnitude
local normalizedDistance = math.clamp(distanceFromCenter / wheelRadius, 0, 1)
-- calculate angle
local angle = math.atan(positionOffset.Y / positionOffset.X) + math.pi / 2
if positionOffset.X <= 0 then angle += math.pi end
print(math.deg(angle))
-- convert angle to hue
local hue = (angle) / (math.pi * 2)
--print(hue)
-- convert hsv to color
local color = Color3.fromHSV(hue, normalizedDistance, 1)
return color
end
local mouse = game.Players.LocalPlayer:GetMouse()
while true do
task.wait()
script.Parent.BackgroundColor3 = GetColorFromPosition(Vector2.new(mouse.X, mouse.Y))
end
The key part is to make the angle be calculated like this:
local angle = math.atan(positionOffset.Y / positionOffset.X) + math.pi / 2
if positionOffset.X <= 0 then angle += math.pi end
They just added 90 degrees into it because math.atan2() considers 0 degree to be the right side of the screen. Also by using anti-tan which you didn’t use properly.