四. vue-cesium开发三维地图 （天地图）抛物线

效果图

颜色自定义

parabolaFlowInit(window.viewer3d, 3);

export  function parabolaFlowInit(_viewer, _num,_centre1,_positions1) {
   let _center = _centre1 ? _centre1 : [126.045477, 42.686614];
   let _positions = _positions1 ? _positions1 : [
       [126.05008, 42.687865],
       [126.046946, 42.686075],
       [126.050657, 42.683049],
   ];
   _positions.forEach(item => {
       let _siglePositions = parabola(_center, item, 1000);
       for (let i = 0; i < _num; i++) {
           _viewer.entities.add({
               polyline: {
                   positions: _siglePositions,
                   material: new Cesium.LineFlowMaterialProperty({
                       color:  Cesium.Color.WHILE,
                    //    color: new Cesium.Color(1.0, 1.0, 0.0, 0.8),
                       speed: 15 * Math.random(),
                       percent: 0.1,
                       gradient: 0.1
                   })
               },
           });
       }
       _viewer.entities.add({
           polyline: {
               positions: _siglePositions,
               material: new Cesium.Color(1.0, 1.0, 0.0, 0.2),
            // color:  Cesium.Color.WHILE,
           }
       })
   });
   
   /**
    * @description: 抛物线构造函数
    * @param {*} 
    * @return {*}
    */
   function parabola(
       startPosition,
       endPosition,
       height = 0,
       count = 50
   ) {
       //方程 y=-(4h/L^2)*x^2+h h:顶点高度 L：横纵间距较大者
       let result = []
       height = Math.max(+height, 100)
       count = Math.max(+count, 50)
       let diffLon = Math.abs(startPosition[0] - endPosition[0])
       let diffLat = Math.abs(startPosition[1] - endPosition[1])
       let L = Math.max(diffLon, diffLat)
       let dlt = L / count
       if (diffLon > diffLat) {
           //base on lon
           let delLat = (endPosition[1] - startPosition[1]) / count
           if (startPosition[0] - endPosition[0] > 0) {
               dlt = -dlt
           }
           for (let i = 0; i < count; i++) {
               let h =
                   height -
                   (Math.pow(-0.5 * L + Math.abs(dlt) * i, 2) * 4 * height) /
                   Math.pow(L, 2)
               let lon = startPosition[0] + dlt * i
               let lat = startPosition[1] + delLat * i
               let point = new Cesium.Cartesian3.fromDegrees(lon, lat, h);
               result.push(point);
           }
       } else {
           //base on lat
           let delLon = (endPosition[0] - startPosition[0]) / count
           if (startPosition[1] - endPosition[1] > 0) {
               dlt = -dlt
           }
           for (let i = 0; i < count; i++) {
               let h =
                   height -
                   (Math.pow(-0.5 * L + Math.abs(dlt) * i, 2) * 4 * height) /
                   Math.pow(L, 2)
               let lon = startPosition[0] + delLon * i
               let lat = startPosition[1] + dlt * i
               let point = new Cesium.Cartesian3.fromDegrees(lon, lat, h);
               result.push(point);
           }
       }
       return result
   }
}