Cesium专栏-克里金插值

关于克里金插值

小专栏下有一篇文件已经详细介绍了 xiaozhuanlan.com/topic/50643…

效果图

温度数据

示例数据，主要有城市的经纬度和温度数据就可以，格式自定。

具体做法

• 将地球定位到中国

  Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees(73.0, 3.0, 135.0, 53.0); viewer.camera.flyHome(5);

• 加载中国边界geojson图层

  viewer.dataSources.add(Cesium.GeoJsonDataSource.load('./bounds.geojson', { stroke: Cesium.Color.HOTPINK, fill: Cesium.Color.PINK.withAlpha(0.1), strokeWidth: 1 }));

• 预处理温度数据

  var n = tempture.length; var t = []; var x = []; var y = []; for (var i = 0; i < n; i++) { t.push(tempture[i].properties.Temperatur); // 权重值 x.push(tempture[i].geometry.coordinates[0]); // x y.push(tempture[i].geometry.coordinates[1]); // y }

• 使用gaussian、exponential或spherical模型对数据集进行训练，返回variogram对象

  var variogram = kriging.train(t, x, y, "exponential", 0, 100);

• 使用刚才的variogram对象让插值范围内的格网元素具备预测值

  var grid = kriging.grid(bounds, variogram, 0.05);

• 将得到的格网grid渲染至canvas上

  kriging.plot(canvas, grid, [73.4766, 135.088], [18.1055, 53.5693], colors);

• 使用SingleTileImageryProvider加载插值图

  function returnImgae() { var mycanvas = document.getElementById("canvasMap"); return mycanvas.toDataURL("image/png"); } var temptureLayer = viewer.imageryLayers.addImageryProvider(new Cesium.SingleTileImageryProvider({ url: returnImgae(), // 将canvas转为图像 rectangle: new Cesium.Rectangle( Cesium.Math.toRadians(73.4766), Cesium.Math.toRadians(18.1055), Cesium.Math.toRadians(135.088), Cesium.Math.toRadians(53.5693) ) })); temptureLayer.alpha = 0.4 // 设置透明度

link==>