Unity accesses chartandgraph chart plug-in

explain

   Recently, some chart data display needs to be realized in the project , Because it needs some 3D Chart , So I chose ChartAndGraph This chart plug-in , The chart data is read through the background interface Json And analyze , Then call the chart plug-in API Display the data .

One 、 Implementation bar chart

Realization effect

Implementation steps

1. Create a column diagram preset as shown in the following figure ,Tools-Charts-Bar-Canvas-Simple Create a column diagram preset .
   
2. By means of Insperctor Set relevant parameters in the panel
   Find in the column diagram preset created in the above steps Canvas Bar Chart Script components , List common settings
   Column chart data settings ： among Categories Namely X Axial content （ But not under the chart X Data displayed on the axis ）,Groups Group name , Click the next three points to modify the move out and other operations .
   
   Y Axis data settings ：Y The axis data is on the column chart component Vertical Axis Control on script components , Common settings are as follows ：
   Format： Contains four data types Number、Time、Date、Date Time Four kinds of data （ Here, only these four data types can be selected , If Y The value of the shaft , The above four types cannot meet , You may need to extend the plug-in to support dynamic specification ）
   Text Prefix:Y Prefix of axis value
   Text Suffix：Y Suffix of axis text
   Main Divisions: Is the setting of the primary partition , Below the Total Yes set yes Y How many data does the axis have
   Sub Divisions: Is the setting of sub partition , Below the Total Yes set yes Y How many data does the axis have
   
3. Dynamically load data through scripts , Other settings can also be obtained through code , You can try .

  		canvasBarChart_LDSCL=this.GetComponent<CanvasBarChart>();

        // Data loading 
        canvasBarChart_LDSCL.DataSource.StartBatch();
        canvasBarChart_LDSCL.DataSource.SetValue("1 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("2 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("3 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("4 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("5 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("6 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.SetValue("7 month ", "all", 10);
        canvasBarChart_LDSCL.DataSource.EndBatch();

Two 、 Realize line chart

Realization effect

Implementation steps

1. Create a line chart preset as shown in the following figure , Click on Tools-Charts-Graph-Canvas-Simple Create presets .
   

2. By means of Insperctor Set relevant parameters in the panel .
   Find in the column diagram preset created in the above steps Graph Chart Script components , List common settings
   Graph Chart Script components ：
   Fit Margin: You can set X/Y The display start range of the axis
   Categories: Line chart data , You can set each group of data
   Horizontral View: If you check auto , The start value and end value will automatically match , If you don't want to start from 0 Start , Just uncheck through setting Horizontal View Origin To set the starting point , adopt Horizontal View Size To set the amount of data
   Vertical View： Empathy

   
   Verical Axis(Y Axis settings )

   The basic use is the same as the column chart above , No longer enumerated
   
   3. Dynamically load data through scripts

        graphChart_MJXY=this.GetComponent<GraphChart>();

        graphChart_MJXY.DataSource.StartBatch();
        graphChart_MJXY.DataSource.ClearCategory("main");
        graphChart_MJXY.DataSource.AddPointToCategory("main", 1, 1);
        graphChart_MJXY.DataSource.AddPointToCategory("main", 2, 2);
        graphChart_MJXY.DataSource.AddPointToCategory("main", 4, 3);
        graphChart_MJXY.DataSource.AddPointToCategory("main", 5, 5);
        graphChart_MJXY.DataSource.EndBatch();

Problems encountered

Problems encountered in development , Namely X The contents of the axis are displayed , Because this plug-in X/Y The content of the axis only includes Number、Time、Date、DateTime Four preset types , Discontinuous numbers need to be displayed in the development process , Such as 10、11、12、1、2、3, I add an enumeration type dynamically , Then set it dynamically X The value of the shaft . There are also some methods that have been extended .