大屏数据可视化前端 从0-1制作数据可视化大屏

都说「数不如图」,在数据报告中,就常常借助图形化的手段将数据清晰表达出来,可以更简单有效地传达和沟通。

这两年,数据可视化大屏在数据报告中的占比越来越大,企业和政府会更倾向于选择炫酷大屏进行数据分析展示。炫酷大屏不仅能实时监控重点数据,提高决策效率,放在公司会议室,展台等地方,还能提升公司形象。

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

作为一个从事可视化大屏项目3年多的秃头技术,做过大大小小几十个大屏项目,给大家科普一下实际工作中,一个可视化大屏项目的上线流程。

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

可视化大屏项目实施流程

一般整个大屏开发流程可划分为六个部分,分别是:

  • 需求调研
  • 原型设计
  • 效果图设计
  • 效果落地
  • 数据接入
  • 大屏调试

需求调研

需求调研是整个大屏制作过程中最耗费时间,最重要的一步。只有搞清楚业务需求,做出来的大屏才有应用的价值,这个过程需要和业务方沟通确认,耗时很长,不少大屏项目前期需求没沟通清楚就动手开发,后面改到哭爹喊娘。

除了业务需求调研之外,如果要在硬件上展示的大屏,还需要对大屏硬件进行需求调研,比如大屏分辨率,大屏显卡所支持的分辨率输出,显卡是否支持自定义分辨率,HDMI 线支持的分辨率。了解物理大屏分辨率,确定设计稿尺寸。

原型设计

确认展示需求之后,我们要梳理大屏展示的关键指标,一般情况下,一个指标在大屏上独占一块区域,所以通过关键指标定义,我们就知道大屏上大概会显示哪些内容以及大屏会被分为几块。确定关键指标后,根据业务需求拟定展示指标的布局。

提供几个常用的大屏布局样式:

(1)左右分布

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

(2)中心环绕

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

(3)上下布局

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

拟定展示指标的布局后,需要和业务方进行确认。业务方同意后,再设计图表的样式,交互功能,如钻取、联动、轮播等,根据排版好的内容落地成原型图。

效果图设计

原型图确认后,需要美工需要结合屏幕尺寸、分辨率、大屏的风格来设计效果图。对于大屏而言,效果图主要对大屏的指标、数据、预期效果进行整理输出。

效果落地

根据效果图在前端制作大屏,一般有两种方式,一是用代码开发,还有一种是用现成的可视化工具制作。

用的比较多的就是JS+Echarts,但数据量支撑、后台响应、实时更新、平台运维等应该还要调用更多的技术,非常考验技术水平,所以我推荐直接用可视化工具制作,比如亿信ABI、dataV等等,简单又方便,重点是不需要写一大堆代码,自带的图表插件可视化效果很炫酷,拖拖拽拽即可生成数据可视化大屏。

在制作大屏时,可以选择各平台提供的行业模板,在模板的基础上进行修改设计,节省制作大屏的人力、周期。给大家分享下亿信ABI提供的行业酷屏模板。

卫生行业

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

制造行业

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号
大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

司法行业

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号
大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

酷屏模板到手后,该如何“为我所用”呢?下面这个动图讲得清清楚楚明明白白,您可根据如下操作步骤来试用或购买体验哦

大屏数据可视化前端 从0-1制作数据可视化大屏-熊猫号

数据接入

数据接入大致分为三步,底层数据接入,前端数据展现,数据校对,同时需要考虑数据量和实时性需求。

大屏调试

理论上显卡分辨率和PC端调试分辨率一致的情况下且字体自适应,不需要过多调试,在条件允许的情况下,建议在效果图落地甚至原型图设计阶段就进行大屏预调试。

这样一套流程下来,一个大屏项目周期在10-20人天不等,如果需求复杂,很有可能一个项目耗费1-2个月,这之后还有相当大的维护工作要做,所以单纯从技术角度去做一张大屏很容易,但是要完成一个实用的大屏项目并不简单。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2476560997@qq.com 举报,一经查实,本站将立刻删除。

(3)
打赏 微信扫一扫 微信扫一扫
上一篇 2022年3月12日 7:15 上午
下一篇 2022年3月12日 7:18 上午

