1. 概述

本文将依次介绍每个基础图表的配置方式。

2. 详细说明

柱形图

柱形图组件的入口如下。

柱形图的数据配置区如下图所示。

• 维度：设置柱形图x轴的维度字段，如下图所示为“地区”。
• 度量：设置柱形图y轴的度量字段，如下图所示为“销售额”。
• 系列(可选)：设置每根柱子进一步细分的字段，如下图所示为“类别”，即每根柱子进一步划分成三段不同颜色，分别表示不同的类别。

柱形图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 柱形：设置柱子为“堆叠”或“并列”，“直角”或“圆角”，柱子宽度以及颜色。
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。
• 动画效果：设置柱形图的轮播效果。

辅助信息设置：

• 坐标轴：设置柱形图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置柱形图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置柱形图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

条形图

条形图的入口如下。

柱形图的数据配置区同柱形图类似，如下图所示。

• 维度：设置条形图y轴的维度字段，如下图所示为“地区”
• 度量：设置条形图x轴的度量字段，如下图所示为“销售额”
• 系列(可选)：设置每根条形进一步细分的字段，如下图所示为“类别”，即每根条形进一步划分成三段不同颜色，分别表示不同的类别。

条形图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 条形：设置条形为“堆叠”或“并列”，“直角”或“圆角”，柱子宽度以及颜色。
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。
• 动画效果：设置条形图的轮播效果。

辅助信息设置：

• 坐标轴：设置条形图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置条形图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置条形图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

折线图

折线图的入口如下。

折线图的数据配置区如下图所示。

• x轴：设置x轴的维度字段，如下图中的“地区”字段。
• y轴：设置y轴的度量字段，如下图中的“销售额”字段。
• 系列(可选)：设置按照某个字段进一步细分为多条折线，如下图中的“类别”字段。

折线图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 折线：设置折线图的线型、颜色等信息
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。

辅助信息：

• 坐标轴：设置折线图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置折线图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置折线图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

双轴图

双轴图的入口如下。

双轴图的数据配置去如下图所示。

• x轴：设置x轴的维度字段，如下图中的“地区”字段。
• y左轴：设置双轴图中柱形对应的字段，如下图中的“销售额”字段。
• y右轴：设置双轴图中折线对应的字段，如下图中的“成本”字段。

双轴图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 图表样式/柱形：设置柱子、折线的样式。
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。

辅助信息：

• 坐标轴：设置双轴图x轴、y左轴、y右轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置双轴图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置双轴图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

饼图

饼图的入口如下。

饼图的数据配置项如下图所示。

• 字段：设置饼图的维度字段，如下图中的“地区”字段。
• 值：设置饼图的度量字段，如下图中的“销售额”字段。

饼图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 饼图：设置饼图的内半径、颜色等样式。
• 动画效果：设置饼图的自动轮播效果。

辅助信息：

• 数据标签：设置饼图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置饼图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

环图

环图的入口如下。

环图的数据配置项如下图所示。

• 字段：设置环图的维度字段，如下图中的“地区”字段。
• 值：设置环图的度量字段，如下图中的“销售额”字段。

环图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 环形：设置环图的内半径、颜色等样式。
• 动画效果：设置环图的自动轮播效果。

辅助信息：

• 数据标签：设置环图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置环图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

气泡图

气泡图的入口如下。

气泡图的数据配置项如下图所示。

• 维度：设置气泡图的划分维度，比如下图中的“省”字段，每个省划分为一个气泡。
• 度量：设置气泡大小的映射字段，比如下图中的“销售额”字段，销售额越大的省，气泡越大。
• 类别：设置气泡颜色的映射字段，比如下图中的“地区”字段，每个地区的省份气泡，用同一个颜色表示。

气泡图的样式设置，分为图形、卡片设置两个子Tab。

图形设置：

• 颜色设置：设置气泡的颜色。
• 标签：设置气泡上是否数据标签，以及标签的样式。
• 图例：设置气泡图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

面积图

面积图的入口如下。

面积图的数据配置项如下图所示。

• x轴：设置x轴的维度字段，如下图中的“地区”字段。
• y轴：设置y轴的度量字段，如下图中的“销售额”字段。
• 系列(可选)：设置按照某个字段进一步细分为多个面积区域，如下图中的“类别”字段。

面积图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 折线：设置面积图中折线的线型、颜色等信息
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。

辅助信息：

• 坐标轴：设置面积图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置面积图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置面积图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

栅格柱形图

栅格柱形图的入口如下。

栅格柱形图的数据配置区如下图所示。

• 维度：设置栅格柱形图x轴的维度字段，如下图所示为“地区”。
• 度量：设置栅格柱形图y轴的度量字段，如下图所示为“销售额”。
• 系列(可选)：设置每根柱子进一步细分的字段，如下图所示为“类别”，即每根柱子进一步划分成三段不同颜色，分别表示不同的类别。

栅格柱形图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 柱形：设置柱子为“堆叠”或“并列”，“直角”或“圆角”，栅格的间距，柱子宽度以及颜色。
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。
• 动画效果：设置栅格柱形图的轮播效果。

辅助信息设置：

• 坐标轴：设置栅格柱形图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置栅格柱形图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置栅格柱形图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

栅格条形图

栅格条形图的入口如下。

栅格条形图的数据配置区同条形图类似，如下图所示。

• 维度：设置条形图y轴的维度字段，如下图所示为“地区”
• 度量：设置条形图x轴的度量字段，如下图所示为“销售额”
• 系列(可选)：设置每根条形进一步细分的字段，如下图所示为“类别”，即每根条形进一步划分成三段不同颜色，分别表示不同的类别。

栅格条形图的样式设置，分为图形、辅助信息、卡片设置三个子Tab。

图形设置：

• 条形：设置栅格条形为“堆叠”或“并列”，“直角”或“圆角”，栅格的间距，条形宽度以及颜色。
• 绘图区：设置图表中间的绘图区，是否有网格线，以及绘图区的背景边框。
• 动画效果：设置栅格条形图的轮播效果。

辅助信息设置：

• 坐标轴：设置栅格条形图x轴、y轴的轴标签、轴线、轴标题等信息。
• 数据标签：设置栅格条形图上是否要展示数据标签，以及标签的文字样式。
• 图例：设置栅格条形图是否要展示图例，以及图例的展示位置、文字样式。

卡片设置：设置卡片的标题、边框、阴影、背景等样式。

轮播表格

自动轮播展示多行数据。添加入口如下图所示：