以实际的业务需求和美观性为出发点，线图衍生出多种不同形态的子图：标准折线图、标准面积图、堆积面积图，用来更好的表现和满足不同的数据对比分析需求。
| Title_font | |
|---|---|
|
| Wiki 标记 |
|---|
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} |
优势：容易反应出数据变化的趋势。
数据要求：一个或两个分类值，一个或多个指标值。
适用场景：
1）线图适合二维的大数据集，还适合多个二维数据集的比较。
2) 反映变化趋势，关联性。
3) 线图适合大数据集的趋势分析，尤其适合非离散型维度分析，比如时间，价格走势 。
| Title_font_1 | ||
|---|---|---|
|
类 型 | 普通线图 | 堆积线图 |
|---|---|---|
含 义 | 显示各类别的变化趋势 | 显示趋势的同时，可以显示明细数据的汇总情况。线从下往上实现叠加效果，最上面的一条线表示总和。 |
图 形 | ||
差 异 说 明 | 1.数据对比差异
2.实用性差异
3.图形构建差异
| |
| Title_font | ||
|---|---|---|
|
| Wiki 标记 |
|---|
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} |
我们在业务分析中，经常会对趋势进行对比分析。
下面我们以零售公司为例，年底对公司产品销售变化情况进行数据分析时，通常会有如下分析需求：
| 数据对比分析要求 | 分析 | 效果 |
|---|---|---|
| 场景1：查看公司当年销售额的变化情况。 | 该需求的趋势对比分析，是想要查看变化情况，即趋势。因此建议通过线图实现。 1、分类轴上显示月份。 2、指标轴上分布销售金额。 该情景实现的详情请参考 情景1 。 | |
| 场景2：查看公司当年各类产品销售额的对比情况。 | 该需求的趋势对比分析，是需要对比各类产品的销售额情况。因此建议以多线图效果实现对比。 1、分类轴上显示月份。 2、指标轴上分布销售金额。 该情景实现的详情请参考 情景2 。 | |
| 场景3：对于没有进行汇总的数据，想要查看公司当年各类产品的销售总额。 | 该需求的趋势对比分析，是想要看变化趋势也想要看数据的汇总情况。因此建议使用堆积线图实现。 1、分类轴上显示月份。 2、指标轴上分布销售金额。 该情景实现的详情请参考 情景3 。 |
| Title_font | ||
|---|---|---|
|
| Wiki 标记 |
|---|
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} |
| Title_font_1 | ||
|---|---|---|
|
业务场景描述：查看公司当年销售额的变化情况。
数据结构：
定制要点：
将“月份”字段作为“分类（X）轴”，“销售金额”字段作为“分类Y轴”。
预览效果：
Title_font_1 Name 情景2
| Wiki 标记 |
|---|
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} |
业务场景描述：查看公司当年各类产品销售额的对比情况。
情景2有两个实现方案，对应两种不同的存储数据方式。
方案1
数据结构：
定制要点：
预览效果：
方案2
数据结构：
定制要点：
预览效果：
| Title_font_1 | ||
|---|---|---|
|
业务场景描述：
情景3适合数据结构1且需要查看汇总数据的时候。
把情景2方案2的线图切换为堆积线图，如图：
数据结构：
定制要点：
预览效果：
| Title_font | ||
|---|---|---|
|
| Wiki 标记 |
|---|
{html}<div style="border-bottom: 0.5px solid #dfe1e5;color:#2D5C8C;padding-bottom: 0.5px;font-size: 24px; height: 5px;"> </div>{html} |
线图支持多种子图切换，按应用场景分可分为如下三类：
线图、曲线图、阶梯线应用场景一样，表示趋势，多线图中每个线图是独立的。这三者展现方式不同，线图线条的线是有棱角的，曲线图线条是平滑的，阶梯线线条呈阶梯状。
堆积线图、堆积曲线图、堆积阶梯线应用场景一样，可表示趋势，可实现堆积效果。多线图中从最下方到最上方的线图是逐个叠加的效果。这三者展现方式不同。
极坐标曲线图是一种特殊的线图。
|
|
线图的属性包括数据设置、基本设置、标题、坐标轴、图例、提示、工具、序列、高级、扩展属性等，具体请参考下面表格：
| 属性 | 标准折线图 | 标准面积图 | 堆积面积图 | ||
|---|---|---|---|---|---|
| 数据设置 | 字段 | √ | √ | √ | |
| 分类(X)轴 | √ | √ | √ | ||
| √ | √ | √ | |||
| 并列轴 | √ | √ | √ | ||
| 设置序列属性 | 自定义标线/区间 | √ | √ | √ | |
| 基本设置 | 通用 | 画布大小 | √ | √ | √ |
| 背景颜色 | √ | √ | √ | ||
| 显示方式 | √ | √ | √ | ||
| 边距 | √ | √ | √ | ||
| 初始化动画 | √ | √ | √ | ||
| 防止Y轴标签溢出 | √ | √ | √ | ||
| 防止X轴标签溢出 | √ | √ | √ | ||
| 标题 | 标题 | √ | √ | √ | |
| 标题样式 | √ | √ | √ | ||
| 水平位置 | √ | √ | √ | ||
| 坐标轴 | 分类轴/指标轴 | 坐标轴名称 | √ | √ | √ |
| 坐标轴名称样式 | √ | √ | √ | ||
| 坐标轴名称位置 | √ | √ | √ | ||
| 名称到轴线的距离 | √ | √ | √ | ||
| 标注步长 | √ | √ | √ | ||
| 刻度标签显示方式 | √ | √ | √ | ||
| 刻度标签样式 | √ | √ | √ | ||
| 分隔线 | √ | √ | √ | ||
| 分隔区域 | √ | √ | √ | ||
| 坐标轴线 | √ | √ | √ | ||
| 图例 | 位置 | √ | √ | √ | |
| 文字样式 | √ | √ | √ | ||
| 提示 | 是否显示 | √ | √ | √ | |
| √ | √ | √ | |||
| 边框宽度 | √ | √ | √ | ||
| 提示文本样式 | √ | √ | √ | ||
| 添加其他列 | √ | √ | √ | ||
| 工具 | 功能按钮设置 | 数据视图 | √ | √ | √ |
| 数据区域缩放 | √ | √ | √ | ||
| 配置项还原 | √ | √ | √ | ||
| 保存图片 | √ | √ | √ | ||
| 序列 | 平滑曲线 | √ | √ | √ | |
| 连接空数据 | √ | √ | √ | ||
| 普通状态设置 | 系列主色 | √ | √ | √ | |
| 数据项标签 | √ | √ | √ | ||
| √ | √ | √ | |||
| 文本样式 | √ | √ | √ | ||
| 系列主色 | √ | √ | √ | ||
| 数据项标签 | √ | √ | √ | ||
| 位置 | √ | √ | √ | ||
| 文本样式 | √ | √ | √ | ||
| 数据点设置 | 数据点形状 | √ | √ | √ | |
| 数据点大小 | √ | √ | √ | ||
| 数据点旋转角度 | √ | √ | √ | ||
| 数据标注设置 | √ | √ | √ | ||
| 数据标线设置 | 标线类型 | √ | √ | √ | |
| 标记颜色 | √ | √ | √ | ||
| 高级 | 图形标识 | √ | √ | √ | |
| 图形输出行数 | √ | √ | √ | ||
| √ | √ | √ | |||
| 排序 | 排序顺序 | √ | √ | √ | |
| 排序指标 | √ | √ | √ | ||
| 数据传值设置 | √ | √ | √ | ||
| 扩展属性 | √ | √ | √ | ||
