精华内容
下载资源
问答
  • 可视化大屏

    千次阅读 2019-11-29 14:33:47
    大纲DataView中的那些事(一)、前言(二)、可视化大屏的整体思路(三)、图表的选择(四)、 提升可视化大屏的一些技巧 DataView中的那些事   近期,本人一直在做可视化大屏,用的平台是阿里的dataview。阿里云DATAView...

    DataV中的那些事

      近期,本人一直在做可视化大屏,用的平台是阿里的dataview。阿里云DataV链接。一开始发现在DataV这方面的知识还是蛮少的。因此,我就将近期做的成果以及做可视化大屏的一些方法和注意事项分享给大家,以方便大家讨论。这是本人第一次发博,如有疑问,还请大家多多指教、包含。

    (一)、前言

      随着信息化技术的不断发展,我们现在迎来了数字化时代,作为大数据时代,一个最大的特点就是数据来源多、数据量大。一些数据的背后往往会隐藏着一些潜在的信息,这些信息通过我们对数据的整合、过滤、清洗,最后通过一定的方式将其信息展示出来,有利于高效管理决策升级的作用,这种呈现最多的方式就是可视化大屏。
      做可视化大屏的软件有很多,比如阿里的DataV、观远数据、Yonghong Y-Vivid Show、帆软软件等,通过一段时间的使用,最容易上手、做出来最漂亮的还属阿里的DataV了。
    刚开始在选择用哪个软件进行做可视化大屏时,在网上考到了很多,刚开始选择了帆软软件,结果发现帆软软件做报表还好,做可视化大屏,对于一个对可视化大屏没有任何了解的我来说是很难上手的,经过一系列的尝试之后,最终选择了DataV。DataV不仅仅有丰富的模板,很快带你上手,刚开始按着模板只需要稍微改动一下,一张漂亮的大屏就出来了,关键数据源比较多样,有数据库、接口、静态数据,但是最终返回的数据类型就是我们熟悉的json。最关键的就是有一个钉钉群,里面有专业的老师给我们随时答疑。我们遇到任何问题,都可以去群里咨询相关的老师,都会为我们答疑,使我们很快的上手。最关键的就是有详尽的文档,为我们介绍每一个组件是做什么的,以及如何使用这个组件。
      通过这段时间对DataV的了解,我有几点拙见和大家共享,通过这篇文章,希望大家对可视化大屏的认知以及用DataV做一张不错的大屏有一点帮助。

    (二)、可视化大屏的整体思路

      首先从可视化大屏说起,其面积特别的大,用户站在远处也能看到内容,并且最好是深色,让观者的视觉更好的聚焦。大屏一旦开启,就不可操作,并且大屏是受到空间的局限,就是一张屏幕,没有滚动条。因此,这就需要我们要设计合理,展示的数据不宜过多,用一定量的数据展示出数据背后的现象以及规律。
    可视化大屏现场效果图
      要想做出一张满意的大屏,首先就应该了解可视化的过程。我们在做可视化大屏时,首先要有一个主题,整个大屏的所有数据的呈现都应该是围绕这个主题展开的。主题确定之后,就应该是针对这个主题,我们去找一些数据来支撑我们的主题,这些数据尽可能是具有权威性。本人经常去国家统计局、税务局等相关的政府机构去找一些数据,只有一些真实可靠的数据才能使我们可视化大屏展示数据背后的规律才可能是真的。根据数据的特性,我们确定相应的图表,用最合适的图表展示我们的数据,让观者看了很清晰,也很美观。最后就是通过我们确定好的图表进行合理的布局。
      在这个过程中,其中最重要的主题的确定,只有主题确定了,我们才可以围绕主题来进行逐步展开。最耗时的就是数据的查找,如果没有相应技术的支持,找一些支撑主题的权威数据是很耗时的,尤其现在还是数据时代,都知道数据的价值,因此,很多数据都不公布,公布的都是一些零散的数据。最难的就是图表的确定了,如果我们对图表的特性没有很好地掌握,数据特征不同,适合的表就不同。一张适合相应数据的表格给人感觉特别的清晰,而且还美观。最后就是进行布局设计。这个环节就是体现我们整体的思维以及审美观念,这个环节直接决定我们的大屏是否合理、是否美观,因此要求我们既要有审美意识,也要有全局观念,合理布局。以下就是可视化的具体过程,即从开始的确定主题到最后的可视化大屏的呈现。因此,一张屏就是一个故事。
    可视化过程
      经过本人这段时间做的大屏,在找数据的过程中,发现数据大体分为这几类,并且我们一般用到的数据也就是这几种。具体的有:趋势型、对比型、比例型、分布型、区间型、关联型地理型等。我们通过一些重要的数据来支撑起整个大屏,并且通过这些数据合理的表现出背后的主题。
      接下来就是确定图表,我们通过合理的图表展示相关的数据,从而呈现我们可视化大屏的主题。以下就是数据关系与图表之间的关系。
    数据与图表之间的关系
      最后就是可视化设计,在这个阶段主要包括两个关键的步骤:可视化布局的设计、数据图形化的呈现方式。在这段时间做DataV的过程中,每次在布局页面时,就不自觉的进行了聚焦,即把最重要的放在最核心的位置,通过不同的方式加以区别,目的就是为了把最重要的信息传达给用户,从而提高其效率。其次就是注重信息之间的平衡,我们用的是48块小屏组成的一块大屏,其中分别用24块组成了各为12块的副屏,剩下的24块小屏组成的主屏。因此在设计的时候,我特别注重页面设计的平衡性,最大程度的注重美感,给读者在传达信息的同时也给以一种舒适的视觉去欣赏。最后也是我在设计中领悟最深的一条,那就是要简洁,通过简单而不同的方式将重要的主题信息传递给读者,由于大屏的尺寸受限,因此不适合冗杂的数据。刚开始不懂这条原则,以为数据越多越好,最后给人的感觉就是没有重点,杂乱无章,效果特别差。
      因此,接下来的小伙伴在开发可视化大屏的时候一定要注重这一点,这直接会决定可视化大屏的效果。

    (三)、图表的选择

      一张完美的可视化大屏主要就是通过合适的图表将这些数据通过一定的布局呈现出来,因此,图表的选取就显得尤为重要。我们在做可视化大屏的时候,不仅仅是数据,还有一些文字型的,类似于参考文献、科研成果之类的。因此类型的不同展示的方式不同。这是可视化大屏中最为关键的一个环节。接下来,通过思维导图的方式详细给大家介绍这几种图表应该如何选择以及适用的场合。
    图表的选择
      通过上述思维导图的过程,大家应该对数据的类型以及图表的选择有了初步的了解。由于这块是重中之重,直接决定可视化大屏的呈现。因此我对常用的一些图表做了简单的对比。
      柱状图 VS 条形图
    相同点:
         柱状图和条形图的数据结构是相同的,都是由一个分类字段+一个连续数值字段构成。
       &emsp 当数据的记录数不大于12条,分类字段的字符长度小于5时,此时柱状图和条形图可以互换。
    不同点:
         柱状图:若分类字段,恰好是时间序列,此时建议使用柱状图,因为柱状图能更好地体现数据随时间的变化情况
         条形图:若分类字段的字符长度较长,且数据的记录数大于12,此时建议使用条形图。
      *** 折线图 VS 面积图***
    相同点:
         折线图和面积图展示的是数据随时间的变化趋势,因此映射到X轴的数据类型一般为:时间/日期。
       &emsp 二者均可以展现一个或多个变量和时间的关系,这种关系包括,周期性变化、季节性变化、异常波动等。
         在大部分情况下,折线图和面积图是可以互换的
    不同点:
         折线图:通过数据点的纵坐标来映射数值的大小,一般只用来表示数据的趋势
         面积图:通过面积来映射数值的大小,面积图除了可以替换折线图外,还可以用来表示整体及其构成部分随时间的变化趋势。
    注意:
         当使用面积图表示多系列的趋势时,需要对代表不同系列的面积区块颜色设置透明度,透明度可以减少不同系列之间的遮盖,帮助我们看到不同序列之间的重叠关系和更多信息。
         当一个图表中,系列值过多时,折线图会比面积图更直观,因为减少了系列的覆盖和重叠,能更清晰的看看到各个系列的趋势变化。
      区域折线图 VS 斑马图
    相同点:
         堆叠面积图和堆叠柱状图的数据集格式类似,都是由一个分类字段+多个连续数值字段构成,且多个连续数值字段,是一个整体的各组成部分。
         两者都可以观测某一节点的总体数值和各组成部分的具体数值,都有数据对比的功能。
    不同点:
         区域折线图:类字段,一般是时间序列。当既需要分析整体随时间的变化趋势,又要了解整体的各构成项随时间的变化情况时,应该使用堆叠面积图。从其目的可以看出,堆叠面积图的分类字段(即时间序列),是按照时间的先后顺序排列的。
         斑马图:一般是非时间类型的分类数据。当既要对比不同整体的数据大小,又要观测整体各构成项的数据大小时,应该使用区域折线图;若整体的构成项过多,为了突出重点,需要对构成项进行重新归类,展示TOP5的分类,剩下则归为其他。
      散点图 VS气泡图
    相同点:
         散点图和气泡图,均是用来展示数据分布情况的一种图形。
         散点图和气泡图,都是将两个字段映射到x,y轴的位置上,(x,y)的取值确定一个圆点或气泡在直角坐标系中的位置。
    不同点:
         散点图:一般用来展示二维数据(x,y)的分布,侧重于研究二维数据的两个变量x,y之间的相关性,如身高和体重之间的相关关系。还可以展示多组数据系列的对比,比如男性身高体重和女性身高体重分布规律的对照。
         气泡图:一般用来展示三维数据(x,y,z)的分布情况,相较于散点图,气泡图增加了一个维度的数据展示,且将其数值映射到气泡的大小上。也可以展示多组数据系列的分布,以发现不同系列的分布规律和差异。

    (四)、 提升可视化大屏的一些技巧

      首先,我们在地图上多多做文章,地图可以展示很多直观的效果,我们要善于利用3D地图,以及飞线层和散点层和区域热力层。
      其次,就是各种颜色的选取,以及利用回调、节点编程等相关的技术。使自己的大屏的色调统一,并且可以使用多种不同的方式,不仅仅是单一的。
      最后,就是多看看别人做的可视化大屏,多看多吸取别人的想法,拓宽自己的思维。这有这样才能够做出属于自己的可视化大屏。
      总之,通过这段时间对DataV的制作,感觉还是整体上能够满足我的需求,并且还有一些丰富的模板供我参考使用。另外,接收的数据源较为通俗易懂,对新手来说也不是难事,还有回调、交互、节点编程等高端的展示方式。只不过目前为止,还在研究节点编程。希望接下来和大家多多探讨。不过在用的过程中,发现DataV的一些专业组件还没有,比如说函数的图形组件、概率密度组件等。希望DataV今后能将这些组件开发出来,这将对可视化大屏的应用范围、专业度又会提升一个档次。不过,我知道开发这些专业组件仍需要时间。总体上,DataV能够满足大多数用户的需求,随时答疑,这一点是其他软件没有的。
      接下来分享几张大屏。做的不好,希望能够给大家一点启发,请大家多多指教。
    生态指数
    自然资源
    增长质量
    尾矿库
    绿色生活
    生态事件
      文章末尾给大家分享这段时间做的一些可视化大屏,希望给新人加以启发。另外,如有任何疑问,均可以联系我,我们共同交流,共同进步。
      以下是我的联系方式:
                 QQ: 1049644405
                邮箱:1049644405@qq.com

    展开全文
  • 数据可视化大屏+Echarts+HTML+vscode开发环境,数据可视化大屏Echarts,柱状图、折线图、饼图、中国地图怎么使用。
  • Echarts可视化大屏

    2021-04-06 18:08:52
    Echarts可视化大屏
  • 2020年了,还有人不会可视化大屏? 我以前不止一次给各位看过可视化大屏,无论是什么做的,最终的意义都是要让数据展现的更直白、美观、有科技感一点! 或许,你以前是用Excel做可视化大屏 或者,你以前是用vue....

    2020年了,还有人不会可视化大屏?

    我以前不止一次给各位看过可视化大屏,无论是什么做的,最终的意义都是要让数据展现的更直白、美观、有科技感一点!

    • 或许,你以前是用Excel做可视化大屏
    • 或者,你以前是用vue.js等前端工具做可视化大屏
    • 又或者,你用的是echarts、Python等专业的工具
    • 再或者,专业的可视化工具FineReport和FineBI也是你的最爱

    我想了想,并不是所有人都会代码,而且这东西制作起来也有难度,那如何0代码做出来呢?

    我花了近8小时,为各位找到了200多张可视化大屏的模板,废话不多说,直接看就行!

    用8小时,找到了200张可视化大屏模板,你可以直接用

     

    用8小时,找到了200张可视化大屏模板,你可以直接用

     

    用8小时,找到了200张可视化大屏模板,你可以直接用

     

    用8小时,找到了200张可视化大屏模板,你可以直接用

     

    用8小时,找到了200张可视化大屏模板,你可以直接用

    数据可视化最近真的很火,和大数据一样,无论是企业数字化转型,还是对个人能力的提升,都会用到这个,所以需要抓紧学习!

    关注我并转发该文章,回复“大屏”,即可获得200多张模板和工具的下载,错过可惜!

    展开全文
  • 对于大数据从业人员来说,可视化大屏可能是最能展现工作价值的一个途径。因为数据分析的最后成果就需要可视化展现出来,而可视化大屏这种直观的、炫酷的、具有科技感的方式,更能获得领导喜欢。那么领导到底想要看...

    对于大数据从业人员来说,可视化大屏可能是最能展现工作价值的一个途径。因为数据分析的最后成果就需要可视化展现出来,而可视化大屏这种直观的、炫酷的、具有科技感的方式,更能获得领导喜欢。

    那么领导到底想要看什么样的可视化呢?比如类似于这样的:

    95336a5cf7b9fffa2a621e2db920c60f.png

    那怎样设计制作出领导满意、效果拔群的可视化大屏呢。下面这些设计步骤,必须了解。

    1、客户沟通,明确需求

    可视化大屏开始设计之前,最重要的就是,跟客户进行沟通,明确用户的需求。

    整体项目是利用大屏设备进行相关数据及图表展示,我们预想将项目应用的场景分为两种情况:1.专业展示:参与商务活动、分享或为某些团体进行讲解及展示使用。2.普通展示:主办公区域或前台大厅实时数据展示。

    通过应用场景,还可以进一步将用户进行区分。

    19d0f310b9ea741d4ed8f5d60d4f8f21.png

    △明确客户需求步骤

    A. 专业用户:即参加商务活动、分享等,需了解具体数据内容的用户。此类用户会较为细致的查看每项数据;

    B. 兴趣用户:即无论数据在何处展示,其对数据都有浓厚的兴趣,会去驻足停留,仔细观看及分析数据。

    C. 普通用户:即匆匆过往的人群。这部分用户可能只会在屏幕前短暂停留。

    将场景和用户进行分类后,就可以进一步根据他们的需求,进行需求可视化大屏的归集。

    2、了解物理大屏,确定设计稿尺寸

    大屏一般分辨率比较高,如果不事先确定物理大屏尺寸,设计稿设计出来的效果被投放到大屏上就会有偏差失真。一般情况下,确定设计稿尺寸需要分两种情况:当投屏电脑与与大屏系统尺寸比例、分辨率一致时,设计稿的尺寸、分辨率以投屏电脑为准;当投屏电脑与与大屏系统尺寸比例、分辨率不一致时,设计稿的尺寸、分辨率以物理大屏为准;

    注意,若物理大屏分辨率过高,可进行分辨率减半设计

    ed58b696531903cd90bc1de1f9ec5d27.png

    △大屏系统示意图

    所以,一般我们也不建议大屏用自适应方式,如果是自适应,系统就会按各自模块的宽高比先计算实际值,一旦大屏内容布局较多或指标计算复杂,则会非常影响大屏计算性能和实时分析能力。

    3、确定关键指标

    关键指标是一些概括性词语,是对一组或者一系列数据的统称。一般情况下,一个指标在大屏上独占一块区域,所以通过关键指标定义,我们就知道大屏上大概会显示哪些内容以及大屏会被分为几块。

    以学校校情大屏为例:这里的关键指标是教学经费投入、教学用房面积、多媒体教室座位等。

    e73e3c9daa8d184f9a1fb7918e9b6041.png

    △教育大屏关键指标示例

    确定关键指标后,根据业务需求拟定各个指标展示的优先级(主、次、辅)。

    主要关键指标:主要指标位于屏幕中央,多维动效丰富的地图或者其他次要关键指标:次要指标位于屏幕两侧,多为各类图表辅助关键指标:主要指标的补充信息,可不显示或显示。

    4、页面布局划分

    尺寸和关键指标确立后,接下来要对大屏进行布局和页面的划分。这里的划分,主要根据我们之前定好的业务指标进行,核心业务指标安排在中间位置、占较大面积;其余的指标按优先级依次在核心指标周围展开。一般把有关联的指标让其相邻或靠近,把图表类型相近的指标放一起,这样能减少观者认知上的负担并提高信息传递的效率。

    主次分明、条理清晰、注意留白,合理利用大屏上各个小的显示单元,并尽量避免关键数据被拼缝分割。

    0f4c33c802de7da0d71eed53deb3b3bb.png

    △大屏规划布局示例

    这一点要求我们注意视线的移动规律。比如横向排版的信息,人们一般会首先注意左上角。因此,标题一般出现在这个位置。看过左上角之后,用户的视线会往右下方移动。我们在排版布局的时候,应该遵循视线的移动规律,人眼在观察物体的时候,目光不会只聚焦在一点上,而是会覆盖焦点周边的一片区域。把时间的流逝感和视线的移动相结合,就能产生更好的效果。

    5、确定统计图类型

    选定图表注意事项:易理解、易实现;图表类型选择,可以参考亿信华辰酷屏统计图,百余种统计图组件,任君选择。

    易理解:要考虑大屏最终用户,可视化结果应该是一看就懂,不需要思考和过度理解,因而选定图表时要理性,避免为了视觉上的效果而选择一些对用户不太友好的图形。

    易实现:某些效果用设计工具可以轻易实现,但开发要用代码落地却非常困难,所以大屏设计中一定要善用工具,切忌不计成本,埋头苦作。

    44532cf46e4fba397462d0e88d1e3208.png

    △亿信ABI统计图

    选择统计图有以下两个重要原则:

    a. 符合业务场景数据特点

    统计图的基础就是数据,所以在进行统计图选择时候,最重要就是要符合业务场景中数据的特点。这里根据归结图表的特点,汇总出一张思维导图,帮助大家更快地选择展现数据特点的图表类型。

    789d078867eb1295568958e048cf029c.png

    △统计图选择建议(点击大图查看)

    b. 吸引眼球,令人心动

    庞大的信息量充斥我们的生活,一张信息图的设计如果没有特色很快就会被淹没。因此,不论是从结构出发,还是趣味性,抑或是色彩冲击力,一定要有足够吸引人的地方,首先让用户产生兴趣。不管是展示什么样的信息内容,都要加入一些让人耳目一新的元素。

    亿信酷屏内置百余种炫酷组件,拖拽即可实现大屏制作。如下面这款,亿信酷屏中的魔法水晶球统计图组件,完全打破了统计图的局限,将重要数据重点展示,炫酷清晰,用在政务云、云计算、智慧城市等大屏中,效果惊艳。

    5c08e997be9a36aee961a71258d58a2e.png

    △亿信酷屏内置组件-魔法水晶球

    6、定义设计风格

    可视化大屏的设计风格主要根据行业类型、客户喜好、具体展示指标整体搭配,但总体一般以深色为主,这主要是因为大屏如果是浅色系长时间观看会造成眼睛疲劳、刺疼,还一点就是浅色上面不是很适合体现动感光线等特效的展示。当然大屏虽酷炫,但我们也不能忘记了为了炫酷而炫酷,实际我们还是要以展示具体指标为主要目的。平时的时候可以多看一下优秀的可视化大屏案例网站,也会对设计风格有良好的帮助。

    c31d873f7a45877a5ecb4c71cde8b3c3.png

    △优秀可视化网站—花瓣网

    d60322a2fa334e9dd6be5fe1dec68fe1.png

    △优秀可视化网站—亿信华辰官网

    数据是核心,场景是大数据呈现的承载体;场景使用具有金属质感的深青灰,符合理性的、冷静的、智能化产品的个性;数据色彩使用透明、发光、具有未来感的高亮色,和场景形成强对比,使数据更为突显、更具吸引力;为了强化客户对于风险的感知,通过颜色区分数据的风险等级,更直观的传达数据的含义。如:高风险的使用红色,红色让人联想到危险、警报。

    cda1ec9a3d2d5b211b4a8f17c64b42a0.png

    △大屏设计风格示例

    同时,亿信酷屏在进行大屏设计时,提供了十余套大屏模板以供选择,满足不同客户不同场景不同风格需求。

    8af811353b4223c6075a40965225b8bd.png

    7、可视化颜色搭配

    色彩是最能给人直观感受的,能够直接的牵引用户去寻找有效信息。整体色彩确定后,便运用色彩来划分信息的层级关系,用主色调强调重点内容,以引导用户能够清晰、明确、迅捷的识别重要信息。

    图表需要的颜色较多时,建议最多不超过12种色相。通常情况下人在不连续的区域内可以分辨6〜12种不同色相。过多的颜色对传达数据是没有作用的,反而会让人产生迷惑。

    8、动效设置

    整个项目中有许多数据都是实时变化的,为了减少数据变化刷新时的突然性,动效设计必不可少。在整个动效设计的过程中,除过场动画、数据的变化外,动效还肩负起增添空间感、平衡画面和整合信息的作用。 但是在增加动效的同时,仍需考虑服务器在承载大量数据涌入的同时,是否能够承载较多的动效,分析画面与数据量,对动效部分进行适当取舍。使动效不必喧宾夺主,明确画面中的重点进行展示。

    亿信酷屏内置炫酷动效,支持SVG特效和3D特效,支持钻取、联动等动态分析功能,提供专业化定制,打破可视化动效展示瓶颈。

    b32df0daa71bfa9f6b8007e0ef9c25f6.gif

    △酷屏大屏动效案例

    9、定稿

    终于来到激动人心的一步,定稿。因为我们在前几步已经分别确定了页面布局、图表类型、设计风格特点,所以这一步我们需要用尽可能简单的方法 ,把之前几步的成果在页面上快速体现出来。

    然后根据样图效果尝试确定五方面内容:

    1. 之前确立的布局在放入设计内容后是否依然合适;
    2. 确立的图表类型带入数据后是否仍然客观准确;
    3. 根据关键元素、色彩、结构、质感打造出的页面风格是否基本传达出了预期的氛围和感受;
    4. 已有的样式、数据内容、动效等在开发实现方面是否存在问题;
    5. 大屏是否存在色差、文字内容是否清晰可见、页面是否存在变形拉伸等现象。

    如果还有细节问题可以进一步调优。

    展开全文
  • 最近做个几个可视化大屏的设计,过程中踩了一下坑,也有一些经验和大家分享。当我们拿到一个可视化大屏的需求时,往往它是模糊的,所以我们可以通过Why、Who、Where、What等角度将需求明确。WHY首先我们要明确为什么...
    最近做个几个可视化大屏的设计,过程中踩了一下坑,也有一些经验和大家分享。当我们拿到一个可视化大屏的需求时,往往它是模糊的,所以我们可以通过Why、Who、Where、What等角度将需求明确。9e2f9b310daf500938c57999cfe30f23.pngWHY首先我们要明确为什么要设计可视化大屏,是辅助决策还是信息展示,如果是辅助决策我们可能要更多的去展示一下总结判断性的信息来辅助用户进行判断,更看重信息传达的有效性,如果是展示型大屏则更倾向于视觉表现。0cdeee7ebbeed4556e1458057fc09fa1.pngWho其次需要明确可视化大屏所针对的用户群是谁,有可能是领导、参观者、参赛选手等,这里的用户群并非单一的,有可能是多种类型用户的综合。bb6df926cc27a1902b62b4a5d5d26860.pngWhere然后我们要明确可视化大屏是要在哪儿在什么设备上进行演示,这里一定要明确清楚,因为设备的尺寸、受众距离大屏的距离都直接影响我们设计的布局、字体等。常见的显示屏尺寸一般为16:9的比例,但一定不能想当然的按照这个比例开展设计,我有一次就是没有明确设计载体的尺寸,4804*1920的超长屏按照16:9的比例进行的设计,结果做了很多无用功。9aaa0ecd8bbc4ffda090700a9fd594ec.pngWhat明确了前面三个问题之后,我们就可以思考可视化大屏的内容了,针对不同用途可以将其分为两个方面:产品本身的数据统计、支撑产品运行的后台的资源监测与管控。产品本身的数据统计可以从下载量、活跃度、用户画像以及内容分类等角度展现。这里要多参考需求方和开发人员的意见。c997a48efea6a4ef1c6ec65e3290e33c.png不同数据如何选择所使用得图表类型可以参照Andrew Abela整理的图表类型选择指南。b84c25d653207a042aae8285a9153a3d.pngHow在进行具体设计时可以利用Axure进行原型绘制,这里推荐一个很好用的元件库—Axhub Charts图表元件库,下载地址是https://axhub.im/。可以通过Axure的中继器对数据进行修改制作高保真的原型图,但可以修改的内容是十分受限的,一些复杂的图表也无法实现,这时我们可以利用Echarts等工具通过修改实例中的参数制作符合需求的原型图,具体也可以参照前端开发过程中所使用的工具。原型设计完成后先要和需求提出方以及开发人员等进行沟通,确定其符合需求且可行。待原型确定后再利用Sketch、Adobe XD或Adobe Illustrator等工具根据需要进行具体的视觉设计,还可以通过AE制作动态效果增强整体表现力。2825173991a2c94c57ed1c1c0f0d7f56.pngTips在进行大屏设计的过程中我选用Adobe XD进行设计图的绘制,在使用过程中有一点教训是慎用模糊工具与叠加模式。因为利用XD将使用了模糊效果的图形导出svg后,模糊效果会消失,如果导出png会出现模糊效果XD的预览效果不一致的问题。具有叠加效果的元素分别导出svg或png时,叠加效果会消失,前端使用效果很难与设计效果保持一致。所以可以更多的利用透明度和配色达成期望的视觉效果。从设计还原度的角度考虑最简单粗暴有效的方式是把所有背景图合成一张直接导出,不过这就会导致渲染的延迟,也有可能导致适配的问题,因此需要提前和开发沟通,寻求一个的平衡方式。bef25f92066e6acd7cd859266db20164.png一点想法对于可视化大屏的设计与实现通过传统的设计+开发的流程,所付出的时间成本还是很高的,对于不懂开发的设计师而言如果这方面的需求特别多或者比较感兴趣,了解一下常用的可视化工具还是很有必要的。以上内容全部基于维度较为单一的可视化分析,基本可以应对日常得可视化需求。对于多维复杂得可视化分析还是需要更多得专业知识,感兴趣的话也可以通过浙江大学陈为老师的《数据可视化》一书获得更加深入的了解。
    展开全文
  • V6.Dooring可视化大屏解决方案,提供一套可视化编辑引擎,助力个人或企业轻松定制自己的可视化大屏应用。 作者 :bust_in_silhouette: v6.dooring 网站: : : 表示支持 给一个 :star: 如果这个项目对您有帮助!
  • 对于大数据从业人员来说,可视化大屏可能是最能展现工作价值的一个途径。因为数据分析的最后成果就需要可视化展现出来,而可视化大屏这种直观的、炫酷的、具有科技感的方式,更能获得领导喜欢。那么领导到底想要看...
  • 大数据可视化是以大屏为主要载体的数据可视化展现。大屏数据可视化最大的特点就在于让用户最直观地感受复杂的数据,并且通过各种图像、图形来有效地表达出想要的效果。...那么大数据可视化大屏制作需要什么条件...
  • 基于Echarts的可视化大屏可视化监控管理,包含html+css+js+image
  • 20个炫酷的数据可视化大屏(含源码),很多小伙伴都非常喜爱。如果你感兴趣,点击上方获取即可。于是我产生了用 Python 的另外一种方式来实现数据可视化大屏的想法。参考上面这个模板,我计划用 pyecharts 实现一个...
  • 基于Echats的可视化大屏数据可视化demo,包含html+css+js+image+font
  • 可视化大屏实例

    2018-11-16 18:47:26
    可视化大屏完整实例,用echarts 实现图标,效果比较好,
  • 数据可视化或者叫大屏开发是近些年来比较热门的一个领域,通过使用前端技术可以实现各种又酷...全国XXXXXXXXX数据可视化大屏展示的一些特点1.面积巨大:用户站远才能看全内容(所以字也不能设计很小)2.深色背景:紧张...
  • 大屏可视化的设计尺寸定义,一直是很多设计师苦恼的一件事,很多时候大屏...大屏的类别及成像我们设计的可视化大屏通常可以分为两类:一类是拼接屏,由46-55寸的液晶显示屏拼接而成,有一定的缝隙;一类是LED屏无缝隙...
  • 基于Echarts的可视化大屏湖南省大数据可视化平台,包含html+css+js+image
  • 基于Echats的可视化大屏通用大数据可视化展示,包含html+css+font+js+image
  • 现在,可视化大屏的需求越来越多,不计其数的公司开始对于可视化这一块有了需求,殊不知哪天,你的领导就让你来给公司做一个可视化的大屏。因此!为了预防这种情况的发生,这时候就需要一款简介方便,易上手的工具来...
  • 不得不承认,人是比较抗拒枯燥数字的生物,用可视化方式呈现出来,会更易于接受、理解并记住。同时综合性的数据可视化一般会借助大屏、多屏的手段进行呈现。...也许也会有人说,数据可视化大屏就只是把数据展示的更...
  • 数据可视化大屏.zip

    2020-05-22 22:15:38
    新型冠状病毒期间,全国感染病例数据可视化大屏,可以下载下来学习一下,界面还是挺美观的。新型冠状病毒期间,全国感染病例数据可视化大屏,可以下载下来学习一下,界面还是挺美观的。
  • Echats可视化大屏经典案例
  • 本文作者详细介绍了可视化大屏的制作,我们一起来看一下。在当今社会中,互联网的飞速发展让我们逐步迈入了大数据的时代。“大数据”已经从一个概念性质的词语转变为了对经济社会各个领域都具有渗透影响的事物;并且...
  • 其实,这种逼格很高的镜头就是一个数据可视化大屏。如今在会议展厅、园区管理、城市交通调度中心、企业生产监控等重要场所,数据可视化大屏已经愈加彰显商业价值。 网络图片看起来高大上的东东都是比较难的,我们...
  • 这也导致了有一部分人认为可视化大屏已经成为一些政企单位的面子工程,锦上添花,可有可无。但一张合格的数据可视化大屏不只是效果酷炫,特效满满而已。数据可视化主要旨在借助于图形化手段,清晰有效地传达...
  • 数据可视化大屏是一个把复杂、抽象的大型数据,通过图形、图表、图标等易于理解的形式,加以视觉效果展示出的方式叫做数据可视化,用在数据统计、数据备份中心管理这些工作上。一方面利用酷炫的效果让人眼前一亮,...
  • QT可视化大屏看板,已经编译成功,可以直接运行
  • 数据可视化大屏是一个把复杂、抽象的大型数据,通过图形、图表、图标等易于理解的形式,加以视觉效果展示出的方式叫做数据可视化,用在数据统计、数据备份中心管理这些工作上。一方面利用酷炫的效果让人眼前一亮,...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,902
精华内容 1,160
关键字:

可视化大屏