1. A concise explanation of the problem you're experiencing.
I'm not very familiar with Cesium, but what I want to do is use the interpolation sandcastle demo as closely as possible. Everything works perfectly in the demo, and all I'd like to do is change the demo circular path with my own coordinates. I can feed an array of each lat, lon, and altitude into Cesium, but I don't know how to use implement. Can someone please help?
Is there a particular format I should feed my coordinates and altitude into Cesium as? I read something about CZML. Can I get this to work without CZML?
2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.
var viewer = new Cesium.Viewer('cesiumContainer', {
infoBox: false, // Disable InfoBox widget
selectionIndicator: false, // Disable selection indicator
shouldAnimate: true, // Enable animations
terrainProvider: Cesium.createWorldTerrain()
});
// Enable lighting based on sun/moon positions
viewer.scene.globe.enableLighting = true;
// Enable depth testing so things behind the terrain disappear.
viewer.scene.globe.depthTestAgainstTerrain = true;
// Set the random number seed for consistent results.
Cesium.Math.setRandomNumberSeed(3);
// Set bounds of our simulation time
var start = Cesium.JulianDate.fromDate(new Date(2015, 2, 25, 16));
var stop = Cesium.JulianDate.addSeconds(start, 360, new Cesium.JulianDate());
// Make sure viewer is at the desired time.
viewer.clock.startTime = start.clone();
viewer.clock.stopTime = stop.clone();
viewer.clock.currentTime = start.clone();
viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; // Loop at the end
viewer.clock.multiplier = 10;
// Set timeline to simulation bounds
viewer.timeline.zoomTo(start, stop);
// Generate a random circular pattern with varying heights.
function computeCirclularFlight(lon, lat, radius) {
var property = new Cesium.SampledPositionProperty();
for (var i = 0; i <= 360; i += 45) {
var radians = Cesium.Math.toRadians(i);
var time = Cesium.JulianDate.addSeconds(start, i, new Cesium.JulianDate());
var position = Cesium.Cartesian3.fromDegrees(lon + (radius * 1.5 * Math.cos(radians)), lat + (radius * Math.sin(radians)), Cesium.Math.nextRandomNumber() * 500 + 1750);
property.addSample(time, position);
// Also create a point for each sample we generate.
viewer.entities.add({
position : position,
point : {
pixelSize : 8,
color : Cesium.Color.TRANSPARENT,
outlineColor : Cesium.Color.YELLOW,
outlineWidth : 3
}
});
}
return property;
}
// Compute the entity position property.
var position = computeCirclularFlight(-112.110693, 36.0994841, 0.03);
// Actually create the entity
var entity = viewer.entities.add({
// Set the entity availability to the same interval as the simulation time.
availability : new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({
start : start,
stop : stop
})]),
// Use our computed positions
position : position,
// Automatically compute orientation based on position movement.
orientation : new Cesium.VelocityOrientationProperty(position),
// Load the Cesium plane model to represent the entity
model : {
uri : 'Theme/lib/models/CesiumAir/Cesium_Air.gltf',
minimumPixelSize : 64
},
// Show the path as a pink line sampled in 1 second increments.
path : {
resolution : 1,
material : new Cesium.PolylineGlowMaterialProperty({
glowPower : 0.1,
color : Cesium.Color.YELLOW
}),
width : 10
}
});
// Add button to view the path from the top down
Sandcastle.addDefaultToolbarButton('View Top Down', function() {
viewer.trackedEntity = undefined;
viewer.zoomTo(viewer.entities, new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-90)));
});
// Add button to view the path from the side
Sandcastle.addToolbarButton('View Side', function() {
viewer.trackedEntity = undefined;
viewer.zoomTo(viewer.entities, new Cesium.HeadingPitchRange(Cesium.Math.toRadians(-90), Cesium.Math.toRadians(-15), 7500));
});
// Add button to track the entity as it moves
Sandcastle.addToolbarButton('View Aircraft', function() {
viewer.trackedEntity = entity;
});
// Add a combo box for selecting each interpolation mode.
Sandcastle.addToolbarMenu([{
text : 'Interpolation: Linear Approximation',
onselect : function() {
entity.position.setInterpolationOptions({
interpolationDegree : 1,
interpolationAlgorithm : Cesium.LinearApproximation
});
}
}, {
text : 'Interpolation: Lagrange Polynomial Approximation',
onselect : function() {
entity.position.setInterpolationOptions({
interpolationDegree : 5,
interpolationAlgorithm : Cesium.LagrangePolynomialApproximation
});
}
}, {
text : 'Interpolation: Hermite Polynomial Approximation',
onselect : function() {
entity.position.setInterpolationOptions({
interpolationDegree : 2,
interpolationAlgorithm : Cesium.HermitePolynomialApproximation
});
}
}], 'interpolationMenu');
3. Context. Why do you need to do this? We might know a better way to accomplish your goal.
This is a part of a dashboard displaying a flight path. The Interpolation demo works perfectly. I just need help getting my own coordinates (lat/lon) and altitude plugged in to get it to work.
4. The Cesium version you're using, your operating system and browser.
1.58, jQuery, FF and Chrome.