Cesium - Entity 案例01

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

const blueBox = viewer.entities.add({
  name: "Blue box",
  // 位置：(经度，维度)
  position: Cesium.Cartesian3.fromDegrees(-114.0, 40.0, 300000.0),
  box: {
     // 尺寸： 长度、宽度和高度的属性。
    dimensions: new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
    material: Cesium.Color.RED,
  },
});

const redBox = viewer.entities.add({
  name: "Red box with black outline",
  position: Cesium.Cartesian3.fromDegrees(-107.0, 40.0, 300000.0),
  box: {
    dimensions: new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
    // material: 填充盒子的材料属性
    material: Cesium.Color.RED.withAlpha(0.5),
    // outline: boolean -> 是否具有轮廓
    outline: true,
    // oulineColor: 轮廓颜色
    outlineColor: Cesium.Color.BLACK,
  },
});

const outlineOnly = viewer.entities.add({
  name: "Yellow box outline",
  position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 300000.0),
  box: {
    dimensions: new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
    // file: boolean 是否填充
    fill: false,
    outline: true,
    outlineColor: Cesium.Color.YELLOW,
    // 轮廓宽度
    outlineWidth: 1,
  },
});

viewer.zoomTo(viewer.entities);