HeroEngine Forums
Welcome, Guest. Please login or Register for HeroCloud Account.

Author Topic: [Resolved] How to use GUIGraph?  (Read 2362 times)

Taschenmogul

  • General Accounts
  • *
  • Posts: 34
    • View Profile
[Resolved] How to use GUIGraph?
« on: Jun 09, 11, 07:37:50 PM »

So I looked at the GUI controls and came to this little function.
Description says it would draw a graph, and it seems to be intuitive enough - at least at first glance.

I quickly realized that description for this was lacking some most basic details.
Like for example, it is said to use "SetGUIGraphData" for setting... well the GUIGraph data.
Fair enough, but it lists "style as Enum GraphStyle" as an argument for this function, explained as "An enumerated value of type GraphStyle".

Here is what is written in the wiki (http://wiki.heroengine.com/wiki/SetGUIGraphData):
Code: [Select]
SetGUIGraphData(graph as NodeRef of Class GUIGraph, useRange as Boolean, minRange as Float, maxRange as Float, \\
   data as List of Vector3, style as Enum GraphStyle)

Now I canīt find anything about this type "GraphStyle", it doesnīt seem to exist.
At least not in the wiki, not in the forum, and the HeroScript Editor also doesnīt give any tips.
Have I overlooked something or are we really supposed to guess what values this "GraphStyle" allows?
Well, at least thatīs what I did, and entering the word "line" for this resulted in the script being compiled, so "line" seems to be a valid GraphStyle.

Other question - am I right that minRange and maxRange mean the minimum and maximum value that any coordinate of any vector in the needed Vector3-list has?
So that when you would draw a linear curve from X0,Y0 to X60,Y60 you would enter "minRange = 0" and "maxRange = 60"?

Also, does the "useRange" argument work at all?
Setting it to "false" at least doesnīt free you from the necessity to declare min and max Range.

So much for the gripe.
Now that I believeto have the arguments right, I still donīt really know how to implement a GUIGraph.
Iīve now done it like that (other code like "G1Graph.name" omitted for this example):

Code: [Select]
G1Graph as NodeRef of Class GUIGraph = createNodeFromPrototype("_window")
SetGUIGraphData(G1Graph, true, 0, 60, VecList, line)

Where "VecList" is defined as:
Code: [Select]
VecList as List of Vector3
So first question here - what prototype should I use? Is "_window" correct?
And - how do I apply this in general?
Iīll post my code below; I tried out the GUI Tutorial and linked it to a trigger.
All worked fine, a window would appear with text in it.
As soon as I add the GUIGraph though, the text disappears and the window stays empty, in addition though a red square is generated that doesnīt match the GUI windows position at all, even though they both should be positioned equally.
Moving this red square (the size doesnīt change whatever I put for G1Graph.size.x or .y) also moves the window, so they both seem to be connected.
What I tried to do in this example was to generate random numbers from 0 to 60 (coupled to the system.time.seconds) that are then plotted to a graph with x ranging from 0 to 60, based on a loop that fills the list of Vector3.
The code below only shows one "state" of what I have tried; the GUIGraph doesnīt seem to work at all the way I tried to implement it.

So, please give me some advice on how to use the GUIGraph!
Oh, and by the way, how do I render a simple text within the clientarea?
I would guess that you also needed to make a GUI for that, however I donīt want any window shown, just the text. Would I have to use layers, setting the windows layer to invisible, only showing the text on a different layer?
Cause when setting the basic GUIControl window to invisible, the text consequently disappears too.


So, here is my code:

Code: [Select]
function MogTrigg1_TriggerEnter( triggeredBy as NodeRef)

VecList as List of Vector3

loop i from 0 to 30
       Sec as Integer = SYSTEM.TIME.NOW.second   
        F as Float = GenRand()
        F2 as Integer = round(F * Sec)
       
       
       Tpvec as Vector3
       Tpvec.x = (i * 2)
       Tpvec.y = F2
       Tpvec.z = 0
       
       add back Tpvec to VecList
       .
               
     
  G1 as NodeRef of Class GUIControl = createNodeFromPrototype("_window")
  G1.build = true
  G1.name = "G1"
  G1.size.x = 300
  G1.size.y = 60
  G1.opacity = 0.5
   
    Screen as Vector3 = getViewPortSize()
    G1.position.x = (Screen.x - G1.size.x) / 2
    G1.position.y = (Screen.y - G1.size.y) / 2
   
    GTitel as NodeRef of Class GUILabel = findGUIControlByName(G1, "titlebar.title")
    GTitel.text = "GUI-Titel"
    GTitel.justification = CENTER
     
    G1Graph as NodeRef of Class GUIGraph = createNodeFromPrototype("_window")
    G1Graph.name = "Graph"
    SetGUIGraphData(G1Graph, true, 0, 60, VecList, line)
    G1Graph.size.x = 300
    G1Graph.size.y = 60
    G1Graph.position.x = (Screen.x - G1.size.x) / 2
    G1Graph.position.y = (Screen.y - G1.size.y) / 2
   
   
    G1Label as NodeRef of Class GUILabel = createNodeFromPrototype("_label")
    G1Label.name = "GUI-Label"
    G1Label.text = "{f:#1,1,0,1}Trigger triggered{/}"
    G1Label.autoSetHeight = true
    G1Label.opacity = 1
 
   
    clientArea as NodeRef of Class GUIControl = G1.getClientarea()
    add back G1Label to clientArea.children
    G1Label.dockMode = BOTTOM
   
    G1Label.build = true   
   
    add back G1Graph to clientArea.children
    G1Graph.dockMode = BOTTOM
    G1Graph.build = true
   
    .


Thanks in advance!


PS:
Forget the question about making simple text without a box; found out how that works, donīt know why it didnīt before...
« Last Edit: Nov 01, 12, 11:08:21 PM by HE-Cooper »
Logged

HE-JAY

  • HeroEngine
  • *****
  • Posts: 122
    • View Profile
Re: How to use GUIGraph?
« Reply #1 on: Jun 10, 11, 09:27:25 AM »

Quote
Now I canīt find anything about this type "GraphStyle", it doesnīt seem to exist.
Checking the DOM Editor's "client enum" section and searching for 'GraphStyle' will reveal information about the type. Specifically, you'll see that this enum has three values defined: LINE, AREA and BAR.

Quote
Other question - am I right that minRange and maxRange mean the minimum and maximum value that any coordinate of any vector in the needed Vector3-list has?
The minRange and maxRange values will determine the 'view' onto the data that you are presented with. In other words, the visualization of the data will present a graph of the data points where the lower-bound visualized (the lowest 'mark' on the axis) is minRange and the upper-bound is maxRange.

Quote
Also, does the "useRange" argument work at all?
If you set useRange to false, you will be presented with a view encompassing all data points regardless of their value (effectively overriding your range definitions)

Quote
Now that I believeto have the arguments right, I still donīt really know how to implement a GUIGraph...
QuestSummaryGUI and QuestStats in HJREF provide an example use case for using GUIGraph controls. If you model your code after these examples, you should have success. _window is not a GUIGraph control and thus would not be the correct choice for your createNodeFromPrototype call; 'graph' would be a better choice.

If you still have issues after following the examples provided in HJRef, feel free to continue asking questions.

Thanks,
-Jay
Logged

Taschenmogul

  • General Accounts
  • *
  • Posts: 34
    • View Profile
Re: How to use GUIGraph?
« Reply #2 on: Jun 10, 11, 10:38:48 PM »

Thanks for the info!
Didnīt think about consulting the DOM editor...
Iīll look into the references you mentioned.
Perhaps I will update the wiki accordingly; when Iīve really understood how to use GUIGraph.
Iīll of course come back if I should not get it done. ;-)

Regards
Logged