So definieren Sie den Eigenschaftstyp in SampledProperty in Cesium

Question

Ich benutze Cesiumjs, um ein Polygon zu erstellen, das sich um ein Gebiet bewegt.

Um seine Bewegung zu zeigen, habe ich versucht, eine sampledProperty von PolygonHierarchy zu erstellen. Jedes Beispiel ist ein Array von Cartesian3 Positionen (drei Endpunkte meines Polygons in jedem Zeitschritt).

Ich muss den Typ der property kennen, die ich in sampledProperty verwende, wie es in Cesiumjs Website erwähnt wird: Cesiumjs.org/SampledProperty.

Aber ich weiß nicht, wie man es definiert und ich konnte keine Erklärung auf der Web site finden, wie man Eigenschaftstyp besonders wenn jede Probe für sich eine Reihe Eigenschaften kennzeichnet.

Answer 1

SampledProperty funktioniert hier nicht, da es versucht, zwischen den Punkten, die Sie ihm gegeben haben, reibungslos zu interpolieren, und es nicht weiß, wie eine Polygonhierarchie interpoliert wird.

Stattdessen können Sie stattdessen TimeIntervalCollectionProperty verwenden. Der Unterschied besteht darin, dass diese Eigenschaft nicht durch Interpolation, sondern durch Schritte animiert wird. Daher muss die Eigenschaft nicht wissen, wie die Zwischenwerte zwischen den Kontrollpunkten erstellt werden.

Ich habe eine kleine Demo gemacht, um zu zeigen, wie das mit einer Polygonhierarchie funktioniert. Klicken Sie unten auf Run Code Snippet, oder kopieren und fügen Sie nur das JavaScript in Sandcastle ein.

var viewer = new Cesium.Viewer('cesiumContainer', { 
 
    navigationInstructionsInitiallyVisible: false 
 
}); 
 

 
// Set up a limited range of time for this demo. 
 
var time = Cesium.JulianDate.fromIso8601('2016-04-08T12:00:00Z'); 
 
viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; 
 
viewer.clock.startTime = time; 
 
viewer.clock.currentTime = time; 
 
viewer.clock.stopTime = Cesium.JulianDate.addSeconds(time, 20, new Cesium.JulianDate()); 
 
viewer.clock.multiplier = 1; 
 
viewer.timeline.updateFromClock(); 
 
viewer.timeline.zoomTo(time, viewer.clock.stopTime); 
 

 
// Construct a TimeIntervalCollection showing the changes to the hierarchy over time. 
 
var hierarchy = new Cesium.TimeIntervalCollectionProperty(); 
 

 
for (var i = 0; i < 40; ++i) { 
 
    var nextTime = Cesium.JulianDate.addSeconds(time, 0.5, new Cesium.JulianDate()); 
 

 
    // Inside the loop, per iteration we add one window of time for this polygon. 
 
    hierarchy.intervals.addInterval(new Cesium.TimeInterval({ 
 
     start: time, 
 
     stop: nextTime, 
 
     isStartIncluded : true, 
 
     isStopIncluded : false, 
 
     data : Cesium.Cartesian3.fromDegreesArrayHeights([-108.0+i/4, 35.0, 100000, 
 
                  -100.0+i/4, 35.0, 100000, 
 
                  -100.0+i/4, 40.0, 100000, 
 
                  -108.0+i/4, 40.0, 100000]) 
 
    })); 
 
    
 
    time = nextTime; 
 
} 
 

 
// Create the polygon, using the animated hierarchy. 
 
var orangePolygon = viewer.entities.add({ 
 
    name : 'Orange polygon with time-varying position', 
 
    polygon : { 
 
     hierarchy : hierarchy, 
 
     extrudedHeight: 0, 
 
     perPositionHeight : true, 
 
     material : Cesium.Color.ORANGE.withAlpha(0.5), 
 
     outline : true, 
 
     outlineColor : Cesium.Color.WHITE 
 
    } 
 
}); 
 

 
viewer.zoomTo(viewer.entities);

html, body, #cesiumContainer { 
 
    width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; 
 
    font-family: sans-serif; 
 
}

<link href="http://cesiumjs.org/releases/1.19/Build/Cesium/Widgets/widgets.css" 
 
     rel="stylesheet"/> 
 
<script src="http://cesiumjs.org/releases/1.19/Build/Cesium/Cesium.js"> 
 
</script> 
 
<div id="cesiumContainer"></div>