Polyline mapping (with some height) to cesium
Can someone please tell me what happened to this piece of code?
Cesium.Math.setRandomNumberSeed(1234);
var viewer = new Cesium.Viewer('cesiumContainer');
var entities = viewer.entities;
var boxes = entities.add(new Cesium.Entity());
var polylines = new Cesium.PolylineCollection();
//Create the entities and assign each entity parent to the group to which it belongs.
for (var i = 0; i < 5; ++i) {
var height = 100000.0 + (200000.0 * i);
entities.add({
parent : boxes,
position : Cesium.Cartesian3.fromDegrees(-106.0, 45.0, height),
box : {
dimensions : new Cesium.Cartesian3(90000.0, 90000.0, 90000.0),
material : Cesium.Color.fromRandom({alpha : 1.0})
}
});
entities.add({
parent : polylines,
position : Cesium.Cartesian3.fromDegrees(-86.0, 55.0, height),
polyline : {
width : new Cesium.ConstantProperty(2),
material : Cesium.Color.fromRandom({alpha : 1.0}),
followSurface : new Cesium.ConstantProperty(false)
}
});
}
viewer.zoomTo(viewer.entities);
It displays the fields at the given coordinates, but when I try to draw the polyline it gives this error: Uncaught TypeError: Cannot read property "push" from undefined (on line 300 https://cesiumjs.org/Cesium/Source/DataSources/Entity .js )
I want something like this https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Custom%20DataSource.html&label=Showcases
Thanks in advance.
source to share
You are mixing the Entity API (a higher level API with trackable entities with names and descriptions) with a primitive graphics API (a layer below that just renders the graphics primitives).
EDIT: Looks like Scott Reynolds also answered your mailing list and you posted the following question. Here I borrowed the "vertical lines" code from Scott, removed the "parent" relationships as they don't seem to be used here, and added interactive descriptions with information about all objects.
Cesium.Math.setRandomNumberSeed(1234);
var viewer = new Cesium.Viewer('cesiumContainer');
var entities = viewer.entities;
var prevHeight = 0.0;
for (var i = 0; i < 5; ++i) {
var height = 100000.0 + (200000.0 * i);
entities.add({
name : 'Box ' + i,
description : 'This box is at height: ' + height.toLocaleString() + ' m',
position : Cesium.Cartesian3.fromDegrees(-106.0, 45.0, height),
box : {
dimensions : new Cesium.Cartesian3(90000.0, 90000.0, 90000.0),
material : Cesium.Color.fromRandom({alpha : 1.0})
}
});
entities.add({
name : 'Line ' + i,
description : 'This line is from height ' + prevHeight.toLocaleString() +
' m to height ' + height.toLocaleString() + ' m',
position : Cesium.Cartesian3.fromDegrees(-86.0, 55.0, height),
polyline : {
positions: [
Cesium.Cartesian3.fromDegrees(-86.0, 55.0, prevHeight),
Cesium.Cartesian3.fromDegrees(-86.0, 55.0, height)
],
width : new Cesium.ConstantProperty(2),
material : Cesium.Color.fromRandom({alpha : 1.0}),
followSurface : new Cesium.ConstantProperty(false)
}
});
prevHeight = height;
}
viewer.zoomTo(viewer.entities);
source to share