OpenLayers 5 使用turf.js渲染克里金插值计算的等值面

之前Trojx同学实现了一个克里金插值渲染等值面的例子，使用的是kriging.js内置的绘图函数，然后在openlayer中利用ImageCanvas渲染。

这个方法比较简便，但是有一些性能上的问题：

• 网格切分比较小的时候，总体的网格数增加，每次重新渲染都要将整个网格数组遍历一次，交互体验不是很好；
• 网格是以方块的形式呈现的，视觉效果不如曲线和多边形。

我使用了turf.js来处理网格数据，生成等值面，提升了交互性能，效果也更好看一点：

下面是源码：

再次对

Trojx

表示敬意，感谢他之前创造性的工作。