请选择 进入手机版 | 继续访问电脑版
img_top
查看: 66|回复: 1

[分享] 【转贴】数据可视化图表和表格的设想经历分享(一)!...

[复制链接]
avatar

6

主题

6

帖子

50

积分

注册会员

Rank: 2

积分
50
ico_lz  楼主| 发表于 2021-4-9 13:53:16 | 显示全部楼层 |阅读模式
图表设想

1. 图表设想概念

图表设想是数据可视化的一个分支范畴,是对数据停止二次加工,用统计图表的方式停止显现,也是数据可视化的焦点表示,图表设想既要保证图表自己数据清楚正确、直观易懂,又要在找准用户关注的焦点内容停止适当的突显,帮助用户经过数据停止决议。

下面分析三种常用的数据可视化图表折线图、柱状图、饼图的设想。

1.1折线图

折线图常用于暗示数据的变化和趋向,坐标轴的分歧对折线的变化幅度有很大的影响。

下图的两个折线图是有题目表示形式:
【转贴】数据可视化图表和表格的设想经历分享(一)!...

左图坐标轴设定的太低,折线变化过于峻峭,图中数值区间为(10-34)数据可视化的表示过于夸大了折线变化的趋向。

右图坐标轴的数值设定的太高,则折线变化过于陡峭,没法清楚的表示折线的变化。

下图点窜后折线图,折线幅度占3/2的位置,数据表示清楚公道。

【转贴】数据可视化图表和表格的设想经历分享(一)!...

公道的折线图表的X轴数值范围应按照折线的数值增减变化而变化,这需要跟前端工程师说明,做成静态计较。

下图又是两个有题目标折线图:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

折线图的折线粗细要公道,细致的折线会下降数据表示,过粗的折线会损失折线中的数据波动细节,视觉上较难精准找到折线点的响应数值!我凡是用两个像素的线,看起来比力合适!

刻度线与折线的设想:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

右图刻度线色彩太重,影响图表数据的表示,零基线跟图表内的刻度线对照不够明显,整体很乱。零基线是夸大肇端位置的,一般要比图表内的线色彩凸出一些。
条形图/柱状图

1.2柱状图

理想很饱满,现实很骨感,偶然辰我们设想的图表数据进来后,跟设想完全纷歧样,看下图的设想稿跟数据进来后的样子:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

处理的计划就是让工程师把X轴刻度不要写死,应当把这些图表的取值范围写成静态计较的。

静态计较就是,例如数据的最高值为18,X轴最高数值应当为25,当数据又上升一定的高度后,X轴再上升到响应的数值高度,这样避免了如右图的题目。

【转贴】数据可视化图表和表格的设想经历分享(一)!...

坐标轴的标签笔墨最好能水平排列,当X轴标签笔墨过量时,不倡议倾斜排列、高低排列、换行排列笔墨多了这样的展现大大下降了阅读性!下图给出两个处理计划,大猛进步标签笔墨的阅读性!

处理计划就是换一种形式,以下图:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

处理计划

柱状图间接的位置设想:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

柱子之间过于分离就会落空数据之间的关联性,过密就会变得数据之间没有自力性更晦气于舒适阅读。

当柱子为n时,柱子间接的间隔倡议与n相差不要太大,柱子靠边的间隔,最好是柱子之间的一半的间隔,这样视觉上最为舒适。

1.3饼图

饼图的设想:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

左1图,不倡议在饼图内与百分比数值一路显现,饼图自己的外形和巨细,笔墨过量时轻易溢出,假如出现一个2%一个1%,就很难分辨图形指向,这样也就落空了数据可视化的意义,PPT凡是有这样的设想款式,由因而个死图。

左3图,人的阅读习惯是从左到右,从上到下,所以数据从大到小排列,更有助于阅读,图形也更具美感!

表达重要数据,以下图:

【转贴】数据可视化图表和表格的设想经历分享(一)!...

当饼图为检出率,大概一些重要信息检测的重点关注数据,就不倡议巨细数据顺时针排列,左1图这类情况一般很少出现,由于关注的是检出数值,展现未检出数据实为鸡肋,能够是少少情况的需要吧!

右图对于类似检出率的数据最为合适,直观清楚,没有无用数据干扰!

【转贴】数据可视化图表和表格的设想经历分享(一)!...

当饼图的标签维度过量时,就不合适把数据围绕饼图一周展现,会很乱,不易阅读,处理计划如右图!



回复

使用道具 举报

avatar

8

主题

25

帖子

124

积分

注册会员

Rank: 2

积分
124
在线会员 发表于 2021-4-13 18:14:38 | 显示全部楼层
学习了,感谢楼主
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则