mirror of
https://github.com/XCharts-Team/XCharts.git
synced 2026-05-25 02:10:16 +00:00
发布1.0.0版本
This commit is contained in:
monitor1394
@@ -19,7 +19,6 @@
|
||||
|
||||
子组件：
|
||||
|
||||
* [Animation 动画](#Animation)
|
||||
* [AreaStyle 区域填充样式](#AreaStyle)
|
||||
* [AxisLabel 坐标轴刻度标签](#AxisLabel)
|
||||
* [AxisLine 坐标轴轴线](#AxisLine)
|
||||
@@ -31,6 +30,7 @@
|
||||
* [LineArrow 折线图箭头](#LineArrow)
|
||||
* [LineStyle 折线图样式](#LineStyle)
|
||||
* [Location 位置](#Location)
|
||||
* [SerieAnimation 动画](#SerieAnimation)
|
||||
* [SerieData 数据项](#SerieData)
|
||||
* [SerieLabel 图形上的文本标签](#SerieLabel)
|
||||
* [SerieSymbol 图形标记](#SerieSymbol)
|
||||
@@ -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`维数据。
|
||||
|
||||
|
||||
@@ -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)
|
||||
|
||||
Reference in New Issue
Block a user