Cesium 点，两点直线，两点抛物线

1.点

let viewer = new Cesium.Viewer('cesiumContainer'）
	
	//点的数据
     let  point = [{
        id: 'a',
        name: "a",
        type: "a",
        state: "a",
        position: {
          x: 经度,
          y: 维度
        },
        text: 'a'
      }, {
        id: 'b',
        name: "b",
        type: "b",
        state: "b",
        position: {
          x: 经度,
          y: 维度,
        },
        text: 'b'
      }, {
        id: 'c',
        name: "c",
        type: "c",
        state: "c",
        position: {
          x: 经度,
          y:维度,
        },
        text: 'c'
      }]
      
      //遍历点的数据，进行画点
      data.map(res => {
        viewer.entities.add({
          id: res.id,
          name: res.name,
          position: Cesium.Cartesian3.fromDegrees(res.position.x, res.position.y),
          point: {
            color: Cesium.Color.RED,    //点位颜色
            pixelSize: 5               //像素点大小
          },
          label: {
            text: res.name,
            font: '3pt Source Han Sans CN',    //字体样式
            fillColor: Cesium.Color.BLACK,        //字体颜色
            style: Cesium.LabelStyle.FILL,        //label样式
            outlineWidth: 2,
            verticalOrigin: Cesium.VerticalOrigin.CENTER,//垂直位置
            horizontalOrigin: Cesium.HorizontalOrigin.LEFT,//水平位置
            pixelOffset: new Cesium.Cartesian2(10, 0)            //偏移
          },
          monitoItems: {
            data: res
          },             `
        })
      })

2.两点间的直线

    //根据点的id绘制线条
    drawLine() {
    //a,c分别为画点时，设置的点的id，可以找到这个点并获取这两个点的经纬度
      let position = this.getPositionById("a", "c")
      viewer.entities.add({
        id: "ccc",
        polyline: {
          show: true,
          positions: Cesium.Cartesian3.fromDegreesArray(position),
          width: 2,
          material: new Cesium.Color(0, 0, 1, 1)
        }
      })
    },
    //根据传入点的id获取点的经纬度
    getPositionById(id1, id2) {
      var entity_1 = viewer.entities.getById(id1);
      var position_1 = entity_1.position.getValue(viewer.clock.currentTime);
      let cartographic_1 = Cesium.Cartographic.fromCartesian(position_1);
      let x1 = parseFloat(Cesium.Math.toDegrees(cartographic_1.longitude).toFixed(6))
      let y1 = parseFloat(Cesium.Math.toDegrees(cartographic_1.latitude).toFixed(6))
      if (!id2) {
        return [x1, y1]
      } else {
        var entity_2 = viewer.entities.getById(id2);
        var position_2 = entity_2.position.getValue(viewer.clock.currentTime);
        let cartographic_2 = Cesium.Cartographic.fromCartesian(position_2);
        let x2 = parseFloat(Cesium.Math.toDegrees(cartographic_2.longitude).toFixed(6))
        let y2 = parseFloat(Cesium.Math.toDegrees(cartographic_2.latitude).toFixed(6))
        return [x1, y1, x2, y2,]
      }
    },

3.两点间的抛物线

    //绘制弧线，twoPoints：两点坐标
    drawArcLine() {
    //a,c分别为画点时，设置的点的id，可以找到这个点并获取这两个点的经纬度。
    //封装的方法在上面直线那有
      let position = this.getPositionById("a", "c")
      const startPoint = [position[0], position[1], 0]; // 起点的经度、纬度
      const step = 40;  // 线的数量，越多则越平滑(但过多浏览器缓存也会占用越多)
      const heightProportion = 0.125; // 最高点和总距离的比值
      const dLon = (position[2] - startPoint[0]) / step;  // 经度差值
      const dLat = (position[3] - startPoint[1]) / step;  // 纬度差值
      const deltaLon = dLon * Math.abs(111000 * Math.cos(position[1]));  // 经度差(米级)
      const deltaLat = dLat * 111000;  // 纬度差(米),1纬度相差约111000米
      const endPoint = [0, 0, 0];  // 定义一个端点（后面将进行startPoint和endPoint两点画线）
      const heigh = Math.floor(step * Math.sqrt(deltaLon * deltaLon + deltaLat * deltaLat) * heightProportion);
      const x2 = (10000 * Math.sqrt(dLon * dLon + dLat * dLat)); // 小数点扩大10000倍，提高精确度
      const a = (heigh / (x2 * x2));
      function y(x, height) { return Math.floor(height - a * x * x); }
      for (let i = 1; i <= step; i++) {  // 逐“帧”画线
        endPoint[0] = startPoint[0] + dLon; // 更新end点经度
        endPoint[1] = startPoint[1] + dLat; // 更新end点纬度
        const x = x2 * (2 * i / step - 1);  // 求抛物线函数x
        endPoint[2] = y(x, heigh);  // 求end点高度
        viewer.entities.add({  // 添加静态线
          polyline: {
            positions: Cesium.Cartesian3.fromDegreesArrayHeights(startPoint.concat(endPoint)),
            width: 4,
            material: new Cesium.PolylineGlowMaterialProperty({
              color: Cesium.Color.AQUA.withAlpha(0.9),
              outlineWidth: 0.3,
              glowPower: 0.3,
            })
          },
        });
        // end点变为start点
        startPoint[0] = endPoint[0];
        startPoint[1] = endPoint[1];
        startPoint[2] = endPoint[2];
      }
    },