How would I inverse this HSV function?

Hello there!

As the title says, I got a function which turns vector into a color3; that is needed in a ColorWheel GUI, and I want to inverse this function so instead of giving me the color, it should give me the vector, This way I can preSet the cursor starting position!

Here is the function:

function getValue()
	return ValueSelector:GetAttribute("Value") or 1
end

function getColorbyVector(vector: Vector2)

	local cosVector, sinVector = startAxis:Dot(vector.Unit), startAxis:Cross(vector.Unit)
	local arcCosVector, arcSinVector = acos(cosVector), asin(sinVector)

	if sign(arcSinVector) <= 0 then
		arcCosVector = rad(deg(2*pi) - deg(arcCosVector))
	end

	local hue: number = deg(arcCosVector)/360

	local saturation: number = clamp((vector.Magnitude/(ColorWheel_Radius.Magnitude))/sin(rad(45)), 0, 1)

	local value: number = getValue()

	local color = Color3.fromHSV(hue, saturation, value)
	return color
end

And here is my attempt:

function getVectorByColor(color: Color3)
	local hue, saturation, _ = Color3.toHSV(color)

	local angle = math.rad(hue * 360)

	local direction = Vector2.new(math.cos(angle), math.sin(angle))

	local magnitude = saturation * (ColorWheel_Radius.Magnitude / math.sin(math.rad(45)))

	local vector = direction * magnitude

	return vector
end

My attempt function was way away from the desired goal, Please lemme know if you need additional information! Thx

It seems like I got the answer myself in these few minutes;

For anyone looking for an answer in the future or maybe wondering how I did it, here is the script:

Script:

function getVectorByColor(color: Color3)
    -- Extract the HSV values from the color
    local hue, saturation, value = Color3.toHSV(color)
    
    -- Convert the hue back to an angle in radians
    local angle = math.rad(hue * 360)
    
    -- Calculate the vector direction using the angle
    local direction = Vector2.new(math.cos(angle), math.sin(angle))
    
    -- Adjust the magnitude calculation to properly reflect the color wheel
    local adjustedMagnitude = saturation * value * (ColorWheel_Radius.Magnitude / math.sqrt(2))
    
    -- Scale the direction by the adjusted magnitude
    local vector = direction * adjustedMagnitude
    
    return vector
end

Explanation:

  • Extracting HSV Values: The function starts by converting the input color from the RGB format into the HSV (Hue, Saturation, Value) color model. The hue represents the color’s angle on the color wheel, saturation represents the intensity or purity of the color, and value represents the brightness.
  • Converting Hue to Angle: The hue, which is a value between 0 and 1, is then converted into an angle in radians. This angle corresponds to the direction on the color wheel, where 0 degrees might represent red, 120 degrees green, and so on. The conversion uses the full 360 degrees of the color wheel.
  • Calculating the Direction Vector: The direction on the 2D color wheel is determined using trigonometric functions. By using the cosine of the angle for the x-component and the sine of the angle for the y-component, the function creates a unit vector pointing in the correct direction on the color wheel.
  • Adjusting the Magnitude: The magnitude of this vector is crucial because it determines how far from the center of the color wheel the point should be. The function multiplies the saturation and value together, reflecting how intense and bright the color should be. The magnitude is then scaled by an adjusted factor, specifically using the square root of 2 (approximately 1.414). This adjustment helps ensure that the color transitions correctly across the color wheel, so the final color matches expectations when moving towards the edges of the wheel.
  • Scaling the Vector: Finally, the direction vector is multiplied by the adjusted magnitude. This step scales the vector appropriately, determining the final position on the color wheel.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.