1. A concise explanation of the problem you’re experiencing.
It is my understanding that polyline’s loop option is meant for drawing a ‘closed’ polyline, I mean a polyline where seamlessly first and last point coincide, so a closed path.
Maybe I’m wrong since I can’t seem to able to draw such a closed path using the loop option to true.
I tried with both a non closed path (which I expected the loop option to close for me) and an “almost” closed path (where first and last positions coincide) hoping that it would be drawn with the proper “closing” mitering: no luck with both ways.
I attach an image where I highlight both my (wrong) results.
2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.
To reproduce what shown in the image, please paste the following snippet in the JS tab of the Hello World Sandcastle example:
var viewer = new Cesium.Viewer(‘cesiumContainer’,{
terrainProvider: Cesium.createWorldTerrain()
});
//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);
//Generate a random circular pattern with varying heights.
function computeCirclularFlight(lon, lat, radius) {
var positions = ;
// skip last point (same lat,lon as first one)
for (var i = 0; i < 360; i += 45) {
var radians = Cesium.Math.toRadians(i);
positions.push(lon + (radius * 1.5 * Math.cos(radians)));
positions.push(lat + (radius * Math.sin(radians)));
positions.push(Cesium.Math.nextRandomNumber() * 500 + 1750);
}
return Cesium.Cartesian3.fromDegreesArrayHeights(positions);
}
function computeClosedCirclularFlight(lon, lat, radius) {
var positions = ;
// keep last point (same lat,lon as first one)
for (var i = 0; i <= 360; i += 45) {
var radians = Cesium.Math.toRadians(i);
positions.push(lon + (radius * 1.5 * Math.cos(radians)));
positions.push(lat + (radius * Math.sin(radians)));
positions.push(Cesium.Math.nextRandomNumber() * 500 + 2300);
}
// make last point height same as first one
positions[positions.length-1]=positions[2];
return Cesium.Cartesian3.fromDegreesArrayHeights(positions);
}
//Show not closed positions path as a closed polyline (looped)
// not working
var positions = computeCirclularFlight(-112.110693, 36.0994841, 0.03);
viewer.entities.add({
polyline : {
positions : positions,
loop: true,
material : Cesium.Color.YELLOW,
width : 10,
show: true
}
});
// Try with closed path of positions showing it as a closed polyline (looped)
// not working the same
positions = computeClosedCirclularFlight(-112.110693, 36.0994841, 0.03);
viewer.entities.add({
polyline : {
positions : positions,
loop: true,
material : Cesium.Color.WHITE,
width : 10,
show: true
}
});
viewer.zoomTo(viewer.entities);
3. Context. Why do you need to do this? We might know a better way to accomplish your goal.
I need to draw closed paths (polyline type instead of Cesium path entity type).
4. The Cesium version you’re using, your operating system and browser.
Cesium 1.50, Windows 7 SP1 64bit, Chrome 70.0.3538.77 (Official Build) (64-bit)
What am I doing wrong?
Thanks for your help.