雷达图设计分析

用户头像
广州/设计爱好者/5年前/4235浏览
雷达图设计分析

一起分析探讨数据可视化中,雷达图的设计要点


信息图表设计是指将信息、数据、知识等进行视觉化的表达,信息图表通常可以将复杂的信息简单化、清晰化,能够更优的传输信息,此外人类的大脑对于图像的记忆优于对文字的记忆,因此信息图表可以更清晰直观地把想要传达的信息更加高效的传达出去。设计师在做设计时,应该基于图表的功能去设计,再考虑图表美观度,要把握好设计与功能之间的平衡,避免设计出华而不实的图表。

 

在做分析前,我在设计网站和图表开源网站上搜集了一些常见的雷达图如下,本篇文章基于现有的常见的雷达图设计样式来分析雷达图应该如何设计,部分图片来自网络,纯学习,欢迎大家一起探讨。

 


一、什么是雷达图?


1.1 定义

雷达图是以从同一点开始的轴上表示的三个或更多个定量变量的二维图表的形式显示多变量数据的图形方法。专门用来进行多指标体系比较分析的专业图表。从雷达图中可以看出指标的实际值与参照值的偏离程度,常用于倾向分析和重点把握。 雷达图也称为网络图,星图,蜘蛛网图,极坐标图或Kiviat图。

 

1.2 应用领域

从文献检索来看,目前使用雷达图较多的领域是企业经济、气象学、计算机应用等。

1.特定行业:主要是企业经营状况——收益性、生产性、流动性、安全性和成长性的评价。

2.扩展延伸:展现对一个或多个客观主体的多个维度进行数值分析结果,目前在日常生活中有广泛延伸应用,如职业岗位的能力素质模型、各班各科成绩雷达图对比、企业运作效率指标对比等。


1.3 雷达图的基本结构与绘制

雷达图通常由 n 个同心圆组成,这 n 个不同半径的同心圆代表不同的水平。从圆心出发,引出的 m 条射线将圆平均分割,每条射线就代表一个评价指标,即 m 个评价维度; 以各射线指向圆心的方向为各自的正方向,将评价主体的标准化值标在图中相应的射线上,然后将各节点按顺序连接起来,形成不规则的闭环多边形,就绘制出了所需要的雷达图。

 


二、雷达图有什么设计要点?


2.1 组成元素

如图,包括标题、坐标轴、网格线、变量名称、数据标签、图例、数据等。


2.2 雷达图文字数值设计属性分析

  • 标题:图表必备,方便快速知道雷达图表达的数据内容,一般位于雷达图左上方、正上方或正下方。

  • 变量:变量名称绕雷达图一周排列,对应坐标轴与外圈的交点,常见全部数据都正向排列,少部分情况下文字底部朝向中心点,但影响文字辨识,不建议使用。

  • 坐标轴:坐标轴上的数值格式应统一,例如都保留小数点后两位,注意是否保留单位。坐标轴数值常标于中心点正上方坐标轴上,常被省略。

  • 数据标签:当只有一组数据时,可标注于数值在坐标轴上的位置,或直接标注在数值标签旁,当有多组数据,数据量较多时,为避免图表杂乱,可省略,通过触碰后显示。

  • 图例:当只有一组数据时,图例可省略。当有大量图例时,图例可采用翻页形式,当图例是时间轴,要表达一个时间发展趋势时,可使用连续的渐变色来提高美观度。


2.3 雷达图图形设计属性分析

将雷达图拆分成上层数据情况及下层网格线和坐标轴来分析。

通过观察雷达图,可概括出雷达图常见设计元素的展现形式如下:


2.3.1 上下层形状分析

  • 上层:

直线边组成:通常适用于坐标外形为规则的多边形,常用。

曲线组成:适用于坐标外形为圆形,少用,当变量为连续数值时,例如时间,角度等,上层数据才可用曲线。

  • 下层:

规则的多边形:适用于变量较少的情况(一般6个以下),常用。

圆形:可适用于变量中等或较多的情况(一般6个以上),或者变量为连续数值时用圆形,少用。

注意:下层坐标用多边形无法表示连续的数值,故上层数据不能用曲线。


2.3.2 基于上层数据情况的属性分析

  • 透明情况:以下三种情况也可以组合出现在同一个坐标轴里。

全透明(线性):相比较面性,数据突出效果较弱,但适用范围最广,当数据较多时比面性更加清晰。

半透明:数据组数数量较少时不受影响,当数据组数数量较多时不适用。

不透明(面性):只有一组数据时,数据占比面积大,数据展示最清晰,当有两组或以上数据时,图形会被遮挡,数据展示不清晰。


特别地,当一组数据只有一个值时,此时雷达图的作用相当一个变形的柱状图,用于比较变量之间单个数值的大小,数值之间可不通过线段连接起来。


  • 颜色:填充颜色要与描边颜色同一色系,通常是描边为不透明,填充为半透明或者浅一点的颜色,要注意透明度的大小及叠加后颜色配色是否美观。

