cesium计算平滑贴地路径 polyline插值 path贴地

最新推荐文章于 2026-08-03 11:28:27 发布

原创最新推荐文章于 2026-08-03 11:28:27 发布 · 5.1k 阅读

13 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端，cesium，gis

本文介绍了在Cesium中如何通过path和polyline结合，实现平滑且贴地的路径效果。首先，利用path的setInterpolationOptions方法设置插值算法以生成平滑曲线，然后获取path的插值后位置并存储到数组中。最后，使用这些位置创建一个具有clampToGround属性的polyline，使其能够贴地显示。这种方法为在3D地球场景中展示动态轨迹提供了有效解决方案。

1, 通过选择地球上的点，生成平滑且贴地的路径，但是发现polyline可以通过clampToGround: true属性贴地，path没有贴地属性，path可以通过

entity.position.setInterpolationOptions({

        interpolationDegree : 5,

        interpolationAlgorithm : GeoVis.LagrangePolynomialApproximation

      });

设置插值算法，形成平滑曲线，polyline不可以。

2，解决办法: 可以先利用path获取插值后的position，然后把这个position赋值给polyline，再设置贴地：

这个是利用path获取插值后的position代码：

cumputePosition（）{

var paths = viewer.entities.add({

        position: positionProperty,

        path: {

          resolution: 1,

          material: new GeoVis.PolylineGlowMaterialProperty({

            glowPower: 0.1,

            color: GeoVis.Color.YELLOW

          }),

          width: 10

        }

      });

      paths.position.setInterpolationOptions({

        interpolationDegree: 5,

        interpolationAlgorithm: this.interpolation()

      });

      var newPosition = [];

      for (var now = startTime; now < endTime; ) { // 这个startTime和endTIme都是你自己规定的JulianDate

        var posi = paths.position.getValue(now);

        var pos = new GeoVis.Cartesian3(posi.x, posi.y, posi.z);

        newPosition.push(pos); // 把所有的坐标放到newPosition数组中

        now = GeoVis.JulianDate.addSeconds(now, 1, new GeoVis.JulianDate());

      }

      viewer.entities.remove(paths);

return  newPosition

}

这个是将绘制polyline贴地的代码：

var lastPosition = this.cumputePosition();

      polyline = earth.entities.add({

        position: lastPosition,

        polyline: {

          clampToGround: true,

          positions: lastPosition,

          material: new GeoVis.PolylineGlowMaterialProperty({

            glowPower: 0.1,

            color: GeoVis.Color.YELLOW

          }),

          width: 10

        },

      });