Radar chart, need help!

[zqozr_II (duckling)]

You can write your topic however you want, but you need to answer these questions:

1. I want to achieve a radar chart like this one.
   I made a Radar Chart in Roblox Studio… - YouTube

2. I want to make a radar chart like this one, OR fix my radar chart’s size offset and position offset bugs.

3. I guess I egomoose’s triangle function, implemented it to radarchart and it actually performs well, The only issue is it’s size and position is not scaled when being calculated
   

   

Here is the whole radar chart code:

local playerstats = game:GetService('ReplicatedStorage'):WaitForChild('PlayerStats'):WaitForChild(game:GetService('Players').LocalPlayer.Name)

local sp=script.Parent
local HALF = Vector2.new(0.5, 0.5);

local IMG = Instance.new("ImageLabel");
IMG.BackgroundTransparency = 1;
IMG.AnchorPoint = HALF;
IMG.BorderSizePixel = 0;

local RIGHT = "rbxassetid://319692151";
local LEFT = "rbxassetid://319692171";

local function drawtriangle(a, b, c, w1, w2)
	local ab, ac, bc = b - a, c - a, c - b;
	local abd, acd, bcd = ab:Dot(ab), ac:Dot(ac), bc:Dot(bc);

	if (abd > acd and abd > bcd) then
		c, a = a, c;
	elseif (acd > bcd and acd > abd) then
		a, b = b, a;
	end

	ab, ac, bc = b - a, c - a, c - b;

	local unit = bc.unit;
	local height = unit:Cross(ab);
	local flip = (height >= 0);
	local theta = math.deg(math.atan2(unit.y, unit.x)) + (flip and 0 or 180);

	local m1 = (a + b)/2;
	local m2 = (a + c)/2;

	w1 = w1 or IMG:Clone();
	w1.Image = flip and RIGHT or LEFT;
	w1.AnchorPoint = HALF;
	w1.Size = UDim2.new(0, math.abs(unit:Dot(ab)), 0, height);
	w1.Position = UDim2.new(0, m1.x, 0, m1.y);
	w1.Rotation = theta;
	w1.Parent = sp.RadarChart;

	w2 = w2 or IMG:Clone();
	w2.Image = flip and LEFT or RIGHT;
	w2.AnchorPoint = HALF;
	w2.Size = UDim2.new(0, math.abs(unit:Dot(ac)), 0, height);
	w2.Position = UDim2.new(0, m2.x, 0, m2.y);
	w2.Rotation = theta;
	w2.Parent = sp.RadarChart;

	return w1, w2;
end

local center=Vector2.new(145, 160)
local length=150
local function constructbackground()
	local color=Color3.new(1, 1, 1)
	for i=1,5 do
		local degrees=math.rad(i*360/5+360/10)
		local prior=degrees-math.rad(360/5)
		local b=center+Vector2.new(1*math.sin(prior),1*math.cos(prior))*length
		local c=center+Vector2.new(1*math.sin(degrees),1*math.cos(degrees))*length
		local t1,t2=drawtriangle(center,b,c)
		t1.ImageColor3=color
		t2.ImageColor3=color
	end
end

constructbackground()

local order={
	"Power";
	"Speed";
	"Trick";
	"Recovery";
	"Defense";
}



local function showstats()
	local stats={
		playerstats.Power.Value;
		playerstats.Speed.Value;
		playerstats.Trick.Value;
		playerstats.Recovery.Value;
		playerstats.Defence.Value;
	}
	local color=Color3.new(1,.6,0)
	for i,v in pairs(order) do
		local stat=stats[i]
		local laststat=stats[i-1] or stats[#stats]
		local degrees=math.rad(i*360/5+360/10)
		local prior=degrees-math.rad(360/5)
		local b=center+Vector2.new(1*math.sin(prior),1*math.cos(prior))*length*laststat/10
		local c=center+Vector2.new(1*math.sin(degrees),1*math.cos(degrees))*length*stat/10
		local t1,t2=drawtriangle(center,b,c)
		t1.ImageColor3=color
		t2.ImageColor3=color
	end
end

constructbackground()
showstats()
local db = false
game:GetService('UserInputService').InputBegan:Connect(function(inp, gps)
	if gps then return end
	if inp.KeyCode == Enum.KeyCode.M then
		if _G.playbutton then
			if db == false then
				db = true
				script.Parent.Enabled = not script.Parent.Enabled
				if script.Parent.Enabled == true then
					local blur = Instance.new('BlurEffect', game:GetService('Lighting'))
					blur.Name = 'StatsUI'
					blur.Size = 0
					blur:SetAttribute('removeondeath', true)
					game:GetService('TweenService'):Create(blur, TweenInfo.new(0.4, Enum.EasingStyle.Linear), {Size = 25}):Play()
				else
					if game:GetService('Lighting'):FindFirstChild('StatsUI') then
						game:GetService('TweenService'):Create(game:GetService('Lighting').StatsUI, TweenInfo.new(0.4, Enum.EasingStyle.Linear), {Size = 0}):Play()
					end
				end
				task.delay(0.4, function()
					db = false
					if script.Parent.Enabled == false then
						if game:GetService('Lighting'):FindFirstChild('StatsUI') then
							game:GetService('Lighting').StatsUI:Destroy()
						end
					end
				end)
			end
		end
	end
end)

so what I’m simply asking for is help for fixing my radar chart triangle’s offset to scale or a replication of the video’s radar chart above.
I already tried converting the offset of size and position to scale but it goes wrong badly…