Simple oil pipeline + entities polylineVolume

CesiumJS
1

I need to simulate a sable oil pipeline that runs from the ocean to destination city. The model runs through a neighborhood and I want to show the exact path of the pipeline through the city.

I want to use the Sandcastle example:
const redTube = viewer.entities.add({
name: “Red tube with rounded corners”,
polylineVolume: {
positions: Cesium.Cartesian3.fromDegreesArray([
-85.0, 32.0, -85.0, 36.0, -89.0, 36.0,
]),
shape: computeCircle(60000.0),
material: Cesium.Color.RED,
},
});

Question 1: I know ‘shape: computeCircle(60000.0),’ changes the size of the tube; If I need to create a tube that is 14 inches, then is there an equivalency that I can use?
For example, 14 inches = computeCircle(300.0)

Question 2: Does the tube ‘turn’ to get to the next coordinate point?

I am trying to decide between a JS tube and creating a Blender (measured) asset.

Anyone have suggestions? Anyone build a pipeline running through a city? What did you use?

2

Hi @Mel
I made this code for you and created cesium sandcastle.
Hope this code can help you.

var viewer = new Cesium.Viewer("cesiumContainer");

function computeCircle(radius) {
  var positions = [];
  for (var i = 0; i < 360; i += 10) {
    var radians = Cesium.Math.toRadians(i);
    positions.push(new Cesium.Cartesian2(radius * Math.cos(radians), radius * Math.sin(radians)));
  }
  return positions;
}

function interpolatePath(points, granularity) {
  var interpolated = [];
  for (var i = 0; i < points.length - 3; i += 3) {
    var startLon = points[i];
    var startLat = points[i + 1];
    var startHeight = points[i + 2];

    var endLon = points[i + 3];
    var endLat = points[i + 4];
    var endHeight = points[i + 5];

    for (var j = 0; j <= granularity; j++) {
      var t = j / granularity;
      var lon = Cesium.Math.lerp(startLon, endLon, t);
      var lat = Cesium.Math.lerp(startLat, endLat, t);
      var height = Cesium.Math.lerp(startHeight, endHeight, t);
      interpolated.push(lon, lat, height);
    }
  }
  return interpolated;
}

var originalPath = [
  -80.598335, 28.613105, 0,
  -81.0, 29.0, 0,
  -82.0, 30.0, 0,
  -83.0, 31.0, 0,
  -84.0, 32.0, 0,
  -85.5, 33.0, 0,
  -86.0, 34.0, 0,
  -87.0, 35.0, 0,
  -88.0, 36.0, 0,
  -89.0, 37.0, 0,
  -90.0, 38.0, 0,
  -91.0, 36.0, 0,
  -92.0, 39.0, 0,
];

var detailedPath = interpolatePath(originalPath, 10);
var pipelinePath = Cesium.Cartesian3.fromDegreesArrayHeights(detailedPath);

var pipeline = viewer.entities.add({
  name: "Curved Pipeline",
  polylineVolume: {
    positions: pipelinePath,
    shape: computeCircle(150), // (150 meters radius to display. 14inch is 0.3556m)
    material: Cesium.Color.RED.withAlpha(1),
  },
});

var firstPoint = Cesium.Cartesian3.fromDegrees(-80.598335, 28.613105, 1000);

viewer.camera.flyTo({
  destination: firstPoint,
  orientation: {
    heading: Cesium.Math.toRadians(-40),
    pitch: Cesium.Math.toRadians(-30),
    roll: 0,
  },
});

Cesium sandcastle here:

1 Like