原文链接及内容

原文链接：https://sandcastle.cesium.com/?src=Polyline%20Volume.html&label=Geometries

示例代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
const viewer = new Cesium.Viewer("cesiumContainer");

/**
 * 根据半径计算返回一个圆形
 * @param {number} radius 
 * @returns 
 */
function computeCircle(radius) {
  const positions = [];
  for (let i = 0; i < 360; i++) {
    const radians = Cesium.Math.toRadians(i);
    positions.push(
      new Cesium.Cartesian2(
        radius * Math.cos(radians),
        radius * Math.sin(radians),
      ),
    );
  }
  return positions;
}

/**
 * 该函数用于生成一个星星形状的二维坐标点（Cesium.Cartesian2 数组），这些点可以用于在 Cesium 中绘制星形图形。
 * 星星由交替的外径和内径点组成，形成尖角的星形图案。
 * 函数通过计算点的极坐标并转换为笛卡尔坐标来实现。
 * 每个“arm”对应一个外凸的尖角，星星的总顶点数是 arms * 2（因为每个尖角由一个外径点和一个内径点组成）。
 * 
 * @param {number} arms 星星尖角的数量，例如为5时表示5角星
 * @param {*} rOuter 表示星星外径点的半径，即尖角顶点到星星中心的距离。
 * @param {*} rInner 表示星星内径点的半径，即尖角之间的凹陷点到星星中心的距离。
 * @returns 
 */
function computeStar(arms, rOuter, rInner) {
  const angle = Math.PI / arms;
  const length = 2 * arms;
  const positions = new Array(length);
  for (let i = 0; i < length; i++) {
    const r = i % 2 === 0 ? rOuter : rInner;
    positions[i] = new Cesium.Cartesian2(
      Math.cos(i * angle) * r,
      Math.sin(i * angle) * r,
    );
  }
  return positions;
}

const redTube = viewer.entities.add({
  name: "带圆角的红色管道",
  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,
  },
});

const greenBox = viewer.entities.add({
  name: "带有斜切角和轮廓的绿色方框(管道)",
  polylineVolume: {
    positions: Cesium.Cartesian3.fromDegreesArrayHeights([
      -90.0, 32.0, 0.0, -90.0, 36.0, 100000.0, -94.0, 36.0, 0.0,
    ]),
    shape: [
      new Cesium.Cartesian2(-50000, -50000),
      new Cesium.Cartesian2(50000, -50000),
      new Cesium.Cartesian2(50000, 50000),
      new Cesium.Cartesian2(-50000, 50000),
    ],
    cornerType: Cesium.CornerType.BEVELED,
    material: Cesium.Color.GREEN.withAlpha(0.5),
    outline: true,
    outlineColor: Cesium.Color.BLACK,
  },
});

const blueStar = viewer.entities.add({
  name: "带有斜接角(mitered corners)和轮廓的蓝色星形(管道)",
  polylineVolume: {
    positions: Cesium.Cartesian3.fromDegreesArrayHeights([
      -95.0, 32.0, 0.0, -95.0, 36.0, 100000.0, -99.0, 36.0, 200000.0,
    ]),
    shape: computeStar(7, 70000, 50000),
    cornerType: Cesium.CornerType.MITERED,
    material: Cesium.Color.BLUE,
  },
});

viewer.zoomTo(viewer.entities);

效果如下图所示：