GraphMaker1.5.7笔记（unity图表插件）

1.GraphMaker只针对unity的UGUI开发，NGUI要用GraphMaker_NGUI，可接入第三方插件。

2.生成图表对象要通过GraphMaker内部封装的函数生成，并且要在Start()函数里生成，生成、赋值、设父节点后要立刻调用 Init() 函数初始化，如： myGraph.Init(); 。

3.给图表上的点或者条、面片之类的添加自己的触发函数，要调用委托函数：
WMG_Click（WMG_Series aSeries,WMG_Node aNode），例如：

public class GraphPointInteraction : MonoBehaviour {
public WMG_Axis_Graph myGraph;
void MyCustomFunction(WMG_Series series, WMG_Node node) {
Debug.Log("Node: " + node.name + " on series: " + series.name + " was clicked!");
}
void Start() {
myGraph.WMG_Click += MyCustomFunction;
}
}

4.在自定义的代码上动态改变图表的属性变量或者属性列表时，要在改变之后立刻调用 Refresh（）函数将这些改变应用到对应的图表中。

5.图表在运行中执行对应的变动时出现抖动或者有组件图片跟不上这种情况时（不是FPS卡的问题），把下面的代码加到WMG_Axis_Graph.cs类中。
void OnRectTransformDimensionsChange () {
if (!hasInit) return;
updateFromResize();
Refresh();
}

6.GraphMaker不适合有太多数据的图表的展示，一两百个点还可以处理，多了就会导致FPS卡顿。

7.尽量使用代码而不是编辑器来管理和改动图表预制体或者图表的图片元素，否则会出现各种变量报空的bug。

8.圆饼图1）WMG_Pie_Graph.interactivityEnabled 是否开启交互，true则开启，通过WMG_Pie_Graph.WMG_Pie_Slice_Click （点击饼块）、 WMG_Pie_Graph.WMG_Pie_Slice_MouseEnter （鼠标悬停在饼块）、 WMG_Pie_Graph.WMG_Pie_Legend_Entry_Click （鼠标点击标签样例）三个委托来添加对应的触发事件，如：
void SliceClickEvent( WMG_Pie_Graph pieGraph , WMG_Pie_Graph_Slice aSlice ) 、
void SliceMousEnterEvent( WMG_Pie_Graph pieGraph , WMG_Pie_Graph_Slice aSlice , bool hover ) 、 void SliceLegendEntryClickEvent(WMG_Pie_Graph pieGraph, WMG_Legend_Entry legendEntry)

2）WMG_Pie_Graph.useDoughnut 是否开启饼圈形，true则可以抠去中心，圆饼图成环形。

3）WMG_Pie_Graph.doughnutPercentage 开启饼圈形时抠去中心的圆的半径百分比，0.0f等于没抠，1.0f就完全抠完了。

4） Vector WMG_Pie_Graph.getPositionFromExplode（WMG_Pie_Graph_Slice aSlice, float aDistance）获取交互时，饼块往外迸发的目标位置的函数，aSlice是要控制的饼块，aDistance是往外迸发的距离。

5) void WMG_Anim.animPosition(GameObject objOfSlice, float speed, DG.Tweening.Ease easeMode, Vector3 positionFromExplode) 交互时饼块的DoTween动作，objOfSlice是饼块的gameobject，speed是动作的速度，easeMode 是动作的缓冲模式，positionFromExplode是动作的目标位置。

6）WMG_Pie_Graph.sliceValues.SetList( WMG_List<float> myValue) 设置每个饼块具体值的列表的内置函数，sliceValues不能直接改，否则相关的变量的count没跟着改，会报超下标的bug，WMG_List<T> 是框架重新封装一遍的 List<T> 。
WMG_Pie_Graph.sliceLabels.SetList( WMG_List<string> myLabels) 设置每个饼块的标签名的内置函数。
WMG_Pie_Graph.sliceColors.SetList( WMG_List<Color> myColor) 设置每个饼块的颜色的内置函数。
WMG_Pie_Graph.bgCircleOffset 背景圆底突出圆饼图的距离，距离越大，圆饼图底下的背景圆底突出越多，直接赋float值。
WMG_Pie_Graph.sortBy 饼块的排序，顺时针排列，直接赋 WMG_Pie_Graph.sortMethod 枚举值。
WMG_Pie_Graph.explodeLength 饼块之间的间隔距离，直接赋float值。
WMG_Pie_Graph.explodeSymmetrical 饼块迸发是否对称，什么卵，大概就是是否保持圆饼图的半径，饼块之间间隔距离越远，整个分离的圆饼图的半径应该是越大的，如果要保持圆饼原来的半径，那得裁掉超出原来半径的部分，直接赋true则保持。
WMG_Pie_Graph.sliceLabelExplodeLength 每个饼块上的百分比标签到圆饼边缘的距离，大于0.0f在圆饼外，小于0.0f在圆饼内，直接赋float值。
WMG_Pie_Graph.sliceLabelFontSize 每个饼块上的百分比标签的大小，直接赋int值。
WMG_Pie_Graph.numberDecimalsInPercents 每个饼块上百分比标签的小数点后的位数，直接赋int值。