单色:一般适用于一组数据的情况,当比较多个分类的多组数据时,单个分类的多组数据可用单色,例子如下图。

多色:适用于多组数据的情况,每组数据一个颜色。

渐变:适用于数据区域是面性的情况,使用得当可提高空间感,较少用,但应注意渐变色不要影响到数据判断。


  • 背景色:无论背景是什么色,重点是要使数据在图表中清晰可见,提高辨识度。

深色背景:使用明度高的颜色。

浅色背景:使用明度低的颜色。

 

  • 其余装饰:

加圆点:加在坐标轴上有利于聚焦数据在坐标轴上的位置,可适当提高数据辨识度。

外发光:较少见,在深色背景下可适当提高亮度及科技感,应注意发光范围不影响数据。

投影:较少见,当颜色与底色搭配难以区别时,适当加小投影可提高清晰度。

平面:常用的多为平面的。

立体:可使用投影,渐变,浮雕增加立体感,少用。

 

2.3.3 基于下层网格线和坐标轴的属性分析

  • 线/面:线+面组合,当面与背景颜色相同时则可视为只有线组成,常见于背景为深色底的情况;当面与背景颜色不同时,每一圈间隔的面可以相同或不同颜色,不同颜色可提高数据区分度,多色有双色间隔或按照深浅度层层递进,可增加空间感,常见于背景为浅色底的情况;未见过坐标使用渐变色的情况。


  • 其余装饰:

深色底:坐标线常用白色或浅灰色,面常用与背景色相同或接近的颜色。

浅色底:坐标线常用灰色,面可用白色或彩色,通常颜色交浅,有利于衬托上面的数据。

外发光:少见,在深色背景下可适当提高亮度及科技感,应注意发光范围不影响数据。

投影:常见,加在每一层面上可适当增加立体感。

平面:常用的多为平面的。

立体:可使用投影及渐变增加立体感,少用。

 


三、雷达图的设计变形:3D图表


不同于常规传统雷达图,3D图表通过增加一个维度来表示数据,有以下两种数据展现形式:

  • 原本2d雷达图的径向坐标轴变成了三个维度的坐标轴,网格线也变成三维,缺点是以下方式只适合3个数据相比较的情况,一个数据对应一个维度,优点是形式新颖。


  • 原本2D雷达图从中心开始的径向坐标轴变成纵向的坐标轴,纵向的高度代表数据,优点是效果酷炫新颖,缺点是各数据的比较不够明显清晰。



四、不合理的设计


在收集的雷达图中,也存在一些不合理的设计,主要问题可归纳为:信息不完整,数据展现不清晰或不全面,不美观。



五、设计Tips


通过结合各种元素———图像、标识、符号、颜色、形状等,来使信息更具层次性、空间性,来处理晦涩、乏味、复杂的数据,使人们更易理解信息,并提高信息的传播效率。我们应该尽力使信息更有趣、更丰富,信息图表比传统数据图更有趣,更能吸引读者观看其内容。

第一,理解数据要传递什么信息,明确数据目标,在复杂的信息中分离出来信息的主干,理清信息的逻辑,来制作图表。

第二,将信息图表做的清爽,赋予信息图表以美感和特殊的风格,增加画面的趣味性,来满足受众们心理的审美需求,增强信息图表的可解读性和艺术感。一个好的信息图表,讲究逻辑清晰,画面清爽,文本编排工整,色彩搭配和谐,设计感强。

第三,媒介的多样化。信息的传播媒介多种多样,除了平面的做法,还可以通过视频的后期制作,动画制作,音频动画的添加等来丰富图表。

 


 

参考文献:

[1]姚丰,杨晔.信息可视化在视觉传达中的应用 ——信息图表设计[J].西部皮革,2021,(8):102-103.

[2]吴颖慧,叶小巾.数据可视化背景下雷达图在医院管理中的应用[J].广西医学,2016,(7):1050-1053


28
举报
|
55
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
空的平台平面和自然景观
古风平面仕女与瓷器
“知识宅急送”外卖,快递,平面,海报,素材,教育
牛奶乳液层次梯田平铺平面
平面插画设计女孩喝咖啡
课程海报,平面素材
海底世界插画
平面书法字手写
中秋节可爱呆萌平面兔子蛋黄月饼贴纸素材
学习,优惠券,平面,海报
倒计时,海报,平面
金色颗粒质地的平面
牛奶乳液层次平面平铺平面
平面设计 吊牌设计
金色颗粒质地的平面
金色颗粒质地的平面
金色颗粒质地的平面
平面花卉图案扁平简约无缝拼接插画
平面风格黄绿色系花朵装饰
平面男孩喝咖啡插画设计
玄关入门地毯印花图案红地毯
城市园林平面布局航拍
水蜜桃和李子的平面水果图案
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
金色颗粒质地的平面
你可能喜欢
相关收藏夹
大家都在看
登录注册