柏林画廊作品可视化

来自柏林画廊的数据可视化实验: https://uclab.fh-potsdam.de/hausmann/index.html

这个项目是将柏林画廊里的所有作品的关系做了可视化的组织,项目提供了包括关系视图、时间序列视图等多种方式让用户可以分析化作在不同画廊之间的流转


image.png


tutorial_perspektiven.gif



tutorial_timeline.gif

by @镜曦(jingxi.lp)


可视化中的一些约定和规则:一个柱形图的实例


image.png


文章首先展示了上方柱形图,它通过展示不同种族不同性别的人们的政治倾向,并得出结论Z世代男性白人比较特别,他们更多是共和党人或者倾向共和党。在这个可视化作品中,有没有违背可视化设计的基本约定规则的地方呢?

1) 第一个问题是数据错误,这是硬伤,在左下方的男性白人中,三个柱子的数据加起来是大于100%的:42%+28%+48%,这个必须得修正

2) 第二个问题是颜色的使用:违背了“尽可能的使用自然的颜色映射”,具体在这里,讲到美国政党,大众默认使用的颜色就是红蓝,红色为共和党的代表色,蓝色则是民主党的代表色,如红州和蓝州,中立的则可以使用白色等

3) 第三个问题是图例的位置和顺序:首先图例因尽可能在图表上方(用户在阅读图形之前就需要知道图例颜色的意义),另外图例的顺序和柱子的顺序应该一致,这里柱子顺序从左到右是民主党到中立到共和党,那图例的顺序也应该保持一致

最后,作者给出了改进后的作品(数据错误还需要修复):

image.png

by @翎刀(zqlu)


Graph visualization UX: How to avoid wrecking your graph visualization

直到最近,几乎没有人能看到数据中的连接关系。早期的图可视化工具都不灵活且令人费解,将对图的洞察限制在很小的受众中。

虽然现在可用的优秀的类库、工具包很多,但即使使用最好的工具包,也可能构建不出那么好的应用。


image.png


幸运的是,如果我们遵循一些图可视化 UX 的技巧,就可以构建出美观、实用和直观的图可视化应用。


UX or UI ?

小孩子才做选择,大人都要。


构建图可视化的技巧

by @聚则(moyee-bzn)


图解各省志愿湖北医疗队信息

from 南京艺术学院设计学院


江苏省支援人数最多,山东支援批次最多。

image.png

by @十吾(shiwu-5wap2)


Data Explorer

Mapbox 推出的一个轻量可视化工具 Data Explorer,不需要任何代码基础,直接用浏览器打开,将 CSV/GeoJSON/KML/SHP 等多种格式的数据拖拽上去,就可以在地图上做数据的可视化了。

20191025201733.jpg

整体来讲这个工具也是刚刚发布,功能还比较基础,新手入们确实是一个非常简单易用的工具,相比uberkepler还有很大差距。地理可视化工具简单化,平民化确实是很大的趋势。

by @ThinkGIS(xiaofengcanyue)


How People Meet Their Partners

“那你们两个怎么见面?”总会有一个故事,但人们遇到的一般方式通常都是相似的。 他们通过朋友见面。 他们在教堂见面。 他们通过应用程序相遇。 使用How Couples Meet and Stay Together数据集,我们可以看到最常见的方式。

Img02.png

Img03.png

by @乌诺(wunuo)


柏林噪声

介绍一下柏林噪声(perlin noise)。

柏林噪声是Ken Perlin 发明的自然噪声生成算法


后面被主要的用在计算机图形学中模拟随机场景。例如地形,波纹等等。


生成噪声最通常的想法是为每个像素赋予一个随机的灰度值,


但这样生成的噪音不够真实。


perlin在1985年指出,一个理想的噪声应该具有以下性质:


对旋转具有统计不变性;

能量在频谱上集中于一个窄带,即:图像是连续的,高频分量受限;

对变换具有统计不变性。

perlin指出了一种符合上述性质的噪声生成算法(现学现卖,不对请指出):


1.考虑在宽为w,高为h的噪声画布下,取所有整数点,为他们随机赋有效值a(0-1),梯度值b(0-1)。


2.对画布内的所有像素点进行赋值,若该点位于整数点,该点噪声值为a,若不为整数点,对其进行平滑插值计算:


找出该非整数点周围的四个整数点(x0,y0),(x0+1,y0),(x0,y0+1),(x0+1,y0+1)。x0距x轴距离dx,y0距y轴距离dy。


根据perlin给出的缓和曲线


(原始版)


(更新版)


将dx,dy带入缓和曲线得到sx,sy。


对(x0,y0)与其梯度b0做点乘,得到起点u,再对(x0+1,y0)做点乘,得到终点v,以u、v为两端,sx为系数,线性插值得到m。(x0,y0+1),(x0+1,y0+1)同理得到n。


以sy为系数对m、n做线性插值得到val,即为该点的噪声值。


对与二维场景,需要做三次插值才能求出该点的噪声值,而对于三位场景,则需要7次,插值次数随纬度的提升而指数提升。


对于更为复杂的自然场景,还可以使用分型噪声来进行模拟,分型噪声的原理实际上是对多重柏林噪声的叠加。


perlin原文:https://mrl.nyu.edu/~perlin/paper445.pdf


by @清泉(qingquan)