可视化大屏制作过程_4步玩转可视化大屏！兼具科技感和实用性（内附模板下载）...

“今朝有酒今朝醉，   报表不做不能睡，   借问酒家何处有， 报表还得编一宿” 这个心酸又好笑的打油诗是我一个做报表的朋友写的，刚看到的时候觉得特别搞笑，仔细一读又觉得有些心酸。 干报表这行的的确不容易，以前要求Excel耍的溜，天天抱着Excel做表，现在市场变化了，开始流行数据可视化，老板们天天喊着要大气美观、酷炫高级的可视化大屏，显然，光会Excel已经跟不上要求了，为了保住饭碗，表格表姐们又要在做数据可视化大屏上煞费苦心。 其实，可视化大屏不仅是要在视觉上美观炫酷和与数据契合的科技感，更重要的是突出重点数据，做到美观性与实用性共存的效果：

看到这样高大上又富有科技感的大屏不禁会让人觉得制作的过程很复杂，其实不然，用FineReport10.0做这样一张大屏，其实只需要四个步骤，下面就给大家仔细讲讲大屏的制作过程和一些经验总结：

选择指标，排版布局 可视化大屏的目的是为了让领导和同事更加清晰的看到每一个数据指标，所以制作大屏最重要的一步是确定哪些维度的指标需要展现，然后再考虑怎么把要展现的指标合理的布局在大屏上。在指标的选择上有很多需要注意的点，这里我总结了几个给大家： 1、大屏指标在8-12个为宜 大屏上的展示空间是有限的，我们不能将所有的数据都堆到大屏中，领导想要看到的也只是一些关键数据，所以大屏上的指标数量最好在8到12个之间，这也是数据指标数量的主流配置，这个数量的时候，大屏整体看起来不空也不挤。 少于8个的话，大屏就会显得空旷，而且也不经济；多于12个的话，这么多的数据指标挤在在一个张大屏上，要做到井然有序，确实很考验设计者的功力。这里给两个布局样式给大家参考一下：

但是如果数据指标真的很多，实在是不能删减，那么我建议使用报表块，将这些数据整合到一起。这样，多个数据指标就可以在一个报表里面展现出来，不用占用很多空间。比如像下面这样：

2、比率类、数字类和子部分布类指标要合理

布局比率类、数字总计类和子部分布类指标就像食物中的碳水化合物、脂肪和蛋白质，既要保证摄入量，也要营养均衡。

比率，数字总计和子部分布这三类指标在每张大屏中几乎必然出现，并且出现的次数也很多，次数分布也比较均匀。一般大屏都需要有数字总计类的指标，而且往往是核心指标，这样方便领导知道核心指标目前的总体状况。但是仅仅一个数字并不能反映出当前指标的完成情况，所以也需要有比率指标，它反映了部分占总体的占比。

另外，比率也只能体现一个占比情况，要想知道总计类指标的各个组成部分的具体情况，还需要子部分布类指标，例如用地图展示出全国营业额中各个地区的营业额情况。

所以大家要善用这三类指标，都要有，而且数量要均衡。

3、时间序列指标、文本指标不可过量

时间序列类指标和文本类指标就像食物里的微量元素，是必须摄入的营养，但是不可过量。

对于文本类的指标，因为领导们看大屏就是想摆脱枯燥的传统表格类报表，如果在大屏上还是大量出现，领导肯定是要发火的。

而时间序列指标的出现概率甚至跟数字总计类指标的概率一样，这是因为时间序列类的指标可以反应某个数据随着时间变化的趋势，这是相当直观而有意义的。不过，虽然我们可以通过季度，月度和日这些不同的粒度将一个数据指标用多个图表展示，但是这样并没有意义，选择最合适的一个粒度就好，多了没有必要。

选择合适的可视化图表

确定了排版布局之后，下一步就是根据分析指标选择合适的展现图表。FineReport内置了丰富的图表类型可供选择，基本满足的图表可视化的需求，除了官方的自定义样式外，还提供了选项让用户可自行调整，包括标题、标签、图例、背景、坐标轴等。

在选择图表组件的时候，要注意减少一些高频组件的次数，避免给人一种很重复的感觉。像报表块、饼图、柱形图、仪表盘、折线图、条形图和地图这几个组件出现的频率就非常高，可以说是大屏图表组件里面的常规武器了，我们可选择一些新颖的动态组件来代替。

比如地图可以是这种：

仪表盘也可以做成这种：

除了上面的这些以外，还可以在图表中使用一些3D特效来增加图表的科技感。通过设计师设计的图片作为背景来拓宽图表样式，实现3D柱形图、3D圆环图等效果，设计师设计自定义一些具有特效的图表图片，然后把数据去掉。

配色&细节点缀

细节决定成败，这样的大道理已经被宣扬过无数次了。在大屏展现上，细节也会极大的影响整体效果，合理的配色选择，元素添加都可以提升大屏的视觉观感。

1、配色

合理的布局能让业务内容更富有层次，合理的配色能让观看者更舒适。配色的学问很复杂，这里就先讲一讲背景色。背景色又分为整体背景以及单个元素的背景，无论是哪一个，都遵从两点基本原则：深色调和一致性，之所以选择深色调，主要是为了避免视觉刺激。

2、元素添加

标题、数字等可以添加一些诸如边框、图画等在内的点缀效果，能帮助提升整体美观度。

为了进一步帮助大家做好大屏，这里整理了一些常用的大屏背景和边框元素给大家。(文末有获取素材文件方式)

背景图素材1 背景图素材2 动态可视化

简单的大屏成型后，我们还可以给大屏增加一些动态可视化，动态可视化可以让大屏看上去是活的，增加观感体验。动态效果范围很广，可以从很多角度解读，比如刷新的加载动画，比如轮播动画，比如图表的闪烁动画，地图的流向动画等等，我们可用通过使用这些动态插件图表来实现：

轮播GIS点地图 点地图自动刷新 轮播三维组合地图

动态可视化虽然可以起到点睛的作用，但过分的动态效果非常容易喧宾夺主，让观看的人不知道往哪里聚焦，反而丧失了业务展现价值，所以在动态效果的使用上一定要掌握一个度，既要平衡酷炫效果，又要突出内容。

大屏实用辅助工具分享 讲完了大屏的基本制作过程，下面给大家分享几个比较实用的大屏制作辅助网站：

素材网站及资料：

• 千图网：主要用来找大屏素材，边框比较一般，不适合大屏用，元素图标还可以

• 千库网：矢量图片不错，主要用来找边框和一些炫酷元素

• 花瓣网：移动端样式不错

• 在线PS：主要用于裁剪PNG图片

配色网站：

• 单一色系配色

    (http://zhongguose.com/#qingshuilan)

• 色系配色

    (https://colorhunt.co)

• 渐变色配色

    (https://uigradients.com/#Mantle)

最后，为了更清楚地了解大家在大屏制作上遇到的难点，进一步帮助大家解决问题，传说哥向大家征集一份问卷调研，问卷填写成功即可免费获得文中使用的大屏素材及demo资料包。

点击文末“阅读全文”获取链接。