Convert color HSV back to position(UDim2)

Help and Feedback Scripting Support
#1

The script is from a video and I don’t really understand it that much because all of which is using math which I am not still familiar with:

local h = (math.pi - math.atan2(colourPickerCentre.Y - centreOfWheel.Y, colourPickerCentre.X - centreOfWheel.X)) / (math.pi * 2)
local s = (centreOfWheel - colourPickerCentre).Magnitude / (colorWheel.AbsoluteSize.X/2)
local v = math.abs((darknessSlider.AbsolutePosition.Y - darknessPicker.AbsolutePosition.Y) / darknessPicker.AbsoluteSize.Y - 1)

I was able to manage the v, convert back to position which was really simple, the problem now is with the h and s, I don’t really understand how I would be able to convert this to position.

function getLocation(hsv)
	local selected = 0

	if hsv.R > selected then
		selected = hsv.R
	end

	if hsv.G > selected then
		selected = hsv.G
	end

	if hsv.B > selected then
		selected = hsv.B
	end

	print(math.abs(((selected * darknessPicker.AbsoluteSize.Y) - 6) - darknessPicker.AbsoluteSize.Y))
end
2 Likes
#2

Nvm I I was able to figure it out, I had to watch a couple of videos about the 4 quadrant inverse tangent and about the sine and cosine to fully understand how I would reverse the hue and sat back to a UDim2 position:

function getLocation(h, s, v)
	local angle = (h * math.pi * 2) + (-math.pi / 2)
	local radius = colorWheel.AbsoluteSize / 2
	local newPosition = Vector2.new(math.cos(angle), math.sin(angle)) * radius * s
	
	colorPicker.Position = UDim2.new(0.5, math.floor(newPosition.Y), 0.5, math.floor(newPosition.X))
	darknessSlider.Position = UDim2.new(darknessSlider.Position.X.Scale, 0, 0, math.floor(math.abs(((v * darknessPicker.AbsoluteSize.Y) - 6) - darknessPicker.AbsoluteSize.Y)))
	
	darknessPicker.UIGradient.Color = ColorSequence.new{
		ColorSequenceKeypoint.new(0, Color3.fromHSV(h, s, v)), 
		ColorSequenceKeypoint.new(1, Color3.new(0, 0, 0))
	}
end
The videos that I watched

The 4 Quadrant Inverse Tangent (atan2) and Other Inverse Trigonometric Functions - YouTube
05 - Sine and Cosine - Definition & Meaning - Part 1 - What is Sin(x) & Cos(x) ? - YouTube