2022-6-13 博博
随着大数据产业的蓬勃发展，很多企业都开始应用数据可视化。智慧城市、智慧交通、智慧医疗等等越来越多的行业都有了可视化的需求，可视化行业也迎来了迅速发展的成长期。
数据可视化就是把一些相对复杂、抽象的、我们看不懂的数据通过“可视化”的方式，运用图形化的手段清晰有效地将数据信息进行解读和传达，帮助我们发现其中的规律和特征，挖掘数据背后的价值。
可视化大屏是以大屏为主要展示载体的数据 可视化设计。它的应用场景非广泛如 ToC、ToB、ToG 等都会存在。一般应用在会议展厅、园区管理、城市交通调度中心、公安指挥中心、企业生产监控等重要场所。
可视化用户群体相对比较明确，主要是单位领导及一些一线人员。通过交互式实时数据监测，洞悉运营增长，助力智能高效决策。
伴随行业的发展，行业内也对可视化进行了一些行业细分。常见的一些类别：行业可视化（如交通、医疗、金融、军警部队、农业、工厂、化工等）、智能终端系统类（定制化终端产品）、演示 demo（数据演示、展览展示、数据看板 ）、可视化分析系统（通过对数据的分析监控辅助决策，如交通预警平台、天气监控平台等）。
平台化
由于近几年可视化的需求越来越大，一般的公司都会有一些可视化的需求，各大厂商也逐渐整合可视化资源，实现平台化、低代码化。满足了大多数公司的可视化需求。国内比较知名的可视化厂商：光启元（Ray design）、Data V、优诺科技（森工厂）、袋鼠云（Easy V)、数字冰雹、图扑、等等。他们将一些可视化效果组件化集成在平台，拖拖拽拽就能实现一些不错的效果，满足了一些公司的展示需求。
实现方式
目前可视化框架是大多数都是基于 Web 端的（基于 web 开发或者 web 封装）而非 PC 端。常见的可视化实现方式是二维加三维相结合，比如大屏两侧的可视化图表可以用 Echarts 这种第三方的轻量化图表控件或者 Vue 去实现。
主视觉部分会基于 Unity3D、虚幻引擎（UE4）、Ventuz、threejs 等工具去实现。满足三维炫酷的效果需求。使整个可视化大屏效果有了质的提升。这些三维工具的优势是三维粒子效果能很好的支持，且效果非常炫酷。多平台支持，可通过 webgl 封装在浏览器里打开使用。缺点就是维护成本较高，需要相关的专业人员去开发维护，有一定的使用门槛。一般公司如果不是专门做可视化相关业务不会配备相关专业人员。
说下几种工具的优缺点：
Ventuz 国内用的相对较少，相关专业人员也较少。虚幻引擎效果上是比较好的，但是对 WebGL 参数支持的较少。Threejs 虽然支持三维但是没有 Unity 那么强大的编辑器，一些复杂的效果实现不了。相对于前者 Unity 来说成熟一些，也是目前市场上用的比较多的，不过 three 对于前端开发同学更友好一些，容易上手，学习成本相对低一些。
可视化设计是相对新兴的行业，就目前市场来看也是当今比较火的行业。作为一名设计师，不仅仅是只做完效果图就能行的，他是一个结合硬件设备、UI 设计、三维建模、三维渲染、动态设计、数据可视化、图形技术、GIS 数据、渲染引擎、交互技术等等综合类的交叉学科。
1. 硬件设备
硬件设备信息是做大屏一切的开始，我们首先要了解它的尺寸、比例、屏幕种类（拼接屏、LED 屏）投影方式等等 一系列的信息，方便后续的设计工作。
上图为一些常见的屏幕拼接方式，确认好屏幕的拼接方式就可以计算出整个大屏的物理分辨率。举个例子：上图中最后一个的拼接方式为横向3块屏，竖向2块屏幕。他们每块的屏幕分辨率为宽1920px 高1080px，那么这块2×3的拼接屏幕的尺寸就应该是：宽度 1920乘以3（横向3块屏）高度1080乘以2（竖向2块屏）得出整个屏幕的物理分辨率为：5760×2160。
物理分辨率 VS 输出分辨率
大屏的投射方式大致分为三种：1、电脑屏幕 1 比 1 等比例投屏。2、通过主机直接输出给拼接屏（这种大多都是一些自定义比例屏幕和分辨率超大的情况会应用到）。3、投影仪投射。
一般大屏的物理屏幕分辨率大小都有不同，有的是极大的，几万像素，如果我们按照物理分辨率来去做设计的话会很卡，所以这里设计尺寸建议按照输出分辨率设计。输出分辨率会受到硬件的限制（超大情况下需等比缩放），我们一般会采用输出分辨率作为最终的设计尺寸。针对硬件设备设计时要关注以下几点：屏幕拼接方式、单屏幕像素及拼接后像素、输出像素等这些决定了设计尺寸、内容排布、拼接缝的规避等问题。
2. GIS 数据
通常应用于参数化建模，之前写的 0-1 带你制作智慧城市地图（二）就属于参数化建模的一种，主要是通过一些地理位置高程数据进行模型的生成。属于智慧城市可视化设计的基础设施。
常见的一些格式：Openstreetmap（多用于生成模型）、Shapefile（多用于生成模型）、Geojson（主要用于基于 Web 的映射）、TIFF（多用于贴图处理）。
一些常用的工具：Qgis、Arcgis、Google mapper
3. 三维建模
在可视化设计中，一般我们会结合生成参数化模型加定制化手工模型的方式处理整体效果。这么处理的目的：一是设计上能突出主体，增加画面的层次感。二是在性能上能很好地优化，提高整体性能。
下图为设计侧到开发侧对接流程：
4. 动效设计
常见的一些动效对接格式：GIF、MP4、APNG、Lottie、序列帧。
5. 图形技术
了解图形成像原理，是由一个个的粒子点生成的画面。
下图是由一个 50×100 的粒子组成的平面，每个粒子都会对应他的 xy 轴的坐标位置，我们通过控制的粒子透明度、大小、颜色、位置、旋转等参数呈现不同的视觉效果。
世界地图的是通过一个一个粒子成像形成的画面，其中黑色=0、白色=1。比如粒子大小是 1，它对应的位置是黑色，黑色是 0，1×0 就=0 显示为黑色。
我们常做的粒子世界地图就是通过控制粒子黑白 x 粒子大小叠加出来的。
比如我们做粒子地球的时候是通过一张贴图来去控制黑白度，海洋是黑色所以就不显示粒子，陆地为白色显示为白色粒子，最终呈现了一个粒子地球的效果。
6. 渲染引擎的技术架构
前面实现方式里讲到市面上可视化落地基本都是基于于 Unity3D、虚幻引擎（UE4）、Ventuz、threejs 等工具实现的。
它们的底层是由 BS（Browser-Server）架构和 CS（Client-Server）架构两大架构组成的。
BS 架构与 CS 架构特点
本期给主要是给大家普及可视化设计的一些流程以及相关的专业知识，欢迎后台添加小六微信沟通交流。
作者： Mr.小六
转载请注明：优设网
蓝蓝设计建立了UI设计分享群，每天会分享国内外的一些优秀设计，如果有兴趣的话，可以进入一起成长学习，请扫码蓝小助，报下信息，蓝小助会请您入群。欢迎您加入噢~~希望得到建议咨询、商务合作，也请与我们联系。
分享此文一切功德，皆悉回向给文章原作者及众读者.
免责声明：蓝蓝设计尊重原作者，文章的版权归原作者。如涉及版权问题，请及时与我们取得联系，我们立即更正或删除。
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的 界面设计公司，为期望卓越的国内外企业提供卓越的UI界面设计、 BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、 平面设计服务、UI设计公司、界面设计公司、UI设计服务公司、数据可视化设计公司、UI交互设计公司、高端网站设计公司、UI咨询、用户体验公司、软件界面设计公司
大数据可视化界面设计之一：可视化大屏设计快速入门指南
大数据可视化界面设计之二：可能是最详细的大屏数据可视化设计指南
蓝蓝设计的小编 http://www.lanlanwork.com
深圳坪山网站建设公司网站seo如何优化视频网站的优化具有云速捷独一手机网站排名优化 s中山seo网站优化网站存在什么问题需要优化海山最好用的网站优化眉山网站seo优化公司集美网站优化哪家强平谷线优化官方网站如何优化网站提高网站搜索排名壹起航网站优化维护重点卫辉一站式网站搭建优化牟平区品牌网站优化公司定南百度网站优化光谷企业网站推广优化网站推广优化す询苏da峰1seo网站优化案例溧阳市网站优化收费网站seo优化方式随州网站优化公司seo网站优化外包哪家好罗湖哪种网站优化网络推广复制别人的网站优化好收录吗佛山网站关键词优化哪家好长沙网站优化掌营天下新安好的网站优化沈阳媒体网站建设优化价格端州网站收录优化海南网站优化选哪家埇桥网站优化香港通过《维护国家安全条例》两大学生合买彩票中奖一人不认账让美丽中国“从细节出发”19岁小伙救下5人后溺亡 多方发声卫健委通报少年有偿捐血浆16次猝死汪小菲曝离婚始末何赛飞追着代拍打雅江山火三名扑火人员牺牲系谣言男子被猫抓伤后确诊“猫抓病”周杰伦一审败诉网易中国拥有亿元资产的家庭达13.3万户315晚会后胖东来又人满为患了高校汽车撞人致3死16伤 司机系学生张家界的山上“长”满了韩国人？张立群任西安交通大学校长手机成瘾是影响睡眠质量重要因素网友洛杉矶偶遇贾玲“重生之我在北大当嫡校长”单亲妈妈陷入热恋 14岁儿子报警倪萍分享减重40斤方法杨倩无缘巴黎奥运考生莫言也上北大硕士复试名单了许家印被限制高消费奥巴马现身唐宁街 黑色着装引猜测专访95后高颜值猪保姆男孩8年未见母亲被告知被遗忘七年后宇文玥被薅头发捞上岸郑州一火锅店爆改成麻辣烫店西双版纳热带植物园回应蜉蝣大爆发沉迷短剧的人就像掉进了杀猪盘当地回应沈阳致3死车祸车主疑毒驾开除党籍5年后 原水城县长再被查凯特王妃现身！外出购物视频曝光初中生遭15人围殴自卫刺伤3人判无罪事业单位女子向同事水杯投不明物质男子被流浪猫绊倒 投喂者赔24万外国人感慨凌晨的中国很安全路边卖淀粉肠阿姨主动出示声明书胖东来员工每周单休无小长假王树国卸任西安交大校长 师生送别小米汽车超级工厂正式揭幕黑马情侣提车了妈妈回应孩子在校撞护栏坠楼校方回应护栏损坏小学生课间坠楼房客欠租失踪 房东直发愁专家建议不必谈骨泥色变老人退休金被冒领16年 金额超20万西藏招商引资投资者子女可当地高考特朗普无法缴纳4.54亿美元罚金浙江一高校内汽车冲撞行人 多人受伤
