cylinder position

CesiumJS
1

Hello,

I am trying to place two cylinders, one top of each other, on the surface of the globe. The bottom cylinder should be on the surface of the earth. Each cylinder represents a ‘measure’, so their ‘height’ varies according to the corresponding value. However, the cylinders are either overlapping or there is some gap in between them. I think I am going wrong with the cylinder positions. Here is the code:

var bottomCylinderHeight = Value1 * 1000; //1000 is the scale factor

var bottomCylinder = entities.getOrCreateEntity(“1”);

bottomCylinder.position = Cesium.Cartesian3.fromDegrees(-100.5, 62.4, 0);

bottomCylinder.cylinder = new Cesium.CylinderGraphics({

length: bottomCylinderHeight,

topRadius: 500.0,

bottomRadius: 500.0,

outline: false,

outlineColor: Cesium.Color.BLUE,

outlineWidth: 4,

material: new Cesium.ColorMaterialProperty(Cesium.Color.BLUE)

});

var topCylinderHeight = Value2 * 1000;// 1000 is the scale factor

var topCylinder = entities.getOrCreateEntity(“2”);

topCylinder .position = Cesium.Cartesian3.fromDegrees(-100.5, 62.4, bottomCylinderHeight );

topCylinder.cylinder = new Cesium.CylinderGraphics({

length: topCylinderHeight ,

topRadius: 500.0,

bottomRadius: 500.0,

outline: false,

outlineColor: Cesium.Color.RED,

outlineWidth: 4,

material: new Cesium.ColorMaterialProperty(Cesium.Color.RED)

});

Thanks

Kiran

2

Can someone please help?
Thanks

3

The position of the cylinder is the center, not the bottom, so you need to adjust the height. Below is the fixed code. I’ll make a note to update our doc to make this clear.

var bottomCylinderHeight = Value1 * 1000; //1000 is the scale factor

var bottomCylinder = entities.getOrCreateEntity(“1”);

bottomCylinder.position = Cesium.Cartesian3.fromDegrees(-100.5, 62.4, (bottomCylinderHeight*0.5));

bottomCylinder.cylinder = new Cesium.CylinderGraphics({

length: bottomCylinderHeight,

topRadius: 500.0,

bottomRadius: 500.0,

outline: false,

outlineColor: Cesium.Color.BLUE,

outlineWidth: 4,

material: new Cesium.ColorMaterialProperty(Cesium.Color.BLUE)

});

var topCylinderHeight = Value2 * 1000;// 1000 is the scale factor

var topCylinder = entities.getOrCreateEntity(“2”);

topCylinder.position = Cesium.Cartesian3.fromDegrees(-100.5, 62.4, bottomCylinderHeight + (topCylinderHeight * 0.5));

topCylinder.cylinder = new Cesium.CylinderGraphics({

length: topCylinderHeight,

topRadius: 500.0,

bottomRadius: 500.0,

outline: false,

outlineColor: Cesium.Color.RED,

outlineWidth: 4,

material: new Cesium.ColorMaterialProperty(Cesium.Color.RED)

});

4

Thanks Matthew!
Yes, adding this info to the documentation will make it very clear.