linhuiw / blog Goto Github PK

论文

P4.pdf
P5_InfoVis19.pdf

P4 论文解读：

框架目标

• Performance: 运用GPU处理数据和渲染视图
  • Data processing & Rendering 图形绘制和通用计算
• Productivity: 声明式语法
• Programmability: 运行时处理用户定义逻辑
  • 为了提升用户交互的实时性，可以采用多线程并行处理的技术，分管不同的工作，保证系统不会阻塞。同时也可以使用增量可视化的形式，逐步呈现可视化结果。
• Portability: 基于浏览器平台(WebGL)

整体架构

整个系统包含四个部分：

• 程序接口部分：图中左上角。接受用户的输入，支持JavaScript调用或者JSON格式的设定，同时接收用户传入的结构化数据；
• 核心处理部分：图中右上角。处理用户输入或设定的数据处理逻辑与可视化编码，调用相应的函数或调用GPU程序生成模块生成Shader程序；
• GPU程序模块：根据用户定义的逻辑，在运行时控制生成对应的shader程序；
• GPU计算部分：调用WebGL相应API完成数据和程序到GPU的传入，控制GPU进行计算于渲染。

总结

• 该框架将主流可视化框架的表现力和 GPU 计算与渲染的高性能相结合，融合了两者的优势；
• 该框架核心功能运用 WebGL 绘制，而标记组件等非核心不见采用不同技术实现，降低了开发难度；
• 该系统架构采用Bottom-up的形式组装功能，以数据元操作为基础，逐步组装得到更高级的功能。

P5 论文阅读

为什么叫 P5? 渐进式可视化模型 Progressive

相对传统模型，在源数据之后，增加了数据划分的步骤。数据划分得到的部分结果，进入分析处理和可视化渲染的步骤，使用户可以快速得到可视化中间结果并与之进行交互。

系统架构

P5 扩展了 P4 的结构，P5使用执行控制器，根据用户的代码中列出的操作和选择的流水线模式，执行操作。P5提供渐进式数据加载模块，从数据源获得数据块并载入GPU中。积累着色器负责将数据块处理的结果与之前的中间结果进行累积，并将中间结果存入GPU中。

API

数据转换可以在batch和progress中指定数据转换的方法，group指定进行聚合的维度，include和exclude指定需要进行计算的属性，calculate指定进行的计算，如平均值、和以及计数。

可视化

在 facets 中，用户可以指定多视图的布局形式和每个视图对应的数据属性和可视化映射。支持分面

交互

用户可以指定不同视图的刷选、连接和高亮。在底层，系统会生成数据立方体和区域求和表，来加速交互结果的计算。

相关链接：

• P4: https://www.dazhuanlan.com/2019/10/07/5d9b0e5564f9a/ 
• http://vis.pku.edu.cn/blog/p5-infovis2019/ 针对交互式数据分析和可视化的便携渐进式并行处理流水线（P5: Portable Progressive Parallel Processing Pipelines for Interactive Data Analysis and Visualization）

理解数据漫画

URL：https://zhuanlan.zhihu.com/p/74152704
文章中对于数据漫画的方法论解析，还是非常让人叹为观止。非常方法论的方式，把数据漫画讲的很清晰。

带动效的蜂窝散点图

数据来源于美国1960-2014年间各个职业的收入分布情况。横轴代表收入水平，纵轴排列各种职业；同一职业收入类似的数据点互相挤压形成紧密的蜂窝状视图。这个视图能很好地展现不同职业的收入分布，而年份切换时的动画效果能清晰地展现出社会的变迁：贫富差距越来越大，特别是1960和2014间的对比，在1960年时各个职业的收入都基本接近正态分布，而现在“异常点(Outliers)”确越来越多了。
URL: https://flowingdata.com/projects/2016/income-occ/

信息处理的流程

https://www.youtube.com/watch?v=ouIFSDQwkQM

可交互的动态气泡图

3D 形式的 VR-Like 图表

网络可视化的基本原则

• 始于发问
  定义问题最为关键，为后续的每一步工作设定了明确目标。