建个空场景，里面要有camera、canvas、eventsystem，将下面test代码拉到canvas上。

这是test代码：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class MyPieGraph : MonoBehaviour {

public WMG_Pie_Graph pieGraphPrefab;

// Use this for initialization
void Start () {
GameObject pieGraphObj = Instantiate<WMG_Pie_Graph>(pieGraphPrefab).gameObject;
pieGraphObj.transform.SetParent(GameObject.Find("Canvas").transform,worldPositionStays:false);
pieGraphObj.GetComponent<RectTransform>().sizeDelta = pieGraphObj.transform.parent.GetComponent<RectTransform>().rect.size; //全屏
WMG_Pie_Graph pieGraph = pieGraphObj.GetComponent<WMG_Pie_Graph>();

pieGraph.Init();

//Debug.Log(pieGraph.gameObject.name);
WMG_List<float> pieValues = new WMG_List<float>() { 60f, 80f, 75f, 90f, 100f, 85f, 95f };
WMG_List<string> pieLabels = new WMG_List<string>() { "小明", "小红", "小花", "小刚", "小青", "小白", "小龙" };
WMG_List<Color> pieColor = new WMG_List<Color>() { Color.red, Color.yellow, Color.green, Color.blue, Color.cyan, Color.black };
//pieGraph.resizeEnabled = true;

///////pieGraph.sliceValues = pieValues; Debug.Log("草泥马有几个：" + pieGraph.sliceValues.Count);
////////pieGraph.sliceLabels = pieLabels; //不能直接改变量，要用内置函数去改
////////pieGraph.sliceColors = pieColor;
pieGraph.sliceValues.SetList(pieValues);
pieGraph.sliceLabels.SetList(pieLabels);
pieGraph.sliceColors.SetList(pieColor);

pieGraph.sliceLabelExplodeLength = 10f;
pieGraph.autoCenter = false;
//pieGraph.autoCenterMinPadding = 10f;
//pieGraph.bgCircleOffset = 80f;
pieGraph.sortBy = WMG_Pie_Graph.sortMethod.None;
//pieGraph.explodeLength = 30f;
//pieGraph.explodeSymmetrical = false;
pieGraph.sliceLabelFontSize = 30;
pieGraph.numberDecimalsInPercents = 5;

pieGraph.interactivityEnabled = true;
//pieGraph.WMG_Pie_Slice_Click += SliceClickEvent;
pieGraph.WMG_Pie_Legend_Entry_Click += SliceLegendEntryClickEvent;

//pieGraph.Refresh();
}

void SliceClickEvent(WMG_Pie_Graph pieGraph, WMG_Pie_Graph_Slice aSlice)
{
Debug.Log("草泥马踩到我了");
}
void SliceLegendEntryClickEvent(WMG_Pie_Graph pieGraph,WMG_Legend_Entry legendEntry )
{
Debug.Log("草泥马别蹭我");
}

   // Update is called once per frame
   //void Update () {

   //}
}

（后面的折线图、条形图、、、还在整理）

9.轴图
1）WMG_Axis_Graph.graphTypes 轴图的类型，轴图分为折线轴图和条形轴图，直接赋WMG_Axis_Graph.graphTypes 枚举值，赋完值要记得WMG_Axis_Graph.Refresh()一下，否则会出现一个乱图。

2）WMG_Axis_Graph.orientationType 就是x轴是横着V还是竖着H，直接赋WMG_Axis_Graph.orientationTypes 枚举值。

3）WMG_Axis_Graph.axesTypes 轴的类型（左下、十字、右上、、、），直接赋WMG_Axis_Graph.axesTypes 枚举值。

4）WMG_Axis_Graph.resizeEnabled 是否开启动态重设轴图大小，直接赋布尔值。

5）WMG_Axis_Graph.resizeProperties 要开启动态重设的属性，直接赋WMG_Axis_Graph.ResizeProperties 枚举值。

6）WMG_Axis_Graph.useGroups 是否使用groups数据，设false的话，更改groups也不会显示，直接赋布尔值。

7）WMG_Axis_Graph.groups 轴图的组集合，控制着每个系列(每条线)里面的点的个数和名字，不能直接赋值，否则相关变量没改，会报下标多或不足的bug，只能同过WMG_Axis_Graph.groups.SetList( WMG_List<string> myGroups)内置函数去改。

