您当前的位置: 首页 > 技术文章 > 前端开发

2 数据可视化大屏 - 布局

作者: 时间:2022-04-05阅读数:人阅读

目前大屏做了好多个,详细案例参考

YYDatav的数据可视化《精彩案例汇总》(Python&Echarts源码)_YYDataV的博客-CSDN博客

总结下行业上常用的几种大屏布局版式,主要分为两大类:

一.【主次分布】

主要用于突出显示大屏的主次信息,形成对比。比如有一个地图 chart,其他数据则用于辅助分析这个地图 chart。

布局一

2 数据可视化大屏 - 布局(图1)

 布局二

2 数据可视化大屏 - 布局(图2)

布局三

2 数据可视化大屏 - 布局(图3)

布局四

2 数据可视化大屏 - 布局(图4)

布局五

2 数据可视化大屏 - 布局(图5)

二. 【平均分布】

一般用于平铺展示,不存在主次关系,常用的有 9宫格(3*3)或 12宫格(3*4),通常用于二级页面。

1. 12宫格(3*4)适用于 16:9 宽屏

2 数据可视化大屏 - 布局(图6)

 2. 9宫格(3*3)适用于 4:3 屏幕

2 数据可视化大屏 - 布局(图7)

注:16:9 宽屏 和 4:3 的区别

16:9 是指显示器的宽高比,根据人体工程学的研究,发现人的两只眼睛的视野范围是一个长宽比例为16:9的长方形,所以电视、显示器行业根据这个的黄金比例尺寸设计产品。

16:9 比例分辨率有如下几种:

  • 1、3840×2160 (超高清 4K),它是2K投影机和 高清电视分辨率的4倍,属于超高清分辨率。
  • 2、2560X1440 (2K),数字电影联盟主导2K分辨率的标准。在数字电影制作中,2048×1556 为进入 2K 的门槛,分辨率的标准来自传统的超级35毫米电影。 
  • 3、1920×1080 (1080p全高清),是一种在逐行扫描下达到1920×1080的分辨率的显示格式。是数字电视和计算机技术的完美融合。
  • 4、1600×900,1600*900壁纸的适用范围比较小,只有15.6寸本本和20寸的液晶显示器。
  • 5、1366×768,被大多数液晶电视所采用,如一般32英寸的液晶电视分辨率通常为1366×768。

4:3 比例分辨率

常见的分辨率有640*480,800*600,1024*768,1200*900,1600*1200,1920*1440等,估计1600*1200是最大的,像1920*1440和其它更大分辨率只是显卡支持,并没有合适的屏幕与其配套。

注:参考资料

做大屏怎能离得开颜色设计?~ 具体请参考博文:

一文详细阐述UI设计颜色搭配,受益匪浅~_YYDataV的博客-CSDN博客_ui配色心理学家认为,人的第一感觉就是视觉,而对视觉影响最大的则是色彩。一图概括色彩意向:色系色彩意向红色系热情、张扬、高调、艳丽、侵略、暴力、血腥、警告,禁止橙色系明亮、华丽、健康、温暖、辉煌、欢乐、兴奋、热烈、温馨黄色系温暖、亲切、光明、疾病、懦弱、智慧、轻快绿色系希望、生机、成长、环保、.2 数据可视化大屏 - 布局(图8)https://blog.csdn.net/lildkdkdkjf/article/details/120389349

本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。

如果侵犯了你的权益请来信告知我们删除。邮箱:licqi@yunshuaiweb.com

加载中~
如果您对我们的成果表示认同并且觉得对你有所帮助可以给我们捐赠。您的帮助是对我们最大的支持和动力!
捐赠我们
扫码支持 扫码支持
扫码捐赠,你说多少就多少
2
5
10
20
50
自定义
您当前余额:元
支付宝
微信
余额

打开支付宝扫一扫,即可进行扫码捐赠哦

打开微信扫一扫,即可进行扫码捐赠哦

打开QQ钱包扫一扫,即可进行扫码捐赠哦