Skip to content

Commit

Permalink
发布1.0.0版本
Browse files Browse the repository at this point in the history
  • Loading branch information
monitor1394 committed Oct 25, 2019
1 parent 88428b8 commit 55a3533
Show file tree
Hide file tree
Showing 9 changed files with 108 additions and 52 deletions.
4 changes: 2 additions & 2 deletions Assets/XCharts/Documentation/XCharts配置项手册.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,6 @@

子组件:

* [Animation 动画](#Animation)
* [AreaStyle 区域填充样式](#AreaStyle)
* [AxisLabel 坐标轴刻度标签](#AxisLabel)
* [AxisLine 坐标轴轴线](#AxisLine)
Expand All @@ -31,6 +30,7 @@
* [LineArrow 折线图箭头](#LineArrow)
* [LineStyle 折线图样式](#LineStyle)
* [Location 位置](#Location)
* [SerieAnimation 动画](#SerieAnimation)
* [SerieData 数据项](#SerieData)
* [SerieLabel 图形上的文本标签](#SerieLabel)
* [SerieSymbol 图形标记](#SerieSymbol)
Expand Down Expand Up @@ -367,7 +367,7 @@
* `pieRadius`:饼图的半径。`radius[0]` 表示内径,`radius[1]` 表示外径。
* `label`:图形上的文本标签 [SerieLabel](#SerieLabel),可用于说明图形的一些数据信息,比如值,名称等。
* `emphasis`:高亮样式 [Emphasis](#Emphasis)
* `animation`:起始动画 [Animation](#Animation)
* `animation`:起始动画 [SerieAnimation](#SerieAnimation)
* `lineArrow`:折线图的箭头 [LineArrow](#LineArrow)
* `data`:系列中的数据项 [SerieData](#SerieData) 数组,可以设置`1``n`维数据。

Expand Down
136 changes: 96 additions & 40 deletions Assets/XCharts/Documentation/XCharts问答.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,65 +4,121 @@
[XChartsAPI接口](XChartsAPI.md)
[XCharts配置项手册](XCharts配置项手册.md)

1. 如何调整坐标轴与背景的边距?
答:`Grid`组件,可调整上下左右边距。
[QA 1:如何调整坐标轴与背景的边距?](#如何调整坐标轴与背景的边距)
[QA 2:如何让初始动画重新播放?](#如何让初始动画重新播放)
[QA 3:如何自定义折线图、饼图等数据项的颜色?](#如何自定义折线图、饼图等数据项的颜色)
[QA 4:如何格式化文字,如我想给坐标轴标签加上单位?](#如何格式化文字,如我想给坐标轴标签加上单位)
[QA 5:如何让柱形图的柱子堆叠显示?](#如何让柱形图的柱子堆叠显示)
[QA 6:如何让柱形图的柱子同柱但不重叠?](#如何让柱形图的柱子同柱但不重叠)
[QA 7:如何调整柱形图的柱子宽度和间距?](#如何调整柱形图的柱子宽度和间距)
[QA 8:如何调整柱形图单个柱子的颜色?](#如何调整柱形图单个柱子的颜色)
[QA 9:如何调整图表的对齐方式?](#如何调整图表的对齐方式)
[QA 10:可以显示超过1000以上的大数据吗?](#可以显示超过1000以上的大数据吗)
[QA 11:折线图可以画虚线、点线、点划线吗?](#折线图可以画虚线、点线、点划线吗)
[QA 12:如何限定Y轴(Value轴)的值范围?](#如何限定Y轴(Value轴)的值范围)
[QA 13:如何自定义数值轴刻度大小?](#如何自定义数值轴刻度大小)
[QA 14:如何在数据项顶上显示文本?](#如何在数据项顶上显示文本)
[QA 15:如何给数据项自定义图标?](#如何给数据项自定义图标)
[QA 16:锯齿太严重,如何让图表更顺滑?](#锯齿太严重,如何让图表更顺滑)
[QA 17:为什么鼠标移上图表Tooltip不显示?](#为什么鼠标移上图表`Tooltip`不显示)
[QA 18:如何取消Tooltip的竖线?](#如何取消`Tooltip`的竖线)
[QA 19:如何让Y轴(数值轴)显示多位小数?](#如何让Y轴(数值轴)显示多位小数)
[QA 20:如何用代码动态更新数据?](#如何用代码动态更新数据)
[QA 21:如何显示图例?](#如何显示图例)
[QA 22:如何做成预设?](#如何做成预设)
[QA 23:如何在图表上画点画线等自定义内容?](#如何在图表上画点画线等自定义内容)

2. 如何让初始动画重新播放?
答:调用`AnimationReset()`接口。
## 如何调整坐标轴与背景的边距

3. 如何自定义折线图、饼图等数据项的颜色?
答:通过`Theme``colorPalette`调整,或者部分`Serie`下的`LineStyle``ItemStyle`
答:`Grid`组件,可调整上下左右边距。

4. 如何格式化文字,如我想给坐标轴标签加上单位?
答:通过`formatter`参数,在`Legend``Axis``AxisLabel``Tooltop``Serie``Label`都提供改参数的配置。
## 如何让初始动画重新播放

5. 如何让柱形图的柱子堆叠显示?
答:设置`Serie`下的`stack``stack`相同的`serie`会堆叠显示在一个柱子上。
答:调用`AnimationReset()`接口。

6. 如何让柱形图的柱子同柱但不重叠?
答:设置`Serie`下的`barGap``-1``stack`为空。
## 如何自定义折线图、饼图等数据项的颜色

7. 如何调整柱形图的柱子宽度和间距?
答:调整`Serie`下的`barWidth``barGap`,多个`serie`时最后一个`serie``barWidth``barGap`有效。
答:通过`Theme``colorPalette`调整,或者部分`Serie`下的`LineStyle``ItemStyle`

8. 如何调整柱形图单个柱子的颜色?
答:目前暂不支持调整单子柱子的颜色,但可以通过两个`serie`同柱不堆叠来实现,通过设置数据项为`0`来达到类似效果。
## 如何格式化文字,如我想给坐标轴标签加上单位

9. 如何调整图表的对齐方式?
答:默认为左下角对齐,暂不支持调整。可以通过包一层parent来辅助控制。
答:通过`formatter`参数,在`Legend``Axis``AxisLabel``Tooltop``Serie``Label`都提供改参数的配置。

10. 可以显示超过1000以上的大数据吗?
答:可以。但`UGUI`对单个`Graphic`限制`65000`个顶点,所以太多的数据不一定能显示完全。可通过设置采样距离`sampleDist`开启采样简化过密曲线。也可以通过设置一些参数来减少图表的顶点数有助于显示更多数据。如缩小图表的尺寸,关闭或减少坐标轴的客户端绘制,关闭`Serie``symbol``label`显示等。折线图的普通线图`Normal`比平滑线图`Smooth`占用顶点数更少。
## 如何让柱形图的柱子堆叠显示

11. 折线图可以画虚线、点线、点划线吗?
答:可以。通过`Serie`下的`lineType`选择线条样式。当要显示的数据过多(成千以上)数据间过密时建议使用`Normal`或者`Step`样式。
答:设置`Serie`下的`stack``stack`相同的`serie`会堆叠显示在一个柱子上。

12. 如何限定Y轴(Value轴)的值范围?
答:设置`Axis`下的`minMaxType``Custom`,自定义`min``max`
## 如何让柱形图的柱子同柱但不重叠

13. 如何自定义数值轴刻度大小?
答:默认时通过`Axis`下的`splitNumer`进行自动划分。也可以设置`interval`自定义刻度大小。
答:设置`Serie`下的`barGap``-1``stack`为空。

14. 如何在数据项顶上显示文本?
答:通过设置`Serie`下的`Label`
## 如何调整柱形图的柱子宽度和间距

15. 如何给数据项自定义图标?
答:通过设置`Serie``data`下的数据项可单独设置`icon`相关参数。
答:调整`Serie`下的`barWidth``barGap`,多个`serie`时最后一个`serie``barWidth``barGap`有效。

16. 锯齿太严重,如何让图表更顺滑?
答:开启抗锯齿设置。调整UI渲染模式为Camera模式,开启MSAA,设置4倍或更高抗锯齿。锯齿只能减少难以避免,像素越高锯齿越不明显。
## 如何调整柱形图单个柱子的颜色

17. 为什么鼠标移上图表`Tooltip`不显示?
答:确认`Tooltip`是否开启。确认父节点是否关闭了鼠标事件。
答:目前暂不支持调整单子柱子的颜色,但可以通过两个`serie`同柱不堆叠来实现,通过设置数据项为`0`来达到类似效果。

18. 如何取消`Tooltip`的竖线?
答:设置`Tooltip``type``None`
## 如何调整图表的对齐方式

19. 如何让Y轴(数值轴)显示多位小数?
答:设置`Axis`下的`AxisLabel`中的`formatter``{value:f1}``{value:f2}`
答:默认为左下角对齐,暂不支持调整。可以通过包一层parent来辅助控制。

20. 如何用代码动态更新数据?
答:请查阅`Demo``Demo10_LineSimple.cs`
## 可以显示超过1000以上的大数据吗

答:可以。但`UGUI`对单个`Graphic`限制`65000`个顶点,所以太多的数据不一定能显示完全。可通过设置采样距离`sampleDist`开启采样简化过密曲线。也可以通过设置一些参数来减少图表的顶点数有助于显示更多数据。如缩小图表的尺寸,关闭或减少坐标轴的客户端绘制,关闭`Serie``symbol``label`显示等。折线图的普通线图`Normal`比平滑线图`Smooth`占用顶点数更少。

## 折线图可以画虚线、点线、点划线吗

答:可以。通过`Serie`下的`lineType`选择线条样式。当要显示的数据过多(成千以上)数据间过密时建议使用`Normal`或者`Step`样式。

## 如何限定Y轴(Value轴)的值范围

答:设置`Axis`下的`minMaxType``Custom`,自定义`min``max`

## 如何自定义数值轴刻度大小

答:默认时通过`Axis`下的`splitNumer`进行自动划分。也可以设置`interval`自定义刻度大小。

## 如何在数据项顶上显示文本

答:通过设置`Serie`下的`Label`

## 如何给数据项自定义图标

答:通过设置`Serie``data`下的数据项可单独设置`icon`相关参数。

## 锯齿太严重,如何让图表更顺滑

答:开启抗锯齿设置。调整UI渲染模式为Camera模式,开启MSAA,设置4倍或更高抗锯齿。锯齿只能减少难以避免,像素越高锯齿越不明显。

## 为什么鼠标移上图表`Tooltip`不显示

答:确认`Tooltip`是否开启。确认父节点是否关闭了鼠标事件。

## 如何取消`Tooltip`的竖线

答:设置`Tooltip``type``None`

## 如何让Y轴(数值轴)显示多位小数

答:设置`Axis`下的`AxisLabel`中的`formatter``{value:f1}``{value:f2}`

## 如何用代码动态更新数据

答:请查阅`Demo`下的代码,`Demo10_LineSimple.cs`就是一个简单添加数据构建折线图的例子,其他`Demo`也都是通过代码控制不同的组件实现不同的功能。

## 如何显示图例

答:首先,你的`serie`里的`name`需有值不为空。然后开启`Legend`显示,里面的`data`可以默认为空,表示显示所有的图例。如果你只想显示部分`serie`的图例,在`data`中填入要显示的图例即可。

## 如何做成预设

答:请删除chart下所有的子组件再拖成预设。

## 如何在图表上画点画线等自定义内容

答:xcharts有自定义绘制回调`customDrawCallback`,具体可参考`Demo12_CustomDrawing.cs`

[返回首页](https://github.com/monitor1394/unity-ugui-XCharts)
[XChartsAPI接口](XChartsAPI.md)
Expand Down
2 changes: 1 addition & 1 deletion Assets/XCharts/Editor/PropertyDrawers/AnimationDrawer.cs
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

namespace XCharts
{
[CustomPropertyDrawer(typeof(Animation), true)]
[CustomPropertyDrawer(typeof(SerieAnimation), true)]
public class AnimationDrawer : PropertyDrawer
{
private Dictionary<string, bool> m_AnimationModuleToggle = new Dictionary<string, bool>();
Expand Down
4 changes: 2 additions & 2 deletions Assets/XCharts/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,12 @@ A powerful, easy-to-use, configurable charting and data visualization library fo
1. 打开`Packages`目录下的`manifest.json`文件,在`dependencies`下加入:

``` json
"unity-ugui-xcharts": "https://github.com/monitor1394/unity-ugui-XCharts.git#package",
"com.monitor1394.xcharts": "https://github.com/monitor1394/unity-ugui-XCharts.git#package",
```

2. 回到`Unity`,可能会花3到5分钟进行下载和编译,成功后就可以开始使用`XCharts`了。
3. 如果要删除`XCharts`,删除掉1步骤所加的内容即可。
4. 如果要更新`XCharts`,删除`manifest.json`文件的`lock`下的`unity-ugui-xcharts`相关内容即会从新下载编译。在 `Component -> XCharts -> Check For Update`可以检测是否有新版本可更新。
4. 如果要更新`XCharts`,删除`manifest.json`文件的`lock`下的`com.monitor1394.xcharts`相关内容即会从新下载编译。在 `Component -> XCharts -> Check For Update`可以检测是否有新版本可更新。

* 在Editor上快速创建一个图表:

Expand Down
4 changes: 2 additions & 2 deletions Assets/XCharts/Runtime/Component/Main/Serie.cs
Original file line number Diff line number Diff line change
Expand Up @@ -209,7 +209,7 @@ public class Serie : MainComponent
[SerializeField] private float[] m_Center = new float[2] { 0.5f, 0.5f };
[SerializeField] private float[] m_Radius = new float[2] { 0, 80 };
[SerializeField] private SerieLabel m_Label = new SerieLabel();
[SerializeField] private Animation m_Animation = new Animation();
[SerializeField] private SerieAnimation m_Animation = new SerieAnimation();
[SerializeField] private LineArrow m_LineArrow = new LineArrow();
[SerializeField] private ItemStyle m_ItemStyle = new ItemStyle();
[SerializeField] private Emphasis m_Emphasis = new Emphasis();
Expand Down Expand Up @@ -401,7 +401,7 @@ public int maxCache
/// The start animation.
/// 起始动画。
/// </summary>
public Animation animation { get { return m_Animation; } set { m_Animation = value; } }
public SerieAnimation animation { get { return m_Animation; } set { m_Animation = value; } }
/// <summary>
/// The arrow of line.
/// 折线图的箭头。
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ namespace XCharts
/// 动画表现。
/// </summary>
[System.Serializable]
public class Animation : SubComponent
public class SerieAnimation : SubComponent
{
public enum Easing
{
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion Assets/XCharts/package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"name": "unity-ugui-xcharts",
"name": "com.monitor1394.xcharts",
"displayName": "XCharts",
"version": "1.0.0",
"unity": "2018.3",
Expand Down
4 changes: 2 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -106,11 +106,11 @@ XCharts的图表由组件和数据组成。不同的组件和数据可以组合
* 通过下载源码或`unitypackage`包导入到你的项目中。如果你是`2018.3`及以上版本,强烈建议通过`Package Manager``Git`来导入包:
1. 打开`Packages`目录下的`manifest.json`文件,在`dependencies`下加入:
``` json
"unity-ugui-xcharts": "https://github.com/monitor1394/unity-ugui-XCharts.git#package",
"com.monitor1394.xcharts": "https://github.com/monitor1394/unity-ugui-XCharts.git#package",
```
2. 回到`Unity`,可能会花3到5分钟进行下载和编译,成功后就可以开始使用`XCharts`了。
3. 如果要删除`XCharts`,删除掉1步骤所加的内容即可。
4. 如果要更新`XCharts`,删除`manifest.json`文件的`lock`下的`unity-ugui-xcharts`相关内容即会从新下载编译。在 `Component -> XCharts -> Check For Update`可以检测是否有新版本可更新。
4. 如果要更新`XCharts`,删除`manifest.json`文件的`lock`下的`com.monitor1394.xcharts`相关内容即会从新下载编译。在 `Component -> XCharts -> Check For Update`可以检测是否有新版本可更新。

* 在Editor上快速创建一个图表:

Expand Down

0 comments on commit 55a3533

Please sign in to comment.