图表组件

图表组件中提供了丰富样式的图表,便于您在原型制作中直观地展示数据。



如何编辑图表数据?

各类图表虽然在形式和属性设置方面有所差异,但是都可以选中图表,点击右上角的按钮来编辑图表数据,填充你需要的真实数据;或是双击页面中的图表,也能够触发数据窗口。

点击后,会从屏幕下方滑出数据窗口。可以在这里直接修改数据和文本支持输入负数,也可以点击右侧和下侧的「加号」来添加行或列。

⚠️注意添加行/列时,系统会自动生成随机数据,模拟真实数据情况,避免您手动修改带来的麻烦,图表绘制更简便。



点击每一行最左的色块,可以修改图表中的颜色。



图表设置

无论是哪一种图表,都有一些共性的设置选项。

在右侧外观设置面板,所有图表都可以选择主题颜色

所有图表都可以选择是否显示图例数据提示

勾选数据提示后,预览项目时,鼠标放置在某一数据点上时,会自动显示这一点的具体数据情况。



数据标签

勾选数据标签后,每一数据系列旁会出现具体的数值,这样在查看时更加清晰明确。

前/后缀单位

勾选并设置前/后缀单位后,坐标轴、数据标签和数据提示都会批量自动添加上该单位,数据更精准,图表更直观。



1.柱状图、条形图、折线图、面积图都可以切换图表的数据计算形式为普通、分组、堆积、百分比堆积4种形式。同时它们之间也可以便捷切换类型。

2.饼状图与环形图之间可以便捷切换;也可以选择是否显示辅助标记来区分数据区域。


接下来我们分别介绍各类图表的使用方法。



柱状图/条形图

由一系列垂直/水平条组成,通常用来比较一段时间中两个或多个项目。

柱状图与条形图的区别在于横纵坐标的不同

柱状图更着重数值上的差异,而条形图更适合展现排名。



属性设置

1.右侧的外观面板可以设置是否显示网格、坐标轴,这些元素都能够使数据对比更加直观;

如果选择不显示,则图表会更加简洁。

2.设置轴标签角度可以调整轴上文本的倾斜角度。



折线图/面积图

这两类图表常被用来显示一段时间内的趋势变化。

区别在于:折线图倾向于单纯地反映每个样本的变化趋势,而面积图还可以通过面积反映总体数据的变化趋势



属性设置

1.右侧的外观面板可以设置是否显示网格、坐标轴,这些元素都能够使数据对比更加直观;

如果选择不显示,则图表会更加简洁。

2.勾选端点平滑过渡后,折线会转变为曲线。



组合图

此功能正在灰度中,即将向全部用户开放使用,敬请期待!

由柱状图、折线图组成的双坐标混合图表。

注:最后一组序列数据为折线图,其余为柱状图。



属性设置

1.右侧的外观面板可以设置是否显示网格、坐标轴,这些元素都能够使数据对比更加直观。
2. 双击图表即可进入数据编写,数据支持输入负数
3.前缀单位、后缀单位决定了左右y轴的数值,默认为统一值。
4.组合图标输入数据序列必须大于1组,最后一组数据默认为折线图,由右侧y轴坐标展现。其他数据体现为柱状图,由左侧y轴坐标展现。

饼状图/环形图

当需要反映某个部分占整体比重多少时,就可以使用饼图。

饼图包含了圆环图,它类似于饼图,是使用环形的一部分来表现一个数据在整体数据中的大小比例。



属性设置

右侧的外观面板可以设置图表的圆角,圆角数值越大,每一个区域的边角会越圆滑。



进度圆环

这一图表不支持通过数据输入进行调整

它可以在右侧外观面板直接设置圆环的内径和进度,调整进度即可调整图表的显示。



雷达图

它用于显示独立数据系列之间以及某个特定系列与其他系列的整体关系。 每个分类都拥有自己的数值坐标轴,这些坐标轴同心点向外辐射,并由折线将同系列中值连接起来。

这篇文章帮助到你了吗?