• 寻找关联性
  可视化的一个核心任务就是用最简便的方式揭示关联性。
  选择两个核心元素-数据集和视觉表现技巧的时候，就需要关联性的问题。

• 实现多因素分析
  因果关系，后续还要考虑种种因素：变量相互影响、多诱因、多结果、因果顺序、误差、伪相关、测量误差、互斥变量等因素

• 考虑时间
  时间是变化最丰富的变量。不仅网状结构本身会发生改变，整个系统中的关联元素（信息、能量、水分、病毒）也会随着时间流逝而波动。

• 丰富词汇
  考虑更多的视觉属性：颜色、形状、大小、方向、材质、色调以及位置

  • 更多样化的节点
  • 有表现力的边线
  • 清晰的视觉语言：使用示例

• 呈现分组
  分组：将同类信息归入一个更大的范畴，加强关联性，降低复杂程度，提高辨认度。

  • 相似率(图形处理)
  • 相近率(空间组织)
  • 共同律(动态)

• 放大比例

  • 宏观视角(模式)
  • 关联视角(联系)
  • 微观视角(单个节点)
    

• 管理细节
  先概览、再放大过滤、最后看细节。
  渐进呈现(progressive disclosure) 概念

  • 自适应缩放
  • 全局加细节
  • 焦点加背景

• 原则之外
  一直以来，网络可视化都重视数学以及计算机算法，但是这些只是方法而已。我们应该更加重视结果的可用性、易用性，以便真正传递有用的信息。

图的种类

视觉语言

记录

蒙德里安：以几何图形的绘画为基本元素、非具象绘画的创始人之一。

用来记录最近读的内容

Dundas

Enhance Your Data Storytelling with Animated Charts: https://www.dundas.com/resources/dundas-data-visualization-blog/enhance-your-data-storytelling-with-animated-charts

Slideshows 

in Dundas BI you can tell stories with your data using Dundas BI’s native Slideshows feature. Slideshows in Dundas BI allow you to present insights using a series of live interactive data views that tell a logical business story using dashboards, scorecards or even notes right on top of your data visualizations. This is a great way to make your point, engage the users and encourage behavioral change by providing these informative views. You can go here to learn more on how to set up Slideshows in Dundas BI.

• Storytelling
• Large Screen Automated Displays

亮点功能：xml 图表的自动上传

Notes

Our patented note is a type of comment that users can make while viewing a dashboard. With notes you can:

• Post questions, comments and follow-ups directly on specific metrics or data points
• Request follow-up or action to be taken on specific areas of concern or opportunity
• Keep comments organized in a conversation thread
• Control who sees your comments
• Collapse and expand notes so they don't get in the way of the data
• Be notified by email when someone replies to your note

Animating your data - 动态图表

Logi Analytics 

