Hi all, my goal is to show arcs above the surface of the earth connecting two points. I have achieved this by emulating this example:
I am now experiencing two style issues
-
Changing an entities “show” field ONLY changes the visibility of the point which is traveling along the path, it does NOT change the visibility of the path.
-
ALL of the paths are the same color, regardless of what color I set them to. I have stepped through this code and verified many times that the rgb color values I’m passing in are distinct and valid, but every time, all of the paths assume ONE color. Interestingly enough, all of the points are assigned the correct color. Also, occasionally, when I programatically hide some lines, all of lines change to a different color at once.
I’ve included a code snippet below, which is pretty much just the sandcastle example code (big shout out to that person for the example); I’ve omitted my location calculations but that is all good and fine so far.
var startTime = that.map.viewer.clock.startTime;
var midTime = Cesium.JulianDate.addSeconds(startTime, 43200, new Cesium.JulianDate());
var stopTime = Cesium.JulianDate.addSeconds(startTime, 86400, new Cesium.JulianDate());
// CODE FOR CALCULATING POSITION (which I don’t have any issues with) GOES HERE
var color = that.getRelationshipColorByType(rel.Type, RelationshipService.CESIUM_COLOR);
// Create a straight-line path.
var property = new Cesium.SampledPositionProperty();
var startPosition = Cesium.Cartesian3.fromDegrees(leftLocation.Longitude, leftLocation.Latitude, 0);
property.addSample(startTime, startPosition);
var stopPosition = Cesium.Cartesian3.fromDegrees(rightLocation.Longitude, rightLocation.Latitude, 0);
property.addSample(stopTime, stopPosition);
// Find the midpoint of the straight path, and raise its altitude.
var midPoint = Cesium.Cartographic.fromCartesian(property.getValue(midTime));
midPoint.height = Cesium.Math.nextRandomNumber() * 500000 + 2500000;
var midPosition = that.map.viewer.scene.globe.ellipsoid.cartographicToCartesian(
midPoint, new Cesium.Cartesian3());
// Redo the path to be the new arc.
property = new Cesium.SampledPositionProperty();
property.addSample(startTime, startPosition);
property.addSample(midTime, midPosition);
property.addSample(stopTime, stopPosition);
if ((leftLocation != null) && (rightLocation != null)) {
/* Update or create an Entity to show the arc */
// If this is already an entity, simply update it
if ((<cesium.Viewer>that.map.viewer).entities.getById(rel.Id) != null) {
var entity: cesium.Entity = (<cesium.Viewer>that.map.viewer).entities.getById(rel.Id);
entity.position = property;
}
// If it is not an entity, add it
else {
var arcEntity = that.map.viewer.entities.add({
id: rel.Id,
position: property,
// The point is optional, I just wanted to see it.
point: {
pixelSize: 8,
color: Cesium.Color.TRANSPARENT,
outlineColor: color,
outlineWidth: 3
},
// This path shows the arc as a polyline.
path: {
show: that.showRelationships,
resolution: 1200,
material: new Cesium.PolylineGlowMaterialProperty({
glowPower: 0.16,
color: color
}),
width: 10,
leadTime: 1e10,
trailTime: 1e10
}
});
}
// This is where it becomes a smooth path.
arcEntity.position.setInterpolationOptions({
interpolationDegree: 5,
interpolationAlgorithm: Cesium.LagrangePolynomialApproximation
});
Any help or pointers as to why my process might produce entities with the same color lines or lines that don’t like to be hidden or shown would be greatly appreicated! I am using Cesium 1.28 .
