Unity插件XCharts使用简记之基础属性设置

XCharts简介

最近项目中需要用到一些数据图表，如曲线图、柱状图等。便到了这个插件，由于该插件的教程较少，所以对其使用都是自己研究的，而且其中每一个图表脚本的属性都有好几十个，所以这里对插件的使用做一个简记。
注意：我只记录一些我用到的功能和使用，并不算详解，之后有机会再补全。

插件简介

引自插件作者介绍主页：

一款基于UGUI的功能强大、易用、参数可配置的数据可视化图表插件。支持折线图、柱状图、饼图、雷达图、散点图、热力图等常见图表。
特性：

• 内置丰富示例和模板，参数可视化配置，效果实时预览，纯代码绘制。
• 支持折线图、柱状图、饼图、雷达图、散点图、热力图等常见图表。
• 支持直线图、曲线图、面积图、阶梯线图等折线图。
• 支持并列柱图、堆叠柱图、堆积百分比柱图、斑马柱图等柱状图。
• 支持环形图、玫瑰图等饼图。
• 支持折线图—柱状图、散点图-折线图等组合图。
• 支持实线、曲线、阶梯线、虚线、点线、点划线、双点划线等线条。
• 支持自定义主题，内置主题切换。
• 支持自定义图表内容绘制，提供绘制点、直线、曲线、三角形、四边形、圆形、环形、扇形、边框、箭头等绘图API。
• 支持PC端和手机端上的数据筛选、视图缩放、细节展示等交互操作。
• 支持万级大数据绘制。

插件作者主页：

• https://blog.csdn.net/monitor1394/article/details/102762068

插件下载

插件下载链接：

1. https://github.com/monitor1394/unity-ugui-XCharts：插件源项目
2. https://download.csdn.net/download/f_957995490/12189881：我自己导出的unitypackage

插件中自带配置项手册和API，以及一些问题问答。

XCharts使用

打开项目或导入插件后，可找到两个demo场景，其中demo_xchart场景为总的效果呈现。

基础使用

注意：有些修改要运行一次或拖拽一下图表的大小等，使其将图表渲染一次的方法，才能看到效果。
当我们想要使用创建某种图表时，可如下图所示，在Hierarchy窗口中直接右键，在弹出的提示框中选择XCharts，便直接可以从延伸出来的提示框中点击选择需要的图表。

LineChart--------->线状图
BarChart--------->柱状图
PieChart--------->饼状图
RadarChart--------->雷达图
ScatterChart--------->散点图
HeatmapChart--------->热力图
GaugeChart--------->仪表盘

长宽

我们可以在创建出来的每一个图表上看到一个对应的总控制脚本，如上图Inspector窗口中的PieChart脚本组建一样。

其中，脚本上的ChartWidth和ChartHeight两个属性是用于设置整个图表的大小长宽的，可以直接设置数值，也可以在Scene窗口中通过拖拽调整。

主题（Theme）

往下的Theme属性的下拉列表中都是图表中对应的一些颜色属性，包括所用到的字体（Font）、背景颜色（BackgroundColor）、标题的颜色（TitleColor和TitleSubTextColor，设置UGUI的两种不同的文字框）、轴文字的颜色（AxisTextColor）和轴线的颜色（AxisLineColor和AxisSplitLineColor），最后属性ColorPalette是图表中每组数据一次用到的颜色。

如上图，绿色标出的1号数据用到的，便是属性ColorPalette下的第一个Element1的颜色；2号的是Element2；3号的是Element3，以此类推。
代码上，可以通过BaseChart.themeInfo直接获取类型为ThemeInfo的主题信息，其中自带3种不同的主题。

/// <summary>
/// 主题
/// </summary>
public enum Theme
{
    /// <summary>
    /// 默认主题。
    /// </summary>
    Default,
    /// <summary>
    /// 亮主题。
    /// </summary>
    Light,
    /// <summary>
    /// 暗主题。
    /// </summary>
    Dark
}

可以通过BaseChart.UpdateTheme(Theme theme)更新主题的类型；也可以通过BaseChart.UpdateThemeInfo(ThemeInfo themeInfo)直接更换主题信息。
ThemeInfo包含的与组建中Theme属性的下拉列表中显示的，大致相同。

标题（Title）

下一项属性为标题Title。该项选中打上对勾，便会显示标题；反之，亦然。
其中，文字内容在Text或SubText中设置；相对应的文字形态设置为TextStyle或SubTextStyle，分别包括Rotate角度、Offset坐标、Color颜色（这里的颜色我并未试出有什么用，在这里设置并没有任何效果）、以及字体大小和字体类型等。

提示信息（Tooltip）

Tooltip属性为提示信息，如下图所示。

该项选中打上对勾，便会在鼠标移动到相应位置时显示对应的提示信息；反之，亦然。
其中，LineStyle为提示线的风格设置；TextStyle为提示文字的风格设置。

数据系列（Series）

这里面是用来处理数据用的，而且大部分的图标里面的属性大致相同，只有一些特殊图表会有一些不一样的属性在里面。

• 其中，Size表示有几组数据。在饼状图中只需要用到一个；而在线状图中则是有几条线就要有几个。
• 然后，每组数据需要注意Name这个属性，及这组数据的名字，这个要在代码中用到。
• Label属性，是图表中的文字标签，就如上图中，多出来的3个标签。而标签的内容则是在Data属性中，每个Element中的第一栏数据后面的，第二栏里的内容决定的，刚创建时，可能里面并没有第二栏，这时只要点击上面的Name按钮就会出现，或者通过UpdateDataName函数，用代码添加数据的名字。
• 同时，图表中的数据设置可以在Data属性中直接设置；也可以通过代码AddData函数，添加数据；或通过代码UpdateData函数，更新数据，其中有很多重载函数，所使用的参数有serieName就是上面提到的名字（Series名字）、serieIndex是Series的下标索引、dataIndex是详细数据的下标索引、value便是具体的数值等。
• Animation属性，是让图表有一个显示的过程，选中则有，反之亦然。

特有属性

关于一些特有属性的设置：Unity插件XCharts使用简记之特有属性设置