8）WMG_Axis_Graph.lineSeries 轴图的系列集合，就是轴图有几条线，直接赋 List<GameObject> 集合，除非你能按它里面的规范自己做预制体，否则里面的GameObject是框架里的series预制体，可以通过series预制体获取绑在它身上的WMG_Series脚本，并设置系列的相关属性，如：seriesName(轴图下面的系列图标显示的名字)，pointValue(每个点的二维坐标集合，WMG_List<vector2>类型，x坐标只能是顺序整数)，pointColor或pointColors(每个点的颜色)等等。

9）WMG_Axis_Graph.paddingLeftRight 轴图中轴的左右衬垫，二维值，在左下角o点的轴图中，x是左边衬垫(即y轴与整图边缘的距离)，y是右边衬垫(即x轴箭头与整图边缘的距离)。

10）WMG_Axis_Graph.paddingTopBottom 轴图中轴的上下衬垫，与左右衬垫类同。

11）WMG_Axis_Graph.theOrigin 轴图的原点，要自己设置的时候，得先把WMG_Axis_Graph.autoUpdateOrigin设为false，否则框架会动态锁定(0,0)为原点，直接赋vector2值。

12）WMG_Axis_Graph.barWidth 当轴图类型为条形图时，给每个长条分配的宽度，要自己设置的时候，得先把WMG_Axis_Graph.autoUpdateBarWidth设为false，否则框架会根据数据多少来动态更新适合的宽度(x轴长度/长条数)，直接赋float值。

13）WMG_Axis_Graph.barAxisValue 当轴图为bar_side条形图时有效，每个长条的底部所在的高度(长条竖着的时候是y值，横着的时候是x值)，不管长条底部在哪个高度，长条顶部的高度都会跟WMG_Series.pointValue集合里设置的高度一样，所以要改动长条底部的高度，同时也要改动长条顶部的高度，这样才能将轴图的长条整体上下平移，要自己设置的时候，得先把WMG_Axis_Graph.autoUpdateBarAxisValue设为false，否则框架会锁定0高度为长条底部高度，直接赋float值。

14）WMG_Axis_Graph.autoUpdateBarWidthSpacing 当轴图为条形图时，空隔的实际宽度占分配的宽度的百分比，空的越多，长条越细，直接赋0到1的float值。

15）WMG_Axis_Graph.autoUpdateOrigin
WMG_Axis_Graph.autoUpdateBarWidth
WMG_Axis_Graph.autoUpdateBarAxisValue （用法如上11)、12)、13)）

16）WMG_Axis_Graph.autoFitLabels 是否自动适应系列标签的高度作为衬垫，如果设true，框架会自动适应WMG_Axis_Graph.paddingLeftRight 的x值和WMG_Axis_Graph.paddingTopBottom的y值，而WMG_Axis_Graph.autoFitPadding 自动适应的衬垫值也是x轴标签与系列标签顶部的距离而不是 x轴标签与整图边缘的距离，不会出现系列标签和轴重叠的情况，直接赋布尔值。

17）WMG_Axis_Graph.yAxis.AxisMinValue 和WMG_Axis_Graph.yAxis.AxisMaxValue 轴图y轴的最大值和最小值，直接赋float值。

18）WMG_Axis_Graph.yAxis.AxisNumTicks 轴图y轴的分割点个数，如设为4时，0到100，只有0,25,75，100四个分割点，直接赋int值。

19）WMG_Axis_Graph.yAxis.MinAutoGrow 和WMG_Axis_Graph.yAxis.MaxAutoGrow 轴图y轴的最小值比最小数据大时自动增加不足部分，轴图y轴最大值比最大数据小时自动增加不足部分。

20）WMG_Axis_Graph.yAxis.MinAutoShrink和 WMG_Axis_Graph.yAxis.MaxAutoShrink 轴图y轴最小值比最小数据小时自动缩减多余部分，轴图y轴最大值比最大数据大时自动缩减多余部分。

21）WMG_Axis_Graph.yAxis.AxisLinePadding 轴图y轴超出最大值的距离，好像是按像素算，直接赋float值。

22）WMG_Axis_Graph.yAxis.HideAxisArrowTopRight 是否隐藏轴的上、右箭头，直接赋布尔值。

23）WMG_Axis_Graph.yAxis.hideGrid 是否隐藏y轴的网格线，直接赋布尔值。

24）WMG_Axis_Graph.yAxis.hideTicks 是否隐藏y轴的分割点(hideTick好像是旧版本的，没卵用)，直接赋布尔值。

25）WMG_Axis_Graph.yAxis.AxisTitleString 轴图y轴的标头，标明y轴的值是什么类型什么单位的，直接赋string值。

26）WMG_Axis_Graph.yAxis.AxisTitleOffset 轴图y轴的标头位置偏移，(0,0)点是y轴中点，(10,10)是y轴的左上角，直接赋vector2值。