是一家计算机软件公司，总部设在麦克莱恩，在英国和瑞典设有办事处。 它为商业智能和商业分析提供交互式的数据可视化产品。
自我定位是Embedded Analytics & Business Intelligence (BI） 嵌入式分析和商业智能(BI)

目标市场

• 中小企业，政府机构.(Logi Analytics supports small and medium sized businesses, government entities, and even Fortune 500 companies. Some selected markets include financial services, healthcare, consumer goods, and the technology sector.)
• 最常用于OEM或嵌入式BI用例（50％），其次是传统的，以IT为中心的报告（42％）。gartner

分析

• 好的
  • 嵌入式BI
    • Logi Studio
    • RESTful APIs (通过集成API的形式 直接修改)
  • 数据可视化 (缩放，联动，平移，过滤，钻取，自动分片)
  • 适用于所有规模
  • 完全可定制的样式(基于JQ....)
  • 有免费版
• 坏的
  • 上手成本高(写SQL)
  • 移动端体验差
  • 缺少讨论记录，实时用户协作，时间线标记注释，基于自动使用的内容推荐，以及允许用户评价（喜欢/不喜欢）内容和喜欢/关注特定用户的功能。Logi Suite提供与Twitter的集成，但不适用于更广泛使用的协作工具（例如Yammer）。
  • 不能自动设置属性

Drill Down and Drill Through

https://www.logianalytics.com/resources/bi-encyclopedia/data-storytelling/
https://www.logianalytics.com/designing-dashboards/expert-qa-best-practices-for-data-storytelling/

Borad

BOARD International S.A.是一家以其BOARD工具包着称的商业智能和企业绩效管理软件供应商。该公司总部位于1994年成立的瑞士基亚索和波士顿。尽管其核心市场仍位于欧洲，但BOARD International一直在向全球扩张，目前在全球15个国家/地区开展业务。

主打一站式的决策平台，在一个平台即可完成所有的分析、模拟、规划、预测和创建
桌面软件搭建，最终产出一个 webpage

Get depth of analysis at the speed of thought

When there is the need to dig deeper into data, Board provides a unique set of features that allow business users to quickly move from high level overviews to extremely detailed analyses, identifying the drivers behind changes, spotting the hidden patterns, and understanding the perspective trends.

Make your reporting event driven

Pyramid Analytics

Pyramid Analytics是一家数据分析软件公司，总部位于荷兰阿姆斯特丹。该公司提供了一个一级企业级分析操作系统，该系统可从单用户自助分析扩展到数千用户集中式部署，涵盖了从简单的数据可视化到高级的机器学习功能。不可知的“ Analytics OS”具有适用于任何设备和OS的通用客户端。

同时关注 data-science 和 data-analytics

可视化图表介绍：[https://www.pyramidanalytics.com/data-visualization-examples-in-pyramid?subid=7]

PRESENT

Data Story

Birst

没有发现 Storytelling 相关

Tableau 的数据故事

Example of Storytelling with Data Visualizations
https://public.tableau.com/profile/nick.mannon#!/vizhome/StroytellingExample/ExampleofStorytelling?publish=yes

交互式分析功能：
放大、缩小、重置轴、缩放区域、平移、矩形圈选、径向选区、套索选择

标注功能：
标记标签、添加注释、趋势线、标记线

相关研究小组

港科系
屈老师组
巫老师组
曹楠组
Panpan Xu, Bosch等
Weiwei Cui
Jian Zhao组, 伙伴Michael Glueck
北大可视化 Xiaoru Yuan
清华刘世霞 Shixia Liu
马里兰
Ben Schneidermann, Fan Du等
Niklas Elmqvist组
UW组 Jeff Heer
马老师组 Kwan-Liu Ma
ASU组 Ross Maciejewski
Tamara Munzner
Miriah MeyerBongshin Lee, Natalie Henry Riche, Jessica Hullman
MSR data-driven storytelling
MSR visualizing networks/graphs,
MSR Visualization for machine teaching
Klaus Mueller组, 解聪
Han-Wei Shen
Minsuk Kahng (GAN lab), Kanit Wongsuphasawat (TensorFlow Graph Visualizer)
Havard Visual Computing Group, NLP (LSTMVis, seq-to-seq vis)
Andrienko组
Tobias Schreck组
Enrico Bertini组

图书类

Fundamentals of Data Visualization - Claus O. Wilke

总结可视化基础知识以及大量可视化实验的基础书籍，在线开源。
https://serialmentor.com/dataviz/index.html

博客类

● 北京大学可视化与可视分析博客： http://vis.pku.edu.cn/blog/
● 浙江大学可视分析小组博客: https://zjuvag.org/blog/

交互式构建图表，优势在于布局和数据绑定

优势

定制的图表更具表现力，可以根据传递的数据进行细节的设计

传统工具的问题：

1. 手动设置数据和属性的映射，比较低效；
2. 可以用可视化的库编写代码实现，但是用户需要有较高的编程技能；
3. 可视化构建工具，提供的布局方式有限或者提供的布局构建的交互不够方便。

设计原则

Charticulator的设计遵从如下的原则：

将布局作为有意的设计选择
使用部分规约（partial specification）构建布局
平衡直接操作和通过面板设置的交互方式

Charticulator的约束包括多个层次

图表层次的约束：绘图区块、图例、参考线等的位置约束关系
绘图区块中的约束：不同图标之间的位置约束关系
图标层次的约束：图标中不同元素之间的约束关系
标记内在的约束关系：如对于长方形，它的左右坐标、中心的横坐标以及宽度这4个变量，只有2个是自由变量

连接建立

• 数据序列
• 多个绘图区块对应的相同数据项之间
• 额外指定的边数据

元素组成

图形语法的概念透出

• Layout Composition
  

• Sub-layouts
  

• Coordinate Systems 坐标系统
  

想法

• 独立的服务，类似于 chartMaker 的方式
• 核心在于使用数据绑定的方式，丰富图表的丰富度。
• 不是使用预设的图表，而是针对图形得数据绑定，预设的图表表现力不足

探索性分析和解释性分析

探索性分析，主要指理解数据，并找到其中的精华
解释性分析，给出解释、洞察和归因，解释性的分析和沟通

选择有效的图表

1. 直接使用数据本身，使用简单的文本，或者带数据表达的文本

2. 表格的视觉表达，应该让边框融入背景，或者干脆去掉边框，突出数据而非边框。

3. 表格可以用视觉暗示指引的表格，热力图来表达数据

4. 图表类型

   1. 点图

      1. 散点图

   2. 线图： 标准折线图、斜率图

      1. 折线图上展示置信区间
      2. 

   3. 条形图

      1. 竖直条形图、直方图、堆叠竖直条形图、瀑布图、水平条形图、堆叠水平条形图

   4. 面积图

      1. 方形面积图

5. 需要避开的陷阱

   1. 饼图：不要使用3D，而且饼图难以阅读。
   2. 永远别用 3D 图形
   3. 双 Y 轴，总之不是一个好主意
   4. 
   5. 

6. 关于信息图

   1. 信息图通常包括尺寸过大、过分装饰的数字以及卡通化的图形。这样的设计有一定的视觉吸引力，能够讨好读者。再多看几眼，信息图就显得很浅薄，无法让有辨别力的受众满意。
   2. 优秀的数据可视化方案，不仅仅是指定主题的事实堆积，而是要讲述一个故事。

杂乱是你的敌人

• 应该尽量多地将墨水花在数据上，也可以成为最大化信噪比
• 循序渐进地去除杂乱
  • 去除图形边框
  • 去除网格线
  • 去除数据标记
  • 清理坐标轴标签
  • 直接标记数据
  • 保持颜色一致

聚焦受众的视线

• 前注意属性，能够让受众不知不觉地看到我们期望展现的内容

• 

• 图表中的前注意属性

  • 解释性分析，利用图表与受众分享信息，深思熟虑地使用颜色和文字是聚集于故事的一种方法
  • 利用颜色，建立信息的视觉层次
  • 首先将一切融入背景，然后使数据更突出
  • 少量使用数据标签有利于吸引注意

• 颜色

  • 少量使用颜色
  • 

像设计师一样思考

• 突出重要的内容
  • 消除干扰
  • 建立清晰的信息层次
• 文字是你的朋友
  • 文字在数据沟通中的作用：标签、简介、解释、强调、突出、推荐和讲故事
• 故事的设立
  • 失衡 - 平衡 - 解决的思路，称之为『现状与演变的冲突』，如果数据值得沟通，那就值得花费必要的时间将其套入故事。
    • 设定：故事发生在何时何地？
    • 主角：谁在驱动情节的发展？
    • 失衡：为什么冲突是有必要的？发生了哪些变化？
    • 平衡：你希望看到发生什么？
    • 解决：你会如何带来变化？

案例研究

• 避免『意大利面』式的图表策略
  • 意大利面图就是折线图中的线条有很多重叠，使得很难一次关注一根线条。 原因是看起来像某人拿了一些没煮过的意大利面丢在了地上，它们的信息量也和随意的面条一样。
  • 一次只强调一条线
  • 空间隔离（分面）
  • 混合 空间隔离 和 一次只强调一条线
• 饼图的替代方案
  • 直接展示数字
  • 方案2：简单条形图
  • 方案3：100% 水平堆叠条形图
  • 方案4：斜率图