For this graph style in particular, you can creat it using simple frame instances. For graphs, like line graphs, you may want to utilize path2d instances.
This graph style looks fairly intuitive to implement, you need to gather your data similar to this:
local data = {
{
timestamp = 1,
wick_min = 20,
wick_max = 70,
body_min = 30,
body_max = 50 ,
color = Color3.new(1,0,0)
},
{
timestamp = 2,
wick_min = 30,
wick_max = 60,
body_min = 35,
body_max = 53 ,
color = Color3.new(0,1,0)
}
}
Heres some demo code:
local wick = Instance.new("Frame")
wick.Name = "wick"
wick.AnchorPoint = Vector2.new(0.5, 0)
wick.BackgroundColor3 = Color3.fromRGB(0, 0, 0)
wick.BorderSizePixel = 0
wick.Position = UDim2.new(0.5, 0, 0, 0)
local body = Instance.new("Frame")
body.Name = "body"
body.AnchorPoint = Vector2.new(0.5, 0)
body.BorderColor3 = Color3.fromRGB(0, 0, 0)
body.BorderSizePixel = 0
body.Position = UDim2.new(0.5, 0, 0, 0)
local graph = ScreenGui.graph.graph
local graphTimestamps = {
graph.timestamp_1,
graph.timestamp_2,
graph.timestamp_3,
graph.timestamp_4,
graph.timestamp_5,
graph.timestamp_6,
graph.timestamp_7,
graph.timestamp_8,
graph.timestamp_9
}
for i, data in pairs(data) do
local wick = Instance.fromExisting(wick)
wickLength = (data.wick_max - data.wick_min) * 5
wick.Size = UDim2.fromOffset(3,wickLength)
wickTopPosition = (100 - data.wick_max) * 5
wick.Position = UDim2.new(0.5, 0, 0, wickTopPosition)
wick.Parent = graphTimestamps[data.timestamp]
local body = Instance.fromExisting(body)
bodyLength = (data.body_max - data.body_min) * 5
body.Size = UDim2.fromOffset(25,bodyLength)
bodyTopPosition = (100 - data.body_max) * 5
body.Position = UDim2.new(0.5, 0, 0, bodyTopPosition)
body.BackgroundColor3 = data.color
body.Parent = graphTimestamps[data.timestamp]
end
Result:
Roblox Model:
candlegraph.rbxm (8.7 KB)
