Loading...
墨滴

张春成

2021/10/01  阅读:45  主题:默认主题

等高线图

等高线图

等高线图,又称为等势线图, 是对样本点的场的势面进行可视化的制图方法。

数学上,等高线图需要根据边界条件, 对连续函数进行求解。 但由于实际上并不可行, 因此本文提供一个的生成式的离散逼近方法。


场,是个神奇的东西。 抽象来说,在二维空间中,一个场可以用简单的连续函数来表达

我们可以以样本点为基础, 构造对与之匹配连续场, 并对这个“场”进行可视化

【这是一段棒到不行的视频】

视频中,

  • 上图表示已知的样本点,颜色代表强度,位置代表位置;
  • 下图表示根据这些样本点构成的连续场。

实现代码可以移步我的可视化代码笔记本[1]

连续场是一个数学概念, 而观测样本是求解这个微分方程的边界条件, 或者叫边界条件。

场的连续性

数学上讲,我们希望构造这样一个场, 它处处可微

二者均存在且不为

场的边界条件

连续函数的数量甚至不是可数的, 所以不能随便拿来一个就用。 而是要找到一个合适的连续函数。

具体来说, 为了达到绘制等高线图的目的, 我们需要以观测到的样本点为边界条件。 满足两点

其中, 代表观测到的样本位置, 代表观测值。 而微分为零这个条件, 是为了保证得到的连续场能够有效表达这些样本。

场函数的一种生成式估计方法

问题是,即使是这样, 我们还是无法唯一地确定这个场的连续函数。

但所幸我们可以采用一个生成式的方法, 从而使用计算机图形学方法构造出一个满足要求的场函数。

该方法可以分为以下步骤:

  1. 构造样本点的Delaunay图;
  2. Delaunay图中三角形的重心插入原图,实现高阶扩展;
  3. 根据扩展后的Delaunay图,生成网络坐标系。该坐标系中所有点的值是根据重心坐标[2]进行插值而得;
  4. 根据网络坐标生成最终的等高线场[3]

演化过程如下图所示

Samples 上图为原始样本的Delaunay图。

Contour Order-1 上图为扩展一次的Delaunay图。

Contour Order-2 上图为扩展两次的Delaunay图。

Contour Order-3 上图为扩展三次的Delaunay图。

Final Contour 最终得到的图为比较满意的Delaunay图和Contour图。

可以看到,随着扩展次数的增加, 连续函数的逼近效果越来越好。

参考资料

[1]

可视化代码笔记本: https://observablehq.com/@listenzcc/contour-for-discrete

[2]

重心坐标: https://github.com/mikolalysenko/barycentric

[3]

等高线场: https://d3js.org.cn/document/d3-contour/

张春成

2021/10/01  阅读:45  主题:默认主题

作者介绍

张春成