Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

[Released] Graph Maker - UGUI - NGUI - DFGUI (line graphs, bar graphs, pie graphs, etc)

Discussion in 'Assets and Asset Store' started by rorakin3, Sep 26, 2013.

  1. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Oh, yea to get all the node transforms, you can use GetPoints() on the WMG_Series script. In retrospect, probably should have called it GetNodes(), but in the 1.3.4 update you'll see it in the functions documentation.
     
  2. KamiKaze425

    KamiKaze425

    Joined:
    Nov 20, 2012
    Posts:
    207
    I thought it was that, but it was giving me wrong values. I just figured out there's a delay to that updating, so I couldn't call it in the same method where I set the pointValues. I just threw in a yield WaitForEndOfFrame() and it's working now. Thanks!
     
  3. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Oh, I see. Yea the reason is because of caching. You can also do it without yield wait by doing this:

    // Set data
    WMG_Series.checkCache()
    WMG_Series.CreateOrDeleteSpritesBasedOnPointValues() // Only really needed if the data you set would cause sprites to be added / removed
    WMG_Series.UpdateSprites(null)
    // Get points
     
  4. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey guys,
    I will be adding hierarchical trees to the next update (1.3.5)
    I have modeled the functionality based off of League of Legends and Diablo 2 style skill trees.
    The screenshot here / the screenshot that will added to the asset store product page, and the prefab and new example scene is pretty much a replica of the structure of the combat skills skill tree from the Barbarian in Diablo 2:

    http://diablo.gamepedia.com/Barbarian_(Diablo_II)

    I will be doing the update soon, so post any questions / requests related to skill trees soon. Thanks!

    View attachment 102347
     

    Attached Files:

    Last edited: May 30, 2014
  5. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    Very Cool.

    Got some ideas.

    1. Allow for Horizontal layout in addition to Vertical layout.
    2. Allow for links to be more customizable so that the tree can be used in many more ways ( from Tradional Generic Tree looking to more esoteric). Kinda like the awesome flexibility and power that GraphMaker has already brought to graphing.

    Here's is a screenshot of some Vertical and Horizontal Layouts for ideas. Generally, if the tree could be customized by the user to support some of these variations it would be really great.

    https://dl.dropboxusercontent.com/u/48378123/IdeasForTrees.jpg
     
  6. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Thanks for checking in rocki!

    By the way, reason I'm doing this update so quickly is because I actually need to use this in a project I'm doing now, so yea any ideas for improvement will definitely help me as well.

    1. Yea, you can definitely do Horizontal trees. The way it works is you just specify rows and columns for each node. So in the screenshot here, there are 3 columns and 6 rows, but it could just as easily be 3 rows and 6 columns. The column width and row height are also configurable. In this example it is 100 for both, so it looks grid-like, but you could have the spacing be different.

    Also, nothing is really forcing you to do a fixed column or row layout. You can position things at the precision of pixels if you really want. For example, you could make the column width and row height to be 1. Then you just specify the rows and columns as a number of pixels. So instead of saying each node is either column 1, 2, or 3, it would be 100 pixels, 200 pixels, or 300 pixels for example.

    2. Yea, I took a look at the screenshots, and I don't really see anything that can't be done except for the curvy links. You might be wondering how you do the links where the link appears to fork into 2 paths using 90 degree angles. Well, the way linking to / from nodes without linking to an actual node works is what I call "Invisible Nodes". Basically, you specify how many invisible nodes you want and what their positions are just as you would your standard visible nodes. The only difference is they are invisible and in separate data structure so API functions to get the nodes in a row or column will not return them for example. Then when you specify a link between invisible nodes you will get simply what appears to be a line not connected to anything except perhaps other lines also connected to invisible nodes.
     
  7. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    That sounds great.

    The nodes can be collapsed and expanded ?

    Edit: I was thinking about the idea of curved lines. Have you seen Vectrosity and how it creates 2d curved lines? I think it's just a 2D mesh. This would be really nice for the GraphMaker to have in the package. It can then plot really nice curves.

    Another GUI called EVO on the asset store has line,splines, curves and looks really cool. There is also free code from unity for mesh extrusion called "Procedural Examples"
     
    Last edited: May 31, 2014
  8. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey,

    Good news. Purchased Shader Forge recently for a different project, but have been playing around with it and think I found a way I will be able to do dynamic shading to create an area underneath a line.

    Here is a screenshot of the shader so far. Basically, the plan is to have a rectangle between every 2 points, so if there are 10 points for your line graph, then that is 9 extra rectangles with a custom shader if you want to shade the area underneath. The tricky part is figuring out how to alpha clip the correct triangle area, but I think I finally solved it :)
     

    Attached Files:

  9. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Here's a screenshot of the new shader in action!
     

    Attached Files:

  10. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    That's cool looking. How's the performance on Iphone 4 ?
     
  11. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey rocki :)

    Thanks! Not sure about performance on mobile. If you give it a try, let me know though!
     
  12. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Stacked line graphs now possible thanks to Shader Forge :)
     

    Attached Files:

  13. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    Very cool.
     
  14. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Finished adding this for Daikon Forge (screen attached), and just uploaded the new version -

    1.3.6
    - NEW: Stacked line graphs and ability to add custom area shading for any line series added using advanced custom shaders created using Shader Forge!

    Enjoy!
     

    Attached Files:

  15. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    Great, I'll give it a spin on the Iphone and give you some feedback.
     
  16. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    Downloaded new version to test on Iphone. Getting this error while building project:
    Assets/Graph_Maker/Scripts/WMG_GUI_Functions.cs(72,52): error CS1061: Type `UIDrawCall' does not contain a definition for `isActive' and no extension method `isActive' of type `UIDrawCall' could be found (are you missing a using directive or an assembly reference?)
     
  17. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    I was updating to the last version of ngui and graph maker and the editor where I can create nodes and links between them was not working anymore, I tried to use the example version and also wasn't working.
    I can't create links or move the nodes, also in the example I can't change the node type.
    Any idea about this?

    I'm using last version of ngui and unity
     
  18. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Woops, I should have really done an actual build to catch this. Turns out that NGUI public property is wrapped around a #IF UNITY_EDITOR, so it doesn't exist outside the editor context. You can replace isActive with enabled for now until I push out a fix.
     
  19. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hmm, yea I can take a look. Are you actually using it, or more just curious? I don't actively update / support that example scene anymore. I should probably delete it entirely to make this clear. I removed advertising about that functionality from the product page back when I added support for Daikon because noone seemed to use it and would be waste of time to create and maintain something noone uses, but if you were actually using it let me know, and I can try to fix it for NGUI.
     
  20. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Actually, in WMG_GUI_Functions replace all instances of

    theSprite.drawCall.isActive

    with

    theSprite.drawCall.renderer.enabled

    This reduces the drawcalls correcly, and works outside the editor :) This is the fix I will push out.
     
  21. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    I bought the plugin mainly because this feature, but didn't use it back then because I was busy with other things, but now that I need to start implementing a node editor for my thesis, I was checking your example scene of the editor and saw the problem.
    So I really need this feature, and I hope is not so time consuming to fix it with the new ngui version, because like you said is not a popular feature between the users of graph maker, but if could have it, at least working with basic functionality I would appreciate it.
     
  22. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Ah ok, yea I believe I have fixed all the issues (there were alot of issues since I haven't looked at in about 6 months). If you want to email me with your invoice #, I can send you the package with these fixes, otherwise you can expect all the fixes to be in the next update I will push out probably pretty soon.
     
    Graph likes this.
  23. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    Thx, I send you already the email with my invoice number
     
  24. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    Hi all!

    I'm using this plugin for reporting and I need to be able to cycle the graph 10 "sessions" at a time (score reporting needs to stay large enough for printing).
    Problem is every time I try and refresh the x-axis labels with the new numbers it clears it out and starts corrupting the whole graph. I've been trying different things with no change. Can someone let me know the proper way to change/refresh the graph data using this plugin?
     
  25. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    Also....and I don't know if this is part of the same issue, but I can't get the tooltip feature to work either....is there a way to have a tooltip appear for each point on the graph and stay up rather than be on hover only?
     
  26. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey,
    Are you using the auto update based on max / min functionality to automatically set the labels, or are you setting them manually? Not sure what you mean by corrupt the whole graph, can you post a screen?

    Sorry, no the tooltips are supposed to disappear.
     
  27. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    For the next update, there has been several enhancements to legends. You can now specify how many rows (horizontal) or columns (vertical) for the legends, and also customize the spacing between the icon and the text.

    Additionally it is now possible for bar graphs to start at any arbitrary position. Previously bar graphs have to start from the bottom of the graph. This also makes it possible to have upside down bar graphs.
     
    Graph likes this.
  28. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    I'm having to do it manually because when I use max min values it doesn't increment properly (if min is 0 and max is 100 with total marks of 20 it increments 0, 6, 11, etc. instead of 0, 5, 10).

    The graph corrupts by grabbing all data in the series and messing with the x values. Y values remain correct but where they get placed on the x axis gets all screwed up (all shoved to the left for example with one or two shooting off screen to the right). More than likely due to the fact that the x-axis labels are being changed.

    I'll see if I can get you a screen grab.....in the meantime any ideas?

    Dang.....any chance that could change soon? It'd be nice to have the option of each point labeled with a tooltip regardless of hover.
     
  29. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    0 min and 100 max with increment of 5 is 21 marks. So you need to increment by 1. For example, 0 min and 2 max with increment of 1 is 3 marks, not 2 marks.

    As for x values, there is an option on the series that moves the points automatically without the need to enter x-data, are you using that? For x-labels, are you setting the labels manually as well, or using the auto based on min / max? There are also options to make the graph ensure data does not go out of range. When these options are used, Graph Maker detects data beyond the min and max of the axes and adjusts the min / max of the axes such that the data will not be outside of the graph. This can be useful if you are setting lots of data continuously at run-time and do not know what the limits of your graph will be.

    Yea, I can look into adding an option for including data labels. You just want numbers to appear above your points / bars all the time correct?
     
  30. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    Whoops -_- *facepalm* Thanks!

    I assume you are referring to a function other than set via min/max, auto growth and auto shrink?
    I'm still learning what all is in this plugin of yours. Its awesome...but requires a bit of digging to figure it all out.
    What I need is the graph to display 10 sessions worth of data (x-axis has one increment per session) with it showing the next 10 or previous 10 depending on whether the user presses the next button or previous button. What function would be best suited for handling that need?

    That is correct and it would be a lifesaver!

    Also, is there a way to label the axis bars? I see how I can change what the increment labels are but I'm talking about labeling the axis as a whole. I know its fairly easy to throw a GUI Text on top of the graph to accomplish this but having it as part of the plugin would be SWEET! :) Same with a graph title.
     
  31. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Alright, my friend I have added options for x / y axis, and graph titles, as well as added the ability to enable data labels for each series. Right now you can specify font size, and number of decimals. Other changes like font color / font can be changed by changing the referenced prefab. See attached screenshot -
     

    Attached Files:

  32. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Also, here is a screenshot of the new parameter that allows you to move around the base of the bar chart. Using this, you can change your bar chart to be entirely upside down, or maybe some of them right side up, and some of them upside down. It all depends on the axis min / max, the new bar axis value setting, and the y-data specified for the bars.
     

    Attached Files:

  33. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    I'm working on adding support for UGUI now using Unity 4.6 beta. Attached is a Pie Graph in Unity 4.6!

    Also, I uploaded 1.3.7 yesterday, which has the following:

    1.3.7
    - NEW: Data labels! Add and customize data labels for each series.
    - NEW: Titles! Optionally include x / y axis titles, and a graph title.
    - NEW: Bar charts don't have to start from the bottom! Freely move around the base for bar charts to create upside down bar charts, or a combination.
    - NEW: Additional legend options! Legends can now have multiple rows (horizontal legends), or columns (vertical legends).
     

    Attached Files:

  34. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    Just a question, on the WMG_Editor, how can I add links between nodes, because I was trying that, but I couldn't with any mouse click combination.
    Also it seems I can't move individually the nodes, just all at the same time.
     
  35. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Right click and hold from an existing node and drag to either another existing node or to an empty space.

    To move, left click and drag on an existing node
     
  36. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    Sorry I tried this already, and on your webplayer works great, but on the asset package that I import doesn't work for me, I downloaded the latest from asset store just to verify, but doesn't work.

    I'm using unity 4.5.2 and windows, and the latest ngui version 3.7.1, I don't know if this has something to do.
     
  37. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Looks like this was because of increase in NGUI version, I have fixed it, and sent you an updated package via email.
     
    Last edited: Sep 2, 2014
  38. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    I have just about finished adding support for UGUI (Unity 4.6 beta version 18), can probably expect it in the next update (1.3.8). Attached is the standard example scene in UGUI :)
     

    Attached Files:

  39. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    Hey that's awesome!

    ......but I just tried updating the plugin through Unity and it says 1.3.6 is your latest......??
    I'd really like to try out your new version. Where can I find and import it?
     
  40. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey, thanks :)

    Unity just needs to approve it, which will probably be tomorrow.
     
  41. HunterTank95

    HunterTank95

    Joined:
    Mar 14, 2014
    Posts:
    43
    Hey rorakin3,

    So I tried downloading it again and it still says version 1.3.6 is your latest in the asset store. Any idea when the update will be available for download?
     
    Last edited: Sep 3, 2014
  42. AbgaryanFX

    AbgaryanFX

    Joined:
    Jan 9, 2010
    Posts:
    167
    Hi !

    1. Is it possible to make bezier curve graphs ?
    2. Why FPS is too low for many point-graph and what can I do to increase fps ?

     
  43. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Hey,
    1. Of course, you can make any graph
    2. The FPS is not low for many point graph, you can go up to around 2000 points before it starts to drop below 60, same as creating 2000 sprites in NGUI. But, for real-time updating the performance does get low if you have a lot of little changes because each frame the graph has to update positions of all the points and lines. I can look into improving it by adding some options for things like slope differential and timestep options, but what is your use case that needs real-time updating and many little changes?
     
    Last edited: Sep 4, 2014
  44. AbgaryanFX

    AbgaryanFX

    Joined:
    Jan 9, 2010
    Posts:
    167
    Hi !
    1. any links to make bezier splines ?
    2. I'm not sure will my graphs have little changes or not, I just want to make sure that performance will be ok. I want to draw realtime updating graphs - maybe cached for further explore.
    3. Is there way to limit minimal distance of those points ?
    4. Is there way to cache ( make static maybe ) already made points and lines for better performance ?

    thanks
     
    Last edited: Sep 5, 2014
  45. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    Hi, I was trying to modify to my needs the editor example, but without success.

    I would like to know how can I modify where the link is generated and where is connected to the other node.
    For example I need from a node that has two ouputs and one input, something like this picture.
    but with two outputs and one input.

     
  46. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    @Artyom Abgaryan

    1. I will look into adding function(s) for generating bezier curves via API similar to my functions for generating circles for example, but for now you could research the math formula for the curve you want, and write a function to generate and set the x/y data for your curve, e.g. quadratic bezier http://en.wikipedia.org/wiki/Bézier_curve#Quadratic_curves

    2 / 4. Graph Maker does cache everything for you, so for example if you set data for 10 points, the creating and moving the sprites takes computational power for the frame in which you set the data, but every frame after that will be just like as if you had created and moved all the sprites by hand your self before run-time. Unfortunately, real-time update means that it is constantly updating, so performance will degrade at some point. Can you explain more about your use case, and what you mean by caching real-time update graph.

    3. Yea, I can look into adding a min time interval for update for the real-time update.

    @darkmax

    This one is a bit tricky, but you could actually pretty much achieve that look using the editor example scene, if you create separate nodes for the little circles that are the connectors, and create separate nodes for the rounded box areas.
     
  47. darkmax

    darkmax

    Joined:
    Feb 21, 2012
    Posts:
    83
    I tried like you say create a node, with nodes on the conectors, but without success, I add the component WMG_Node on the conectors settup like the prefabs node that you have but without success.

    I add a screenshot of what I'm doing for better reference.
     

    Attached Files:

    Last edited: Sep 6, 2014
  48. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Oh, I meant the connector node be a separate prefab outside of the rounded box prefab. You could parent them later together for organizational / code purposes after you get the look you want.
     
  49. rorakin3

    rorakin3

    Joined:
    Jan 2, 2013
    Posts:
    464
    Graph Maker 1.3.8 has been submitted which adds UGUI support! (Unity 4.6 Beta v. 18+)
     
  50. battal

    battal

    Joined:
    Oct 6, 2013
    Posts:
    3
    Hi!
    I am also in need of an updated version for the plugin to be used with NGUI v3.7.1 / Unity 4.5.3. I sent you a PM with my invoice number for the purchase. Thank in advance. Can't wait to use Graph Maker!