Cesium通过primitives绘制大数据量扇形图

通过PolygonGeometry绘制立体扇形图，并实现填充效果

  let data = oList; //数据列表
  let labels = new Cesium.PrimitiveCollection()
  labels["id"] = "labelPrimitive";
  viewer.scene.primitives.add(labels);

  let PolygonInstances = [];
  for (let index = 0; index < data.length; index++) {
    const entityI = data[index];
    //根据type设置不同填充色
    let color = "";
    if (entityI.color === 1) {
      color = "rgba(0,191,255,1)";
    } else {
      if (entityI.type == "4G") {
        color = "rgba(0,128,0,1)";
      } else if (entityI.type == "5G") {
        color = "rgba(0,0,153,1)";
      }
    }
    // 通过turf计算扇形多边形坐标
    let center = turf.point([parseFloat(entityI.longitude), parseFloat(entityI.latitude)]);
    let radius = 0.05;
    //entityI.aoa：弧度
    let bearing1 = parseFloat(entityI.aoa) - 15;
    let bearing2 = parseFloat(entityI.aoa) + 15;
    let sector = turf.sector(center, radius, bearing1, bearing2);
    let positions = Array.prototype.concat.apply([], sector.geometry.coordinates[0]);
    PolygonInstances.push(new Cesium.GeometryInstance({
      geometry: new Cesium.PolygonGeometry({
        polygonHierarchy: new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromDegreesArray(positions)),
        height: 0,
        extrudedHeight: 10
      }),
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString(color))
      }
    }))
  }
  labels.add(
    new Cesium.Primitive({
      geometryInstances: PolygonInstances,
      appearance: new Cesium.PerInstanceColorAppearance()
    })
  );

通过EllipsoidGeometry绘制扇形图，并实现填充效果

  let data = oList; //数据列表
  let labels = new Cesium.PrimitiveCollection()
  labels["id"] = "labelPrimitive";
  viewer.scene.primitives.add(labels);

  let EllipsoidInstances = [];
  for (let index = 0; index < data.length; index++) {
    const entityI = data[index];
    //根据type设置不同填充色
    let color = "";
    if (entityI.color === 1) {
      color = "rgba(0,191,255,1)";
    } else {
      if (entityI.type == "4G") {
        color = "rgba(0,128,0,1)";
      } else if (entityI.type == "5G") {
        color = "rgba(0,0,153,1)";
      }
    }
    let position = Cesium.Cartesian3.fromDegrees(parseFloat(entityI.longitude), parseFloat(entityI.latitude), 0);
    //entityI.aoa：弧度
    let hpRoll = new Cesium.HeadingPitchRoll(
      Cesium.Math.toRadians(parseFloat(entityI.aoa)),
      0,
      0
    );
    EllipsoidInstances.push(new Cesium.GeometryInstance({
      geometry: new Cesium.EllipsoidGeometry({
        radii: new Cesium.Cartesian3(50.0, 50.0, 50.0),  // 扇形半径
        innerRadii: new Cesium.Cartesian3(1.0, 1.0, 1.0), // 内半径
        minimumClock: Cesium.Math.toRadians(75), // 左右偏角
        maximumClock: Cesium.Math.toRadians(105),
        minimumCone: Cesium.Math.toRadians(80),// 上下偏角
        maximumCone: Cesium.Math.toRadians(90)
      }),
      modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll),
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString(color))
      }
    }));
  }
  labels.add(
    new Cesium.Primitive({
      geometryInstances: EllipsoidInstances,
      appearance: new Cesium.PerInstanceColorAppearance()
    })
  );

通过EllipsoidOutlineGeometry绘制扇形图，并实现描边效果

  let data = oList; //数据列表
  let labels = new Cesium.PrimitiveCollection()
  labels["id"] = "labelPrimitive";
  viewer.scene.primitives.add(labels);

  let EllipsoidOutlineInstances = [];
  for (let index = 0; index < data.length; index++) {
    const entityI = data[index];
    //根据type设置不同填充色
    let color = "";
    if (entityI.color === 1) {
      color = "rgba(0,191,255,1)";
    } else {
      if (entityI.type == "4G") {
        color = "rgba(0,128,0,1)";
      } else if (entityI.type == "5G") {
        color = "rgba(0,0,153,1)";
      }
    }
    let position = Cesium.Cartesian3.fromDegrees(parseFloat(entityI.longitude), parseFloat(entityI.latitude), 0);
    //entityI.aoa：弧度
    let hpRoll = new Cesium.HeadingPitchRoll(
      Cesium.Math.toRadians(parseFloat(entityI.aoa)),
      0,
      0
    );
    EllipsoidOutlineInstances.push(new Cesium.GeometryInstance({
      geometry: new Cesium.EllipsoidOutlineGeometry({
        radii: new Cesium.Cartesian3(50.0, 50.0, 50.0),  // 扇形半径
        innerRadii: new Cesium.Cartesian3(1.0, 1.0, 1.0), // 内半径
        minimumClock: Cesium.Math.toRadians(75), // 左右偏角
        maximumClock: Cesium.Math.toRadians(105),
        minimumCone: Cesium.Math.toRadians(80),// 上下偏角
        maximumCone: Cesium.Math.toRadians(90)
      }),
      modelMatrix: Cesium.Transforms.headingPitchRollToFixedFrame(position, hpRoll),
      attributes: {
        color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromCssColorString(color))
      }
    }));
  }
  labels.add(
    new Cesium.Primitive({
      geometryInstances: EllipsoidOutlineInstances,
      appearance: new Cesium.PerInstanceColorAppearance({
        flat: true, //EllipsoidOutlineGeometry类型必须设置该参数，不然会出现下图错误
      })
    })
  );