图表组件选用指南:五分钟,组件选型不迷路
本文将介绍EasyV图表组件间的形态差异以及功能划分,以辅助不同需求场景下的图表组件选型。
一个合理正确图表可以呈现数据的整体形态(如形态、趋势、对比等),让数据更加直观、突出重点。安德鲁·阿伯拉(Andrew Abela)制作的一份图表类型选择指南 ⬇️
场景分类
考虑到日常的数据分析场景以及图表设计经验,参考了上图的部分内容对其重新总结,整合成以下一些维度。
图表类型选择指南 EasyV ver.
EasyV还包含其他混合形态的图表组件,供复合场景使用。
场景分类下各组件功能差异
对比 - 柱形图
*圆形雷达图、三维分类对比图、漏斗图、等值对比图组件形态差异大,且服务于更垂直细分的场景,在此不做功能对比
图表构成
功能差异
基本柱状图 | 堆叠柱状图 | 基本条形图 | 水平堆叠条形图 | |
柱形 |
| |||
坐标轴 | 支持双纵轴(X轴、Y轴/Z轴) | |||
图例 | - | |||
信息提示框 | ||||
数值标签 | 位置:终点外 | 位置:起点/居中/终点/终点外/图表外 | ||
参考线 | - |
基本立体柱状图 | 堆叠立体柱状图 | 斑马纹理柱状图 | 双向水平条形图 | |
柱形 |
|
|
| |
坐标轴 | 支持双纵轴(X轴、Y轴/Z轴) | 仅单纵轴(X轴、Y轴) | ||
图例 | - | |||
信息提示框 | - | 无信息提示框 ❌ | ||
数值标签 | 位置:终点外 | 位置:起点/居中/终点/终点外/图表外 | ||
参考线 | - | 无参考线 ❌ |
象形图 | 基本三角图 | 3D柱图 | 胶囊预测图 | |
柱形 |
|
| ||
坐标轴 | 仅单纵轴(X轴、Y轴) | 支持双纵轴(X轴、Y轴/Z轴) | 无纵轴 | 仅单纵轴(X轴、Y轴) |
图例 | - | |||
信息提示框 | 无信息提示框 ❌ | |||
数值标签 | 位置:终点外 | 位置:起点/居中/终点/终点外/图表外 | ||
参考线 | - | 无参考线 ❌ | - |
趋势 - 折线图
*K线图、桑葚图组件形态差异大,且服务于更垂直细分的场景,在此不做功能对比
图表构成
功能差异
基本折线图 | 基本面积图 | 控制折线图 | 表格折线图 | |
折线 |
|
|
|
|
坐标轴 | 支持双纵轴(X轴、Y轴/Z轴) | 无纵轴 | ||
图例 | - | 无图例 ❌ | ||
信息提示框 | - | 无信息提示框 ❌ | ||
数值标签 | - | |||
参考线 | - | 无参考线 ❌ |
动态折线图 | 3D面积图 | 环状点联结图 | 预测面积图 | |
折线 |
|
| ||
坐标轴 | 单纵轴(X轴、Y轴) | 支持双纵轴(X轴、Y轴/Z轴) | 单纵轴(X轴、Y轴) | 支持双纵轴(X轴、Y轴/Z轴) |
图例 | - | 无图例 ❌ | ||
信息提示框 | 无信息提示框 ❌ | |||
数值标签 | 无数值标签 ❌ | 无数值标签 ❌ | ||
参考线 | 无参考线 ❌ |
排行 - 排行柱图
*摩天轮、动态条形图形态差异大在此不做功能对比
图表构成
功能差异
排行条形图 | 占比排行条形图 | 轮播排行条形图 | ||
序号 |
|
| ||
文本 | 类目 | 指定字段且字段数量唯一 | 不指定字段且支持添加多个字段 | |
数值 | 指定字段且字段数量唯一 | |||
柱状 | 表现数值 | 表现占比 | 表现数值 |
组成 - 饼图/环图
*矩形树图组件形态差异大,且服务于更垂直细分的场景,在此不做功能对比
图表构成
功能差异
基本饼图(静态型) | 基本环图(静态型) | 多色玫瑰图(静态型) | 甜甜圈图(静态型) | |
环图/饼图 |
|
|
|
|
数值标签 | ✅ | |||
当前值 | 🚫 | |||
图例 | - |
3D饼图(轮播型) | 轮播环图(轮播型) | 旋转轮播饼图(轮播型) | |
环图/饼图 |
|
|
|
数值标签 | 🚫 | ||
当前值 | ✅ | ||
图例 | - |
玫瑰图(静态型)-本质为柱图 | 层叠玫瑰图(轮播型)-本质为柱图 | |
环图/饼图 |
|
|
数值标签 | - | |
坐标轴 | - | |
图例 | 🚫 | ✅ |
双层饼图(静态型) | 双层轮播饼图(轮播型) | |
环图/饼图 |
|
|
数值标签 | ✅(子项数值标签) | ✅(子项类目标签) |
当前值 | 🚫 | ✅ |
图例 | 🚫 | ✅ |
如遇其他使用问题,可扫描下方二维码,获取更多产品支持~