Skydive

实时网络拓扑分析器
overview.gif
by @步茗Neo(neowang)

deck.gl Technical Deep Dive

deck.gl Technical Deep Dive,一份来自 deck.gl 官方的技术分享 PPT
https://docs.google.com/presentation/d/1qtXUQzMuIa8NYIKUa1RKfSwvgpeccY-wrPrYqsb_8rE/edit#slide=id.g7db7fb98fb_0_207
从性能、子系统、图层和调试四个方面介绍了目前 deck.gl 使用到的一些技术实现细节。
例如使用 WebGL 2 TransformFeedback 实现的 GPU-based 动画,左图展示了三种坐标系下的流畅切换效果。再比如在 GPU 中进行投影计算(我之前写过一篇介绍该方法的文章https://zhuanlan.zhihu.com/p/57469121),右图展示了海量数据下流畅的缩放效果。
attribute-transition.gifdeck.gl-0.gif

希望以后我也能写出这样高质量的技术分享 PPT。

另外 deck.gl 的 JS 和 native 版未来都会基于 WebGPU 实现。目前 deck.gl 的 iOS 版本已经基于 Dawn (WebGPU 的 C++ 实现) 开发测试。WebGPU 作为可以跨现代底层渲染 API (Vulkan、Metal、D3D、OpenGL)的 backend,基于它开发的好处是显而易见的。
https://medium.com/google-earth/cross-platform-geospatial-visualization-with-deck-gl-native-56154b95b54b

The JavaScript version of deck.gl will inevitably move from WebGL to WebGPU, so having both C++ and JavaScript work against a common 3D API will significantly increase the ease of aligning the JavaScript and C++ code bases.

最后 Node 端和浏览器端也可以使用 WebGPU 配合 DirectX Raytracing。未来在浏览器里做光线追踪不是梦。https://github.com/maierfelix/webgpu
by @沧东(cangdong)

Multiscale Snapshots: Visual Analysis of Temporal Summaries in Dynamic Graphs

image.png
Multiscale Snapshots 是一种半自动视觉分析方法,提供了动态图中结构和时间变化的多尺度概览。本文将时间层次抽象与无监督图学习方法结合起来,以识别相似的演化图。

动态图方面已有的研究工作:

  • Dynamic Graph Analysis and Visualization:以前做动态图分析和可视化,经常用的方法是将动态图显示为动画、时间轴和混合可视化,提出了将自动分析方法与交互式可视化相结合的可视化分析方法,以减少显示的数据并突出显示结构变化;
  • Visual Analytics of Dynamic Graphs:动态图的可视化分析是把图分析方法与可视化技术无缝集成,以交互式分析不断发展的结构特性,经常用抽象方法,数据空间抽象减少了图形元素或时间步的数量;
  • Multiscale Dynamic Graph Visualizations:多尺度动态图可视化方法都集中在特定时间尺度上的动态图分析,并且需要手动定义参数。

Multiscale Snapshot
该可视化系统提供了大规模动态图的更高级别和更细粒度的时间间隔的概述,通过在交互式多尺度可视化中集成时间抽象和图形嵌入,该方法降低了数据的复杂性。该系统由三部分组成:

  • 将时间维度转换为 snapshot 层次结构,将动态图的子集汇总为重叠的多尺度间隔;
  • 通过将不断发展的拓扑的嵌入向量表示中来降低 snapshot 的复杂性;
  • 将抽象的时间数据转换为交互式分层可视化,并支持必要的交互以及导航方法,以可视化方式分析不断变化的图结构。

Temporal Hierarchical Snapshots
image.png
Multiscale Dynamic Graph Index
多尺度动态图指数,学习所得的分层 snapshot 并将其嵌入到低维空间中,以降低图的复杂性并加快分析任务。
image.png

Multiscale Snapshots Visualization
image.png
应用可视化映射以多尺度可视化形式组织时间 snapshot,以对生成的 snapshot 进行可视化分析,并将图形嵌入用于分析任务。
by @聚则(moyee-bzn)

各国新冠随时间发展折线图

由于 G6 最近在发展时序图场景,所以主要关注了这个可视化的时间轴设计,即可以选择一个时间点,也可以看一个时间区间的趋势,还可以播放。

自动播放线性增长图:
linear.gif

把两个控制点移到同一个位置,就是显示这一个时间点的数据(但这里的交互不大好精确调整两个控制点到同一位置):
image.png

区域选择:
period.gif
by @十吾(shiwu-5wap2)

How Shenzhen became China’s Silicon Valley

曾经的小渔村深圳仅仅用了 40 年,就将自己变成了重要的科技中心。并且在这个过程中,它已经超越了邻居香港。
从 1979 年到 2019 年,深圳的国内生产总值增长到了 2.69 万亿元人民币(约合 3900 亿美元)。在 2018 年,深圳的 GDP 为 3700 亿美元,而香港为 3600 亿美元,这意味着深圳经济首次超过香港。
image.png
深圳的 GDP 甚至和世界上不少地方的年度 GDP 差不多。
image.png
外国投资推动了深圳早期的经济发展,其中大部分资金来自香港。
image.png
近年来,深圳的进出口主要都是由迅猛发展的高科技企业推动的。
image.png
深圳的消费市场非常庞大。
image.png
中国正试图调整法律,使科技初创企业更容易上市。十年前在深圳推出的类似纳斯达克(Nasdaq)的创业板,拥有 807 家公司,总市值达 6.78 万亿元人民币(9580亿美元)。
Kapture 2020-09-06 at 10.07.44.gif
深圳高新技术产业开发区成立于 1996 年 9 月,2018年,高新技术产业园对深圳 GDP 的贡献占比为 34%。
image.png
下图是根据 2009-2015 年深圳高新技术产业园区的政府官方文件绘制的产业分布地图。
image.png
从下面这张图中我们可以很容易看到深圳和香港的房地产行业对 GDP 的贡献率。
image.png
香港和深圳超过 300 米高的建筑数量如下图所示:
image.png
2018 年至 2020 年间,全球共有 34 座 300 米以上高度的建筑竣工。其中一半以上在中国。
image.png
下图是近 40 年来,深圳和香港 100 米以上的高楼数量的演变图。可以看到整个城市的发展速度是十分惊人的。
Kapture 2020-09-06 at 21.27.54.gifby @珂甫(pddpd)

Buddience

这是奈良大学的关于佛像研究的可视化项目。该项目和日本的82个寺庙合作,使用微软的 Emotion API 鉴定了216尊佛像,分析佛像的面部表情。
image.png
image.png

用户还可以上传自己的照片,找到与自己“结缘” 的佛像,即与对照片对应应匹配的佛像表情状态。
image.png

该项目将每个佛像的面部表情细化为 愤怒、鄙视、厌恶、恐惧、喜悦、中性、悲哀、吃惊 八个维度。Emotion API 会为每种佛像生成每个维度数据的平均值。可以从面部表情读取的数值数据根据佛陀的角色的不同,从而通过佛像的类型估计表情特征。
image.png
by @缨缨

Every Mother Counts-产妇保健可视化

Kimly Scott使用Tableau创作的具有人文关怀的信息可视化作品,介绍了全球产妇保健的现状。

怀孕和分娩对婴儿和母亲都是危险的。如果我们观察孕产妇死亡率的长期趋势,即妇女死于与妊娠有关的原因的可能性,那么我们会发现,每出生100到200名婴儿都可能会导致一位母亲死亡。

医疗保健,营养和卫生状况的改善意味着今天孕产妇死亡的情况越来越少。但是众多女性仍然死于与怀孕有关的可预防的原因。
世界卫生组织估计,每年有300,000多名妇女死于与怀孕相关的原因。产妇死亡在较贫穷的国家更为普遍,如果所有地区都达到欧盟的医疗保健和生活水平,那么产妇死亡人数将会减少95%以上。
FireShot Capture 016 - #IronViz 2020 - Every Mother Counts - Exploring Maternal Health - Kim_ - public.tableau.com.png
by @顾己(esora)