文档

排行榜

更新时间:

排行榜一般反映指标在维度中的分布及排名顺序,简洁地展示TOP N的降序排行。例如,排行榜根据销售额从大到小的顺序展示TOP 10城市。本文为您介绍如何为排行榜添加数据并配置样式。

效果图

排行榜包含基础排行榜和占比滚动排行榜,效果图如下所示。效果图

配置数据

基础排行榜为例为您介绍排行榜的数据配置。

  1. 在组件库区域的图表中,找到基础排行榜并拖至画布中。image.png

  2. 单击请选择数据集,并按照下图指引,添加数据。image.png

您还可以对数据进行以下操作:

image.png

配置样式

基础排行榜为例为您介绍排行榜的样式配置。

位置和尺寸

您可以在配置区对组件进行如下设置:

  • 调整组件的对齐方式(①):支持左对齐、居中和右对齐等。

  • 调整组件的尺寸(②):以左上角为原点,设置X和Y轴的值,调整位置。

  • 调整组件的角度(③):设置旋转角度的值。

  • 调整组件的大小(④):设置W和H的值,调整组件的宽度和高度。

  • 锁定组件(⑤):锁定组件后,无法调整组件的大小。

  • 调整透明度(⑥):设置组件的透明度。

image.png

行列设置

您可以在行列设置区域,进行如下设置:

  • 设置排行榜的行数、列数(①、②)。

  • 设置排行榜行、列间距值(③、④)以及行内的左、右边距(⑤,⑥)。

行列设置

序号

您可以在序号区域,设置序号的文本样式、图标大小、圆角半径、背景颜色以及Top 3的样式。序号设置

行标题

您可以在行标题区域,设置行标题的文本颜色、大小、粗体或斜体。设置行标题

指标

您可以在指标区域,进行如下操作:

  • 前缀后缀:设置主指标(①)和辅助指标(②)的前后缀显示名称(③、④)。

  • 最小宽度:设置指标与行标题之间的最小宽度(⑤)。

  • 文本:设置指标文本的颜色、大小、粗体或斜体。

指标

占比条

您可以在占比条区域,设置占比条的高度、占比条颜色和背景颜色。设置占比条

修饰图

您可以在修饰图区域,设置修饰图大小和圆角半径。修饰图

分割线

您可以在分割线区域,设置分隔线的高度、颜色和左右边距。设置分隔线

动画效果

您可以在动画效果区域,设置排行榜的动画效果。支持的操作如下:

  • 开启纵向滚动:设置排行榜纵向滚动的行数以及滚动的时间间隔(①、②)。

  • 开启行标题横向滚动:设置行标题横向滚动的速度以及滚动间距(③)。

  • 开启占比条流光效果:设置占比条流光效果的颜色以及时长(④)。

  • 开启分隔线流光效果:设置分隔线流光效果的颜色以及时长(⑤)。

动画配置项

条件格式

您可以在条件格式区域,设置排行榜度量的条件格式,说明如下:

  • 请选择系列:添加到指标/度量区域的度量项均可选择。

  • 快捷样式:从指定的样式中,设置标记图标和字体显示颜色。image.png

  • 自定义样式:自定义文本和图标样式,并设置条件选择、标记图标、范围值和字体显示颜色等。

    • 自定义文本:可支持自定义设置条件值前景色image.png

    • 自定义图标:支持自定义设置条件值、组合样式image.png

  • 同步样式到:同步当前的条件格式到其他度量指标中。image.png

  • 本页导读 (0)
文档反馈