请选择 进入手机版 | 继续访问电脑版
2021ThingJS数字孪生智慧场景可视化开发大赛获奖者专访
查看: 112|回复: 1

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

[复制链接]
avatar

6

主题

6

帖子

50

积分

注册会员

Rank: 2

积分
50
ico_lz  楼主| 发表于 2021-4-9 14:05:58 | 显示全部楼层 |阅读模式
前文传送门

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

表格设想


表格是数据可视化中最入门的数据图,也最为适用,在网页背景几近是必不成少的元素,数据可视化大屏中也经常出现。表格的设想似乎一切人城市,但为什么总有一些表格看起来很舒服,下面就用一个案例来说解下表格的设想要点。

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

上图的表格款式经常在网页背景,PPT中看到,似乎也看不出什么题目,俗语说了,没有对照就没有危险,接下来我们就找找它的题目,并一步步优化它,最初对照就晓得它有什么题目了!

表格排版第一原则“笔墨左对齐,数字右对齐”

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

我们阅读笔墨的习惯是从左到右,笔墨左对齐,视觉焦点更集合不腾跃,阅读起来最为顺畅舒服。

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

全国武功, 唯快不破,数字右对齐,能快速让观者识别数字体量。人凡是在读一个较大的数字时是从前面起头感知的,例如这个数字"¥546,825,23.96"从左往右看一会儿很丢脸出来“5”在万万上,都是先通事前面的位数来肯定,大概先找到万的位置来判定,数字的个位对齐,在列表中也更轻易判定百、千、万等小数位数,数字右对齐是最自然的阅读方式!

题目与内容一样的对齐方式

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

题目随内容对齐,内容右对齐相对的题目也就右对齐,最好不要出现内容与题目相反的对齐方式!

数字能否用表格字体
【转贴】数据可视化图表和表格的设想经历分享(二)!...

表格数字字体就是每个数字所占面积分歧,例如“1”和“5”在一串数字中占的面积是一样的,这样就不会出现上图的情况。

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

一样都是万级的数字,"12,231.10"数字中出现的“1”较多就会致使高低一样位数的数字错位,这样很轻易误导观者,第一感知上也会感觉“1”多的数字偏小!

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

上图应用了表格数字字体的结果,清楚了然!(移动端Web端都要留意这个题目)

去掉表格竖实线或一切实线

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

加上竖线的表格给人一种范围感,不透气,留白空间少显得混乱,去掉竖线更有空间感!

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

只留朋分线夸大层级,合适布景是卡片式的设想款式,卡片设想无形中给表单加了一个外框,使得整体页面更和谐!


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

实线固有它的感化,但偶然辰也可以去掉一切实线,这样更凸出数据,加大条目标间距使得页面加倍清洁清新,有空间感!

夸大题目

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

第一种加粗题目字体,使得表格看起来更有条理!

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

第二种表格形式可以加粗题目字体,也可以增加布风景夸大题目区分层级!

凸出重要信息

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

网页背景表格常常一个条目中,利用者只关注一个或几个数据,所以可以用布风景增强凸出!


表格扩大设想

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

这类创新形式可以在展现型数据可视化中应用,数据可视化设想中不用太拘束,只要不违反数据的清楚公道展现便可以,网页背景页面倡议还是标准设想,适用为主!


之前

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

以后

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

图表分类图


分享一张图表分类大全,保存起来,设想数据可视化产物,会有重要参考代价!

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

这张图由设想师Abela对图表的各类特征停止了大致的概括总结。

回复

使用道具 举报

avatar

34

主题

55

帖子

381

积分

中级会员

Rank: 3Rank: 3

积分
381
在线会员 发表于 2021-4-9 14:58:44 | 显示全部楼层
那如果实在颜色比较多的项目中,图表需要添加表格线的吧
回复

使用道具 举报

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

本版积分规则