Uncapped cylinder?

CesiumJS
1

Hi folks

I want to draw an uncapped cylinder. There seems no way to do this with either the ellipse or cylinder types, because fill fills the sides and the end caps.

This is one of those things that seems like it must be possible, but at the moment I am stumped. :-/

I could use a Wall, but then I’d have to find a way to generate the list of latlng points to describe the circle. Again I thought the ellipse primitive might help me out but there seems no way to use it to extract a list of latlngs at x degree intervals around the circumference.

Is what I want to do so strange and unlikely a thing to want to do that no-one has wanted to do it before? I can’t imagine it is, so I am guessing I am just not looking in the right place yet, or I am missing some key piece of information/knowledge that would make this as easy as I thought it would be! :slight_smile:

Thanks in advance for any illumination you can provide.

regards

Guy

2

A Wall seems reasonable - just approximate a circle with a number of points. What’s hard about generating those lat/lng locations? Should just be some pretty basic trig and/or geometric calculations.

3

Basic for you maybe… :slight_smile: I’ll google how to do that - I just expected there to be a way to do it using something in Cesium, or another mapping library.

4

Well, one approach would be simply to figure out what sort of spacing you want for your points in degrees, decide on your radius, and then use the “Destination point given distance and bearing from start point” function as described at http://www.movable-type.co.uk/scripts/latlong.html to calculate each point along the circle.

Actually, now that I’m looking at things… if you look at the implementation of CylinderGeometry in Cesium’s source, it uses a private class called CylinderGeometryLibrary to do the calculations for positions and such. Doesn’t look like that’s exposed publicly, but perhaps what you could do is copy the source for CylinderGeometry and CylinderGeometryLibrary into your app, and modify them as needed to skip the top and bottom of the cylinder. Not sure it’s worth the extra effort over just using a Wall, though. For that matter, note that CylinderGeometryLibrary does do a variation of “compute points around a circle”, just more trig/x/y based than latlng/bearing/distance based.

5

Thanks Mark. I cobbled together the following and then used it with a wall. It gives me what I need.

function calculateCirclePoints(ll,radius) {

var d2r = Math.PI / 180;

var r2d = 180 / Math.PI;

var earthRadius = 6371000;

var lat = ll.lat;

var lng = ll.lng;

var points = 60; //number of points to calculate

// find the radius in lat/lon

var rlat = (radius / earthRadius) * r2d;

var rlng = rlat / Math.cos(lat * d2r);

var circlePoints = new Array();

for (var i=0; i<=points; i++) {

var theta = Math.PI * (i / (points/2));

ex = lng + (rlng * Math.cos(theta)); // center a + radius x * cos(theta)

ey = lat + (rlat * Math.sin(theta)); // center b + radius y * sin(theta)

circlePoints.push(ex, ey, 2000); //added height so can be ingested using fromDegreesArrayHeights

}

return circlePoints;

}

6

And for completeness, in case it helps someone else one day:

var circlePoints = calculateCirclePoints(existingLL,radius);
selectionZone3d = viewer.entities.add({
name : ‘Selection Zone’,
wall : {
positions : Cesium.Cartesian3.fromDegreesArrayHeights(circlePoints),
material : Cesium.Color.BLUE.withAlpha(0.2),
outline: true,
outlineColor: Cesium.Color.BLUE.withAlpha(0.5)
}
});

``

7

Yup, that seems pretty reasonable. Glad to hear you got that working for you. That does look like it’s treating lat/lons without taking earth curvature into account, but should be okay if you’re just dealing with relatively short-ish distances.