27）WMG_Axis_Graph.yAxis.AxisTitleFontSize 轴图y轴的标头的字体大小，直接赋int值。

28）
。
。
。
写个屁，都差不多，看了那么久，后面的还不会自己看，那还玩个mmp。

把下面脚本预制体拖到Canvas下一条条代码测试，还是一样，场景要有camera、canvas、eventsystem。

测试的代码：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class myLineGraph : MonoBehaviour {

public WMG_Axis_Graph lineGraphPrefab;

WMG_Axis_Graph lineGraph;

// Use this for initialization
void Start () {
GameObject lineGraphObj = Instantiate<WMG_Axis_Graph>(lineGraphPrefab).gameObject;
lineGraphObj.transform.SetParent(GameObject.Find("Canvas").transform, worldPositionStays: false);
lineGraphObj.transform.localPosition = Vector3.zero;
lineGraphObj.GetComponent<RectTransform>().sizeDelta = lineGraphObj.transform.parent.GetComponent<RectTransform>().rect.size; //全屏
lineGraph = lineGraphObj.GetComponent<WMG_Axis_Graph>();
lineGraph.Init();

WMG_List<Vector2> pointPos = new WMG_List<Vector2>() { new Vector2(1f, 3f),new Vector2(2f,20f),new Vector2(3f,4f),
new Vector2(4f,13f),new Vector2(5f,1f),new Vector2(6f,4f),new Vector2(7f,16f) };
WMG_List<string> lineGroups = new WMG_List<string>() { "小明", "小红", "小花", "小刚", "小青", "小白", "小龙" };
WMG_List<Color> lineColor = new WMG_List<Color>() { Color.red, Color.yellow, Color.green, Color.blue, Color.cyan, Color.black };

//lineGraph.useGroups = true;
lineGraph.groups.SetList(lineGroups);
lineGraph.xAxis.axisLabels.SetList(lineGroups);
//lineGraph.lineSeries = new List<GameObject>();
lineGraph.lineSeries[0].GetComponent<WMG_Series>().pointValues = pointPos;
lineGraph.lineSeries[0].GetComponent<WMG_Series>().seriesName = "草泥马";
lineGraph.lineSeries[1].GetComponent<WMG_Series>().seriesName = "叼石牛";
//lineGraph.theOrigin = new Vector2();

//lineGraph.graphType = WMG_Axis_Graph.graphTypes.bar_stacked;
//lineGraph.orientationType = WMG_Axis_Graph.orientationTypes.horizontal;
//lineGraph.axesType = WMG_Axis_Graph.axesTypes.III;
//lineGraph.resizeEnabled = true;
//lineGraph.resizeProperties = WMG_Axis_Graph.ResizeProperties.AxesLabelOffset;
//lineGraph.useGroups = true;
//lineGraph.graphType = WMG_Axis_Graph.graphTypes.bar_side;
//lineGraph.autoUpdateBarWidth = false;
//lineGraph.autoUpdateBarAxisValue = false;
//lineGraph.barWidth = 1f;
//lineGraph.barAxisValue = 15f;
//lineGraph.autoUpdateBarWidthSpacing = 0.1f;
//lineGraph.resizeProperties = WMG_Axis_Graph.ResizeProperties.AutofitPadding;
//lineGraph.resizeProperties = WMG_Axis_Graph.ResizeProperties.AxesLinePadding;
lineGraph.paddingLeftRight = new Vector2(70f, 50f);
lineGraph.paddingTopBottom = new Vector2(50f, 70f);
//lineGraph.autoFitLabels = true;
//lineGraph.autoFitPadding = 1f;
//lineGraph.yAxis.AxisMinValue = 2f;
//lineGraph.yAxis.AxisMaxValue = 13f;
//lineGraph.yAxis.AxisNumTicks = 10;
//lineGraph.yAxis.MinAutoGrow = true;
//lineGraph.yAxis.MaxAutoGrow = true;
//lineGraph.yAxis.MinAutoShrink = true;
//lineGraph.yAxis.MaxAutoShrink = true;
//lineGraph.yAxis.AxisLinePadding = 100f;
//lineGraph.yAxis.HideAxisArrowTopRight = true;
//lineGraph.yAxis.hideGrid = true;
//lineGraph.yAxis.hideTick = true; //没卵用
//lineGraph.yAxis.hideTicks = true;
lineGraph.yAxis.AxisTitleString = "海拔";
lineGraph.yAxis.AxisTitleOffset = new Vector2(30f, 30f);
lineGraph.yAxis.AxisTitleFontSize = 30;

lineGraph.Refresh();
}

   // Update is called once per frame
   //void Update () {

// }
}

GraphMaker1.5.7笔记（unity图表插件）

猜你喜欢