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

Charts and Graphs for unity3d [Released]

Discussion in 'Assets and Asset Store' started by BitsplashIO, Jan 11, 2017.

  1. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    1. you can use chart.CustomDateTimeFormat = C# date time format.
    a c# date format can be specified as described in here : https://docs.microsoft.com/en-us/dotnet/standard/base-types/custom-date-and-time-format-strings

    2. This is the wrong way to do that. You can reassign the material to the property you are trying to chagne.
    So for example you can call:
    graph.DataSource.SetCategoryPoint("category", newMaterial, pointSize);
    for more information about changing category styles see : http://bitsplash.io/docs/graph-chart/graph-categories/adding-and-removing-categories
    3. similarly to 2 , you can do that by setting the material of the axis component or the item labels component.
    first , obtain the component object : http://bitsplash.io/docs/basic-concepts/obtaining-a-chart-object-for-scripting
    and then set the style from code :
    prepare text prefabs with the styles you wish to have , then assign them to
    you can set the prefab of http://bitsplash.io/docs/chart-axis/axis-settings
    and http://bitsplash.io/docs/chart-axis/item-labels
     
    jGate99 likes this.
  2. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    IF you are using automatic view portion , then one point is not enough to determine the view portion size ( because 1 point does not have a width or height). Only after two points are added , the width and height can be determined. You can set the view portion manually as described here :
    http://bitsplash.io/docs/basic-concepts/setting-the-view-portion/view-portion-basics
     
    jGate99 likes this.
  3. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Thank you for your prompt reply, which clearly shows your great support.

    Reason i suggested a delegate because sometime you want to use conditional date format, like what i want to do is whenever a year starts i show only year name, and then only months like this
    2021 , Feb, March .... December, 2022, Feb etc

    A delegate will make this easier.
     
  4. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Using same cached material with new color simply doesnt change color in the chart visually.

    Code (CSharp):
    1. PointMaterialDark.color = AUtilsColor.RandomColors.JumpToNextItem();
    2. dataSource.SetCategoryPoint(CATEGORY, PointMaterialDark, 12);
    Only way to make it work is instantiating a competely new material. Cant we reuse the same instance?
    Please advise
     
  5. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    VerticalAxis class doesnt expose any information to set a TextPrefab on runtime or even ability to change color of existing text prefab on runtime.
    As my app has themes, so i need a way to change axis's text colors
     
  6. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    Thank you for your feedback. I am checking all of these issues and will get back to you asap.
     
    jGate99 likes this.
  7. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    Version 1.953 should be available at the store later this day. It can set up formats using delegates , and contains an example scene showing how to change colors at runtime. If you are having any issues feel free to contact me here or at support@bitsplash.io
     
    jGate99 likes this.
  8. raydekk

    raydekk

    Joined:
    Mar 14, 2013
    Posts:
    100
    Hi,

    Can you please remove all the webrequest warnings in the next version?

    Change:
    if (webRequest.isNetworkError)

    To:
    if (webRequest.result == UnityWebRequest.Result.ConnectionError)


    In all the 4 data fillers .cs files.

    Thanks
     
  9. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    done for next version
     
    raydekk likes this.
  10. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    Thanks for the update, here is one question though

    when i'm using graph chart with scrollable feature
    Code (CSharp):
    1.  Data.AutomaticHorizontalView = false;
    2. Data.HorizontalViewOrigin = startDate.ToUnixTimeSeconds();
    3. Data.HorizontalViewSize = ChartDateUtility.TimeSpanToValue(visibleTime);
    4. AutoScrollHorizontally = false;
    which it works great and everything and lets say start from first month of 2021 year,
    now user with mouse scroll the chart to right showing lets say on November of 2020, and i then reassign the data source and call above code again and data once again set on janauary 2021.

    but problem is scrollable view remains at the same old place on november 2020 and user has to scroll to left to see data on january 2021.

    so how do i reset the position?
     
  11. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    2nd Question is:

    Following doesnt seem to trigger for my horizontal axis dates


    InputChart.CustomDateTimeFormat = (date) =>
    {

    return date.ToString("yyyy/M");
    };



    and this is how im setting date which appear fine on HAxis but without custom format triggering
    Code (CSharp):
    1.             dataSource.AddPointToCategory(CATEGORY, myDateAtHAxis, Random.Range(0.0f, 10.0f));
    2.  
     
  12. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Third question is my vertical axis always remain from 0 to 10 as in above code
    but i see vertical axis starting from negative values.

    If i know both lowered end value (like start from 0) and upper value like (15) then how do i set this range for vertical axis labels?

    Thanks


    upload_2021-8-18_21-21-0.png
     
  13. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    The panning feature uses graph.HorizontalScrolling rather then HorizontalViewOrigin. So can either set
    graph.HorizontalScrolling = 0; Or set HorizontalViewOrigin=0 , and use graph.HorizontalScrolling = startDate.ToUnixTimeSeconds();

    HorizontalViewOrigin is the origin of the axes , it should generally not be used for scrolling
     
  14. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    I cant tell what is the issue based on this infomation. Is it possible that the axis format is set to something other then "Date Time" ? did you have a look at the example scene ? does it work ? if not , send me more information to support@bitsplash.io
     
  15. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    Again, seems to be a cofusion between scrolling and origin. See the first answer for more information.
     
  16. callanabrown

    callanabrown

    Joined:
    Jul 2, 2017
    Posts:
    3
    Hello, I just bought this package (Lite version). I have found that when I use the Tools bar to add a chart, it gets inserted into a Canvas gameobject in the root of my game, not on the Canvas I have selected.
     
  17. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    Thank you for your feedback. I'll look into it and will update this on the next version
     
  18. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    Hi, just bought your asset today. Tried to add a canvas graph chart to a prefab via Tools->Charts->Graph->Simple/Multi and it does not work ... any idea?

    Also: The Graph-Charts seems to use normal Text Labels instead of TextMeshPro,...
     
  19. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    1. It is possible you don't have a canvas in your scene (there should be a message)
    2. see this article for TextMeshPro http://bitsplash.io/docs/getting-started/textmeshpro-installation
    you should assign the textmeshpro prefabs to your chart
     
    fraeri likes this.
  20. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    How do I change the line color from code? With the manual I got to this point, but it does not work ... the "lineMaterial" is a LineStyle-Prefab

    Code (CSharp):
    1. Material mat = Instantiate(lineMaterial);
    2. Color newColor = UnityEngine.Random.ColorHSV();
    3. mat.SetColor("Combine", newColor);
    4. mat.SetColor("From", newColor);
    5. mat.SetColor("To", newColor);
    6. Graph.DataSource.SetCategoryLine(id.ToString(), mat, lineThickness, new MaterialTiling(true,20));

    Another Question:
    I need horizontal a horizontal Bar-Chart and found this: http://bitsplash.io/docs/bar-chart/how-to-make-a-horizontal-bar-chart-2

    Rotating the RectTransform of the Barchart by 90 degrees makes sizing and positioning difficult. Streching it to it's parent is not possible anymore, is it?


    Another Question:
    How does this "MaxValue" work with the Graph Chart? In DataSource it's not available



    P.s.: Is it possible to search in the Manual?
     
    Last edited: Aug 29, 2021
  21. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    1. the code you have sent , should work. as long as the material is a chart gradient material
    2. you can control the stretching from the inspector, and the stretching should rotate with the chart anyway
    3. MaxValue should be available either through datasource or the chart it self

    I suggest you contact me via email if you still encountering any issues. Perhaps show me some reference images so i can understand the issues better.
     
  22. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64

    I just send you an email with screenshots, but it may be also interesting for others as well!

    Cheers!
     
  23. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    That's true. Here are the answers from the email:

    1. Do not use color change within StartBatch and EndBatch
    2. Use the Graphs View Portion : http://bitsplash.io/docs/basic-concepts/setting-the-view-portion/view-portion-basics
    3. Place the chart in a squared rect tranform and toggle FitToContainer.
     
  24. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    Hi,
    How should that help if I don't want the graph to be square?

    Also: For the bar-chart is it possible to make the bars as wide as possible while giving a fixed value for the spacing between them? I found the BarContentFitter Component but at first glance I only can a fixed bar size.


    For graphchart: Is it possible to do GetCategoryLine instead of only to set it with SetCategoryLine? It would be useful for me, since I can toggle between dark/light mode and want to manipulate the line color only if its to light or dark for the background. For this it would also be helpful to check that Categories are in the graph so I can loop through them

    Thanks!
     
    Last edited: Sep 6, 2021
  25. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    You can untoglle fit to container and set the height ratio. As long as the containing rect transform is square it will fit right in. Same way you would do if you were to rotate a panel with unity,

    I have just made a patch for that , please contact me by email or wait for the latest version.

    You cannot call GetCategoryLine because that would mess with the internal materails and settings of Graph and Chart. I would suggest keeping a boolean "isDark" to determine if you are in dark theme or light theme.

    Let me know if you need any further assistance on any of these issues. Also , i see that the email i sent you bounced back though your mail server.
     
  26. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    How can i set maximum and minimum value for Vertical Axis Values?

    For example in this "preset 1" scene from your sample, minimum vertical value is 0 and maximum is 10 and from where these values are set?


    upload_2021-9-7_22-32-30.png
     
    fraeri likes this.
  27. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    jGate99 likes this.
  28. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
  29. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    I have attached a 3 file patch. Replace the original files with these files.


    1. You can add a BarContentFiller instead of BarContentFitter. It will make it so that the bars fill the rest of the space.
    2. I have added Get methods to the graph chart, Use them for checking only , not for modification. IF you want to modify the style then call the equivalent set method.

    Let me know if you need any further assistance .
     

    Attached Files:

    Last edited: Sep 10, 2021
  30. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    you can adjust this property:
    upload_2021-9-9_20-31-37.png
     
  31. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    Notice this chart, how it starts month based.




    and this is my chart, how do i make it look orange with month based values?

    Please advise

    upload_2021-9-9_22-56-16.png

    How do i turn it into
     
  32. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Orange Chart

    upload_2021-9-9_22-58-8.png
     
  33. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    Another question is,
    how do i customize this theme, so bar are multiple colors (red, green , blue)
    upload_2021-9-9_23-5-16.png



    BUT they look like this graph chart theme (color slowly moving to alhpa)

    upload_2021-9-9_23-10-48.png
     
  34. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    Hi, Thank you for noticing about the email problem. Unfortunately you are the only person with this problem.
    Anyway, could you edit your post, so that my Email is not visible in public?

    I will try your solution later. Thank you a lot for this!
     
    BitsplashIO likes this.
  35. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
  36. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    I emailed you, with updated problem as i have almost got the look right.
    If you look at image, it has 12 points as 12 months of data.

    But its buggy, For example chart is showing september twice which is wrong, second september is actually october and so all the month labels are wrong this way and last point with value 2 is actually august which as you can see is pushed outside of view.

    So
    1- Fixing Wrong Horizontal Axis Labeling Bug

    2- Divisions appearing directly under the points.


    Please advise

    image.png
     
  37. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    As of my answer in the email. This happened because the view portion was not set properly.
     
  38. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64

    Hi, tried your scripts and the Bar Content Filler is working fine until I turn on "Fit to Container" in the CanvasBarChart Script before running it. If I run the program the following errors are occurring a lot:
    Code (CSharp):
    1. transform.position assign attempt for 'TextMeshProCanvas(Clone)' is not valid. Input position is { NaN, NaN, NaN }.
    2. UnityEngine.Transform:set_position (UnityEngine.Vector3)
    3. TextController/<>c__DisplayClass32_0:<ApplyTextPosition>b__0 (BillboardText) (at Assets/Assets/Chart And Graph/Script/Text/TextController.cs:339)
    4. System.Collections.Generic.List`1<BillboardText>:RemoveAll (System.Predicate`1<BillboardText>)
    5. TextController:ApplyTextPosition () (at Assets/Assets/Chart And Graph/Script/Text/TextController.cs:330)
    6. TextController:Canvas_willRenderCanvases () (at Assets/Assets/Chart And Graph/Script/Text/TextController.cs:68)
    7. UnityEditor.Undo:Internal_CallWillFlushUndoRecord ()
    8.  
    However if I just turn it on manually in the inspector during run time, after its drawn, the Barchart will be fitted. Any idea? Seems like a timing issue. I am filling the BarChart from the code.
     
    Last edited: Sep 14, 2021
  39. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO
    How do i change color of Bar Chart Item Label on runtime? I tried applying a color to its "ItemLabel"'s text prefab but it doesnt seem to do anything.
     
  40. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    Thanks for adding "CustomNumberFormat" function, however i got a case where i want to set different number format
    for different axis.. Currently both Horizontal and Vertical Axis uses the same format.

    Can you please add a feature where we can set different "CustomNumberFormat" function for different axis?

    Thanks
     
  41. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    I have tried to reproduce this but couldn't. I may be due to layout or ui hirarchies that are not set properly in your scene.
    if the problem persists , try uploading a scene that reproduces the issue.
     
  42. jGate99

    jGate99

    Joined:
    Oct 22, 2013
    Posts:
    1,936
    Hi @BitsplashIO

    How can i have horizontally centred labels category labels for bar chart?

    Please advise


    upload_2021-9-19_19-6-1.png

    upload_2021-9-19_19-6-1.png
     
  43. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    This happens because of the alignment of the text prefab in use , or by the string provided for the category. Check that the category name does not contain some invalid characters and the text prefab you are using is aligned to the center
     
  44. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    The problem occurs if your default dataSource only contains a group and no categories. I had nothing in it, because I filled in data on runtime. The problem disappears, when a typed in some "demo data" which I am clearing before plotting the actual data. So it's a kind of fix for me ,...
     
  45. RealWyldhunt

    RealWyldhunt

    Joined:
    Dec 5, 2017
    Posts:
    32
    In the newest version of Unity, I'm getting a few warnings about obsolete functions.
    Everything still works fine, just an FYI.
    The messages all refer to UnityWebRequest.isNetworkError, IE:
    Assets\Plugins\Chart And Graph\Script\DataFillers\BarDataFiller.cs(226,17): warning CS0618: 'UnityWebRequest.isNetworkError' is obsolete: 'UnityWebRequest.isNetworkError is deprecated. Use (UnityWebRequest.result == UnityWebRequest.Result.ConnectionError) instead.'
     
  46. fraeri

    fraeri

    Joined:
    Nov 8, 2018
    Posts:
    64
    I could do that, but my user can change the aspect ratio of the view and therefor the aspect ratio of the graph should change as well.
    Would it be possible to change the "FitToContainer"-Option in the CanvasBarChart Component so that it reacts to the rotation of the Barchart? Either automatically by reading the Z-Rotation value or manually via toggle?


    Also: How do I Fit a Pie chart to the container automatically?
     
    Last edited: Sep 25, 2021
  47. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    This issue was solved in the newer versions of Graph and Chart. please update to the newest version
     
  48. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    I am working on a solution.
     
  49. BitsplashIO

    BitsplashIO

    Joined:
    Dec 9, 2016
    Posts:
    254
    I have attached a patch that allows you to place vertical bar charts way easier.
    you can now set the orientation of the bar chart using :
    upload_2021-9-28_20-47-4.png

    I'll be looking to the pie chart soon as well.
     

    Attached Files:

    fraeri likes this.
  50. iSinner

    iSinner

    Joined:
    Dec 5, 2013
    Posts:
    201
    I have sent you an email with an issue but you have not yet responded, so i'm trying here once more:

    I have some issues that I can't resolve, with the bar chart and I would appreciate if you could help me.

    Here is a chart I have https://i.imgur.com/NpPvWPY.png
    The number of groups is arbitrary, it is generated at runtime and can be 2 or 20 or even more.

    My goal is to have a chart in which I can add as many groups as I want, and it doesn't change it's "zoom" so to speak, the bars and the text remains the same size, it just becomes scrollable to the right as more groups are added. I really need your help to accomplish this.

    THe solution i thought of, is resizing the chart rect transform width, but there are issues. The problem is, i need the rect transform width to extend as i add more groups, so that if there are more groups after "Header 1", like here ( https://i.imgur.com/34Jz3ul.png ), i need rect transform containing the chart to extend to the right as well, so that the scroll view in which this chart is located allows me to scroll horizontally to see all the groups.

    Currently when new groups are added, the rect transform size of the chart stays constant and the chart inside shrinks.
    I need the rect transform to extend as more groups are added, so that it looks something like this ( https://i.imgur.com/TU37lN6.gif ). As you can see, after i extended it manually, i can scroll, and the chart is readable because it doesn't shrink.

    There is also another problem to take into account. When the bar chart rect transform size changes, the group names also change position, which can be seen here ( https://i.imgur.com/D3ub7ZQ.gif ). Notice the group names. I need them to stay under their respective correct group and not change position when resizing the chart rect transform.

    I noticed that the Graph type of charts have a scrollable feature. If I could scroll the bar chart similarly, that would be great as well.