echarts 大屏可视化_看似复杂炫酷的数据可视化设计，用这波神器轻松搞定！

<div class="._5ce-wx-style" style="font-size:16px;">
<div class="rich_media_content" id="js_content">
 <img alt="dd9ac2be7f46539e31c05be3dd6f2323.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-b895f49fa235f2ea3d88b53486f3eb00.png">
 数据大屏与数据可视化
 数据可视化是目前对数据展示最常用的方式。数据的可视化设计有助于将复杂的数据，用最易理解的方式展示在用户的面前。
 数据可视化在中后台的设计中很常见，通常主要用于分析和决策，对实时性要求不高，从一部分功能上讲，其实也有着报告数据的作用。设计以 2D 平面展示为主，几乎不会有 3D 设计出现，视觉设计更注重简单直接，一目了然。
 <img alt="57755dd77fafd4d9d9fbb88de9cfd7e9.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-76ddfc78c73bf40a87a1feac93fe39d9.png">
 △ 来源 dribbble 作者wuze
 数据大屏在上面的基础上，对实时性要求较高，会更强调数据展示的效果，这也是会流行 FUI 未来主义科幻风格设计的原因，追求视觉上的酷炫效果。设计上 2D、3D 皆有，还可以伴随着动效搭配一些可交互的设计，来展示数据之间联动。
 <img alt="5dcd389f336a75b2c8a00f85d2f874f1.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-04692c8606b14308a9b25d57b0380241.png">
 △ 来源 dribbble 作者William Chen
 制作数据大屏的一点小建议
 数据大屏的制作可能会包含一些动效交互及3D建模渲染，一般中小型公司通常技术能力有限。如果接到设计制作数据大屏的任务，不妨先和产品技术等一起就表现方式和技术实现等方面做个探讨，不要直接进行设计工作，贸然追求超燃的特效，避免最后因为无法实现导致无谓的返工。
 <h4>大厂的可视化服务</h4>
 1. 百度 Suger
 网站链接：https://cloud.baidu.com/product/sugar.html
 Sugar 是百度云推出的数据可视化服务平台，目标是解决报表和大屏的数据可视化问题，解放数据可视化系统的开发人力。
 <img alt="5048dec313ff3f4c4e433655552abb38.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-53e3bdf3fcb17d31ad395262fbdc9d05.png">
 △ 来源Suger官网
 上图是官网提供的案例，界面风格是常规的 FUI 风格。
 Sugar 提供了组件编辑平台，进入平台后设计师可以直接进行组件的拖拽编辑，打造自己所需要的大屏界面。在设计师完成后就可以直接交接给开发，进行各类数据源的接入。这种形式无疑节约了很多的开发时间，设计师也不用再担心前端开发的效果与自己的差之千里。对于时间紧迫或者自身技术能力不足的项目很适合。
 在组件的提供上，Suger 提供了很多的 2D 和 3D 组件，在一定程度上也可以自定义组件。还可以设置数据下钻和图表联动，增强动效交互效果。
 <img alt="d69702a3a9568b474296c4b53f83349f.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-5bbd19218d7c44be7f3244b67737f0b5.png">
 △ 来源Suger编辑平台
 平台的编辑界面总体来说还是很方便设计师适应的，与一般的设计软件界面差不多。上方是一些工具，左侧是图层的排布，右侧则是一些组件的属性。设计师可以很快地适应并应用，没有学习成本，也不会有太高的操作难度。但是 Suger 在 3D 方面尚有不足，个人感觉没有阿里云 DataV、腾讯 RayData 的 3D 效果突出。
 最后一点，Suger 目前处于推广期，推广期间是免费使用的。
 2. 阿里云DataV
 网站链接：https://data.aliyun.com/visual/datav?spm=a2c4g.11174283.2.1.46b66b79vzB03d
 DataV 最著名的一个应用项目应该就是天猫双11的数据大屏了。每一年都惊艳了无数聚焦于双11活动的人们。2018 年的双11数据大屏设计更是被称为数据经济时代的全球清明上河图。
 △2018天猫双11大屏
 同样的，DataV 也提供了一个编辑平台，连该平台本身的界面设计也充满了未来科技感，可以根据模板新建，也可以新建空白页面。基本操作模式与 Suger 类似，设计师先建立画面，后开发进行数据源的接入。编辑界面的操作难度也不高，稍微了解一下，就可以快速入手。
 <img alt="0e1bb2ee6a1ff4fff3ebfa2dc886b71e.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-0083dc3f3563839e75ca19f3ed4a3468.png">
 <img alt="d10b94b825e4ca29ff72f23a3e91a17e.png" src="https://beijingoptbbs.oss-cn-beijing.aliyuncs.com/cs/5606289-a9c2b398d33ad495b3ffe9c420a