cesium - 尝试使用 CesiumJS 为实体添加阴影

问题描述

我试图在我的重播中添加一个“影子”，但我不确定是否应该将其命名为“影子”。

请看我的屏幕截图，您可以在每个实体下方看到一个红色阴影（我在其中设置点以突出显示我正在寻找的内容）

你可以在https://ayvri.com/scene/z15y96gzjx/ck43xpxd500013e5ra7dh6s8e上看到它

我确实尝试找到有关此功能的文档，但到目前为止，我还没有找到。沙堡也不行。

我想我需要添加粒子来添加一种尾巴，但我什至不确定这是否是正确的研究方向。

谢谢你的帮助！

编辑2：要清楚地看到我需要重现的内容，您还可以查看此屏幕截图。在白色轨迹下方，您可以看到从轨迹开头开始的红色渐变（从不透明度 0 到 1）。

标签： cesium

正如我所承诺的，有一个使用地面示踪剂的工作示例：

 var viewer = new Cesium.Viewer('cesiumContainer', {
  scene3DOnly : true,
  shadows : true,
  timeline: false,
  terrainShadows : Cesium.ShadowMode.ENABLED
});
var terrainProvider = Cesium.createWorldTerrain();
viewer.terrainProvider = terrainProvider;


//---------------------- Start position of the plane ---------------------------
var startLongitude = -123.0744619, startLatitude = 44.0503706;
viewer.camera.flyTo({destination: Cesium.Cartesian3.fromDegrees(startLongitude, startLatitude, 900)});


//--------------------------- CREATE A PLANE ENTITY ----------------------------
var plane = viewer.entities.add({
  //   position: new Cesium.Cartesian3.fromDegrees(startLongitude, startLatitude, 600),  
  model : {
    uri : '../SampleData/models/CesiumBalloon/CesiumBalloon.glb',
     minimumPixelSize : 128,
        maximumScale : 20000,
    color : Cesium.Color.BLACK.withAlpha(0.5),

  }
  });


//------------ Array of (time, position) samples along the plane route ---------
var airPathArray = [];
//------------ Array of the points of the ground path under the plane ----------
var groundPathArray = [];


//------------ Initialize arrays ----------

  var timeNow = new Cesium.JulianDate.now();

  airPathArray.push({time: timeNow, degrees: {longitude: startLongitude, latitude: startLatitude},
                       position: new Cesium.Cartesian3.fromDegrees(startLongitude, startLatitude, 600)});
  groundPathArray.push(startLongitude);
  groundPathArray.push(startLatitude);


//----------- Every 1 second a new point on the plane route is created ---------
var pathHandler = setInterval(function(){
  var timeNow = new Cesium.JulianDate.now();
  //timeNow = Cesium.JulianDate.addSeconds(timeNow, 2, new Cesium.JulianDate());
  // At start it takes initial coordinates



  // New next point coordinates are randomly taken

    var lon = airPathArray[airPathArray.length - 1].degrees.longitude + 0.0005 * (1 - Math.random());
    var lat = airPathArray[airPathArray.length - 1].degrees.latitude + 0.0005 * (1 - Math.random());
    airPathArray.push({time: timeNow, degrees: {longitude: lon, latitude: lat}, position: new Cesium.Cartesian3.fromDegrees(lon, lat, 600)});
    groundPathArray.push(lon, lat);
  // The maximum number of the route points is fixed
  if(airPathArray.length > 3){
    airPathArray.shift();
    groundPathArray.shift();
    groundPathArray.shift();
  }
  // The updated route is ready for visualization
  viewRoute();
}, 1000);


// Route visualization
function viewRoute() {
   // console.log(airPathArray[0].position);
  var trace = new Cesium.SampledPositionProperty();
    for(var i = 0; i < airPathArray.length; i++) {
    trace.addSample(airPathArray[i].time, airPathArray[i].position);
    }
  plane.position = airPathArray[0].position;
  //plane.position.setInterpolationOptions({
  //  interpolationDegree : 1,
  //  interpolationAlgorithm : Cesium.LinearApproximation
  //});
  plane.orientation = new Cesium.VelocityOrientationProperty(trace);
}


//------------------------ CREATE A GROUND PATH ENTITY -------------------------


function updatePositions() {
    var positions = new Cesium.Cartesian3.fromDegreesArray(groundPathArray);
    return positions;

}


var goroundPath = viewer.entities.add({
  corridor : {
    width : 50.0,

    material : Cesium.Color.BLUE.withAlpha(0.5),
    positions: new Cesium.CallbackProperty(updatePositions, false)
  }
});

cesium - 尝试使用 CesiumJS 为实体添加阴影

问题描述

解决方案

推荐阅读