相关推荐

  • bitlocker强制破解 三种思路巧妙破解Bitlocker加密

    课前提要 BitLocker加密是Windows的一种数据保护功能,主要用于解决由于计算机设备的物理丢失导致的数据失窃或恶意泄漏,能够同时支持FAT和NTFS两种格式,可以加密电脑的整个系统分区,也可以加密可移动的便携存储设备,如U盘和移动硬盘等。 BitLocker使用AES(高级加密标准/Advanced Encryption Standard)128位…

    2022年3月12日
    1.1K
  • 排列顺序方法 常见的六种排序方法汇总

    冒泡排序 冒泡排序(英语:Bubble Sort)是⼀种简单的排序算法。它重复地遍历要排序的数列,⼀次⽐较两个元素,如果他们的顺序错误就把他们交换过来。遍历数列的⼯作是重复地进⾏直到没有再需要交换,也就是说该数列已经排序完成。这个算法的名字由来是因为越⼩的元素会经由交换慢慢“浮”到数列的顶端。 冒泡排序算法的运作如下: ⽐较相邻的元素。如果第⼀个⽐第⼆个⼤(…

    2022年3月12日
    225
  • 拨号vps如何实现 利用adsl拨号服务器VPS构建代理IP池

    一、工具准备 动态vps: 我用的是云立方的动态vps,0.5G内存,11G硬盘,20G宽带,一年1800元,动态vps主要是运行代理服务,比较耗宽带,通过拨号来更换IP,实现动态代理的效果 固定IP服务器:用的阿里云服务器,1核1G内存,40G云盘,一年836元,该服务器主要是实时获取动态vps的IP,并对外提供接口,这些服务不怎么耗资源,该服务器还可以用…

    2022年2月28日
    71
  • 服务器cdn防御 什么是CDN劫持如何进行防御

    CDN能加速大家都知道,但其中原理不少人都不清楚。其实,CDN本身就是一种DNS劫持,只不过是良性的。 不同于黑客强制DNS把域名解析到自己的钓鱼IP上,CDN则是让DNS主动配合,把域名解析到临近的服务器上。 这台服务器同样也开启了HTTP代理,让用户感觉不到CDN的存在。 不过CDN劫持不像黑客那样贪心,劫持用户所有流量,它只『劫持』用户的静态资源访问,…

    2022年2月28日
    56
  • 云主机平台搭建 如何搭建一个专属云平台

    物联网的出现,实现了人与物、物与物的沟通交流,打造了一个万物互联的智能世界。 在四层物联网模型中,主要分为感知层、网络层、平台层、应用层四大层级。 其中,云平台是网络架构和产业链条中的关键枢纽,它就像物联网体系里的大脑,承载并运算着万物互联后产生的庞大数据,发挥出巨大价值。 云平台搭建,是完成智能应用的必要环节之一。 云平台搭建之前,需要做哪些准备工作? 不…

    2022年3月12日
    85
  • 云服务呼叫中心设置 设置云呼叫中心系统的操作流程

    呼叫中心系统越来越多的成为企业必备的系统,拥有一套呼叫中心能有效助力企业高效服务、管理客户!呼叫中心系统本身功能很多初次使用可能会不知所措,畅远小编整理了一些设置呼叫中心的操作流程,希望能对企业客服有所帮助! 设置云呼叫中心系统的操作流程如下: 1. 坐席设置 当我们拿到自己申请的畅远技术云呼叫中心账号时,我们可以进行免费试用,将已经开通的云呼叫中心账号,绑…

    2022年2月28日
    48
  • 软件测试学习多少钱 学软件测试费用分析

    软件行业现在发展的如火如荼,相对于开发来说又太难,培训时间久,而从学习软件测试来看,入门上手要快一些,对于零基础转行的人来说,费用也要低一些,但是对于没有软件测试经验的人来说,毕竟是门技术岗位,学到手,终生受益。所以想要进入计算机行业,选择最大的捷径就是参加软件测试培训,现在的公司也不可能说是免费无偿的培养你,毕竟技术学到手是你自己的,而且面对各种公司花费的…

    2022年3月12日
    63

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

返回顶部