Hey there!
I’m looking to make a graph GUI based on values, but I can’t figure out how. Is there anyone who can help me?
Thanks so much!
7 Likes
Bar graphs should be the easiest, since all you have to do is use scale to set up your percentages.
Line graphs would require you to create a function that generates line segments and rotates them depending on the angle needed to connect the points. If you would like me to go into more detail I can possibly create an example.
1 Like
hey! Thanks so much. I was hoping for line graphs, but if it’s too much work, don’t hesitate to say no. Thanks!
Viewport could be used to make Line graphs.
Create parts that look like line segments, position each endpoint at a point on your graph, position the viewport camera accordingly. Your graph can be in studs in the XZ plane of the workspace, or the XY plane, or whatever you choose.
I think it would be way less complex to just use 2D UI
Cool, I’m interested to learn about a solution for how to draw and rotate arbitrary length 2D line segments in a GUI without using parts. Haven’t seen this before, should be handy for future work.
How would I do this? (If you know)
Well, you have data points right? Plot them on the screen, and draw a line between them using a Frame. You can use something like this:
frame.Rotation = -math.deg(math.atan2(End.x - Start.x, End.y - Start.y))
frame.Size = UDim2.new(0, 2, 0, math.sqrt((End.x - Start.x) ^ 2 + (End.y - Start.y) ^ 2))
frame.Position = UDim2.new(0, Start.X, 0, Start.Y) + UDim2.new(0, (End.x - Start.x) / 2, 0, (End.y - Start.y) / 2 - frame.Size.Y.Offset / 2)
2 Likes
Hey! Datapoints are values, right? (such as 10, 30, 588?)
Yes, it would be a value in your data set.
Okay, sweet! I’ll test this out now.
1 Like
Hey, sorry, I accidentally marked you as the solution too soon!
I was curious, would I just use frames as sections of the GUI to plot the points down, or would I use another method? i.e. section 100 and below is red, 200 and above is blue, and I place a white marker wherever it is set?
It’s really just a style thing, depends on what you want it to look like.
Hey! Another question, how can I only tween a frame in one direction, which is the top side to move up or down, but not affect the bottom end.
Very late reply, but here is an example I created.
LineGraphExample.rbxl (19.6 KB)
To do this you will need to set the Y anchor point of the specific UI element to 1.
13 Likes
I did this, but it anchors it to the top. I wanted to make the top be held at the bottom, but not affect the top side. Thanks!
1 Like