Uncorrecct display

We need a correct display of the cube

So
only one side is shown correctly
image
other sides shown broken like that
image

I used Vector3:Dot and Vector3:Cross (Guide)

Here code

local Map = workspace:WaitForChild("Map"):GetDescendants()
local Camera = workspace.CurrentCamera
local CanvasModule = require(script.Parent.CanvasDraw)
local Canvas = CanvasModule.new(script.Parent.Parent.Frame, Vector2.new(150,150))
local brickTexture = CanvasModule.GetImageData(game.ReplicatedStorage.Textures.RedCube) 
local a = 0

for _, Object in pairs(Map) do
	if Object:IsA("BasePart") then
		for i = 1, 8 do
			a += 1
			local folder = script.Parent.Parent.Frames
			local frame = Instance.new("Frame")
			frame.Parent = folder
			frame.AnchorPoint = Vector2.new(0.5, 0.5)
			frame.BackgroundColor3 = Color3.new(0,1,0)
			frame.Name = "Frame".. a			

			coroutine.wrap(function()
				while true do
					local vertices = {} 
					local pos = Object.Position
					local size = Object.Size
					for j = 1, 8 do
					    local offsetX = (j % 2 == 0) and 0.5 or -0.5
						local offsetY = ((j > 4) and -0.5 or 0.5)
						local offsetZ = ((j > 2 and j < 7) and 0.5 or -0.5)
						vertices[j] = pos + Vector3.new(size.X * offsetX, size.Y * offsetY, size.Z * offsetZ)
					end
					local ViewportSize = Camera.ViewportSize
					local AspectRatio = ViewportSize.X/ViewportSize.Y

					local VerticalFoV = math.rad(Camera.FieldOfView)

					local ScreenSizeY = 2*math.tan(VerticalFoV/2)
					local ScreenSizeX = AspectRatio*ScreenSizeY
					
					local RelativePosition1 = Camera.CFrame:Inverse() * vertices[i]

					local ScreenPositionX1 = RelativePosition1.X/-RelativePosition1.Z
					local ScreenPositionY1 = RelativePosition1.Y/-RelativePosition1.Z

					frame.Position = UDim2.fromScale(
						1/2 + ScreenPositionX1/ScreenSizeX,
						1/2 - ScreenPositionY1/ScreenSizeY
					)
				
					local visibleSides = {}

					for j = 1, 6 do
						local normal = (vertices[j + 1] - vertices[j]).Unit:Cross(vertices[j + 2] - vertices[j]).Unit
						local toCamera = Camera.CFrame.Position - vertices[j]
						if normal:Dot(toCamera) > 0 then
							table.insert(visibleSides, j)
						end
					end
					

					local function frame(name)
						return Vector2.new(folder:WaitForChild(name).Position.X.Scale, folder:WaitForChild(name).Position.Y.Scale) * 150
					end

					local function drawTriangle(num1, num2, num3, Color)
						Canvas:DrawTriangle(frame("Frame" .. num1), frame("Frame" .. num2), frame("Frame" .. num3), Color, true)
					end

					local triangleDrawFunctions = {
						[1] = function() 
							drawTriangle(2,4,6, Color3.new(1, 1, 0))
							drawTriangle(2,6,8, Color3.new(1, 1, 0))
						end,
						[2] = function() 
							drawTriangle(2,7,8, Color3.new(0, 1, 0))
							drawTriangle(2,7,1, Color3.new(0, 1, 0))
						end,
						[3] = function() 
							drawTriangle(1,3,7, Color3.new(0, 0, 1))
							drawTriangle(3,7,5, Color3.new(0, 0, 1))
						end,
						[4] = function() 
							drawTriangle(3,4,5, Color3.new(0,1,1))
							drawTriangle(4,5,6, Color3.new(0,1,1))
						end,
						[5] = function() 
							drawTriangle(1,2,3, Color3.new(1, 0, 0))
							drawTriangle(2,3,4, Color3.new(1, 0, 0))
						end,
						[6] = function()
							drawTriangle(5,6,7, Color3.new(1, 0, 1))
							drawTriangle(6,7,8, Color3.new(1, 0, 1))
						end 
					}

					for _, sideIndex in ipairs(visibleSides) do
						if triangleDrawFunctions[sideIndex] then
							triangleDrawFunctions[sideIndex]()
						end
					end
					

					game:GetService("RunService").PreRender:Wait()
					
					Canvas:Clear()
				end
			end) ()
		end
	end
end

2 Likes