更换中图NightscapeAnalysis组件

src/views/ConstructionApplication3D/NightscapeAnalysis/NightscapeAnalysis.vue

@@ -1,15 +1,27 @@
 <template>
-  <div class="ZTGlobal" style="width: 100%; padding: 1rem 1rem 0rem 1rem; color: white">
+  <div
+    class="ZTGlobal"
+    style="width: 100%; padding: 1rem 1rem 0rem 1rem; color: white"
+  >
     <el-row :gutter="10">
       <el-col :span="24">
         <div class="titleHeader">
-          <el-switch v-model="isNightscaoe" active-text="开启夜景" inactive-text="关闭夜景" @change="handleChange">
+          <el-switch
+            v-model="isNightscaoe"
+            active-text="开启夜景"
+            inactive-text="关闭夜景"
+            @change="handleChange"
+          >
           </el-switch>
           <el-tooltip content="点击后可直接在光源参数中保存" placement="top">
-            <el-button type="primary" size="mini" @click="openDgyAddVisibility">添加光源</el-button>
+            <el-button type="primary" size="mini" @click="openDgyAddVisibility"
+              >添加光源</el-button
+            >
           </el-tooltip>
 
-          <el-button type="danger" size="mini" @click="dgyremove">删除光源</el-button>
+          <el-button type="danger" size="mini" @click="dgyremove"
+            >删除光源</el-button
+          >
         </div>
       </el-col>
     </el-row>
@@ -18,29 +30,54 @@
         光源列表：
         <el-row>
           <el-col :span="24" style="border: 1px solid #fff">
-            <el-table ref="dgytable" :show-header="false" :data="gyTableData" :highlight-current-row="true"
-              @current-change="handleCurrentChange" style="width: 100%">
+            <el-table
+              ref="dgytable"
+              :show-header="false"
+              :data="gyTableData"
+              :highlight-current-row="true"
+              @current-change="handleCurrentChange"
+              style="width: 100%"
+            >
               <el-table-column prop="gyName" label="光源名称"></el-table-column>
-            </el-table> </el-col></el-row>
+            </el-table> </el-col
+        ></el-row>
       </el-col>
       <el-col :span="14">
         光源参数：
         <el-row>
           <el-col :span="24" style="border: 1px solid #fff">
-            <el-form ref="dgyform" :model="dgyform" label-width="80px" style="padding: 1rem 1rem 0rem 1rem">
+            <el-form
+              ref="dgyform"
+              :model="dgyform"
+              label-width="80px"
+              style="padding: 1rem 1rem 0rem 1rem"
+            >
               <el-form-item label="光源名称">
-                <el-input size="mini" v-model="dgyform.gyName" placeholder="请输入光源名称"></el-input>
+                <el-input
+                  size="mini"
+                  v-model="dgyform.gyName"
+                  placeholder="请输入光源名称"
+                ></el-input>
               </el-form-item>
               <el-form-item label="光源类型">
-                <el-select size="mini" v-model="dgyform.gyType" placeholder="请选择光源类型">
+                <el-select
+                  size="mini"
+                  v-model="dgyform.gyType"
+                  placeholder="请选择光源类型"
+                >
                   <el-option label="点光源" value="点光源"></el-option>
                   <el-option label="聚光灯" value="聚光灯"></el-option>
                   <el-option label="直射光" value="直射光"></el-option>
                 </el-select>
               </el-form-item>
               <el-form-item label="光源颜色">
-                <el-color-picker size="mini" v-model="dgyform.gyColor"></el-color-picker>
-                <el-button size="mini" @click="addPoint">添加光源位置</el-button>
+                <el-color-picker
+                  size="mini"
+                  v-model="dgyform.gyColor"
+                ></el-color-picker>
+                <el-button size="mini" @click="addPoint"
+                  >添加光源位置</el-button
+                >
               </el-form-item>
               <!-- <el-form-item label="X坐标(度)">
                 <el-input-number
@@ -61,17 +98,34 @@
                 ></el-input-number>
               </el-form-item> -->
               <el-form-item label="扩散距离" v-if="dgyform.gyType != '直射光'">
-                <el-input-number size="mini" v-model="dgyform.gyDistance" :min="0" :max="10000"></el-input-number>
+                <el-input-number
+                  size="mini"
+                  v-model="dgyform.gyDistance"
+                  :min="0"
+                  :max="10000"
+                ></el-input-number>
               </el-form-item>
               <el-form-item label="衰减因子" v-if="dgyform.gyType != '直射光'">
-                <el-input-number size="mini" v-model="dgyform.gyDecay" :min="0" :max="10000"></el-input-number>
+                <el-input-number
+                  size="mini"
+                  v-model="dgyform.gyDecay"
+                  :min="0"
+                  :max="10000"
+                ></el-input-number>
               </el-form-item>
               <el-form-item label="光源强度">
-                <el-input-number size="mini" v-model="dgyform.gyIntensity" :min="0" :max="10000"></el-input-number>
+                <el-input-number
+                  size="mini"
+                  v-model="dgyform.gyIntensity"
+                  :min="0"
+                  :max="10000"
+                ></el-input-number>
               </el-form-item>
             </el-form>
             <div class="SaveCenter">
-              <el-button size="mini" type="primary" @click="onSubmit">保存</el-button>
+              <el-button size="mini" type="primary" @click="onSubmit"
+                >保存</el-button
+              >
               <el-button size="mini" @click="resetForm">取消</el-button>
             </div>
           </el-col>
@@ -88,6 +142,7 @@ let entityPointLightPairs = new Map(),
   entityDirectionalLightPairs = new Map(),
   GeoJsonLayerList = [],
   liudongGntities = [],
+  buildTopLines = [],
   pointLightSourceDrawHandler = null,
   spotOrDirectionalLightSourceDrawHandler = null,
   spotOrDirectionalLightSourceCountHandler = null,
@@ -205,19 +260,6 @@ export default {
         this.setHypsometric(false); //夜景材质
         viewer.imageryLayers.remove(imageLayer);
       } else {
-
-        var customJGD = new Cesium.SpotLight(new Cesium.Cartesian3.fromDegrees(109.51265531383535, 18.311520512333716, 61.862752134911719
-
-        ), new Cesium.Cartesian3.fromDegrees(
-          109.53073971317, 18.3524456120148, 1000
-        ), {
-          color: Cesium.color(0.2, 0.3, 0.3, 1),
-          cutoffDistance: 2000,
-          decay: 100,
-          intensity: 1
-        })
-        customJGD.angle = Math.PI / 6
-        scene.addLightSource(customJGD);
         scene.sun.show = false;
         if (scene.layers.find("白天"))
           scene.layers.find("白天").visible = false;
@@ -294,7 +336,7 @@ export default {
             //   p[2]
             // );
             var SpotLightOptions3 = {
-              id: 'db_' + index,
+              id: "db_" + index,
               color: new Cesium.Color(
                 window.NightLightUrl.yshdg.LightColor.r,
                 window.NightLightUrl.yshdg.LightColor.g,
@@ -315,7 +357,43 @@ export default {
             scene.addLightSource(SpotLight33);
           });
         });
+        //小区灯光
+        Cesium.loadJson(window.NightLightUrl.residential.url).then(
+          (response) => {
+            let features = response.features;
+            features.forEach((element) => {
+              let p = element.geometry.coordinates;
+              var SpotLightPos3 = new Cesium.Cartesian3.fromDegrees(
+                p[0],
+                p[1],
+                p[2] + 3
+              );
+              // var SpotLightPos32 = new Cesium.Cartesian3.fromDegrees(
+              //   p[0],
+              //   p[1],
+              //   p[2]
+              // );
+              var SpotLightOptions3 = {
+                cutoffDistance: window.NightLightUrl.yshdg.cutoffDistance,
+                color: new Cesium.Color(
+                  window.NightLightUrl.residential.LightColor.r,
+                  window.NightLightUrl.residential.LightColor.g,
+                  window.NightLightUrl.residential.LightColor.b,
+                  window.NightLightUrl.residential.LightColor.a
+                ),
+                decay: window.NightLightUrl.residential.decay,
+                intensity: window.NightLightUrl.residential.intensity,
+              };
 
+              let SpotLightresidential = new Cesium.PointLight(
+                SpotLightPos3,
+                // SpotLightPos32,
+                SpotLightOptions3
+              );
+              scene.addLightSource(SpotLightresidential);
+            });
+          }
+        );
         // 体育场灯光
         Cesium.loadJson(window.NightLightUrl.tycdg.url).then((response) => {
           let features = response.features;
@@ -328,7 +406,6 @@ export default {
             );
 
             var SpotLightOptions3 = {
-
               cutoffDistance: window.NightLightUrl.tycdg.cutoffDistance,
               color: new Cesium.Color(
                 window.NightLightUrl.tycdg.LightColor.r,
@@ -818,6 +895,43 @@ export default {
           liudongGntities.push(dls);
         });
       });
+      //楼顶流动线
+      var liness = [];
+
+      Cesium.loadJson(window.NightLightUrl.buildTopLine.url).then(
+        (jsonData) => {
+          debugger;
+          liness = jsonData;
+          jsonData.features.forEach((route) => {
+            let list = route.geometry.coordinates.flat(Infinity);
+            let topLine = viewer.entities.add({
+              id: route.properties.OBJECTID,
+              polyline: {
+                positions: Cesium.Cartesian3.fromDegreesArrayHeights(list),
+                width: window.NightLightUrl.dlzxx.ldxWidth,
+                material: new Cesium.PolylineTrailMaterialProperty({
+                  outlineColor: new Cesium.Color(
+                    window.NightLightUrl.buildTopLine.ldxOutlineColor.r,
+                    window.NightLightUrl.buildTopLine.ldxOutlineColor.g,
+                    window.NightLightUrl.buildTopLine.ldxOutlineColor.b,
+                    window.NightLightUrl.buildTopLine.ldxOutlineColor.a
+                  ),
+                  outlineWidth: window.NightLightUrl.dlzxx.ldxOutlineWidth,
+                  color: new Cesium.Color(
+                    window.NightLightUrl.buildTopLine.ldxColor.r,
+                    window.NightLightUrl.buildTopLine.ldxColor.g,
+                    window.NightLightUrl.buildTopLine.ldxColor.b,
+                    window.NightLightUrl.buildTopLine.ldxColor.a
+                  ),
+                  trailLength: window.NightLightUrl.buildTopLine.trailLength,
+                  period: window.NightLightUrl.buildTopLine.period,
+                }),
+              },
+            });
+            buildTopLines.push(topLine);
+          });
+        }
+      );
     },
 
     onSubmit() {
@@ -1203,6 +1317,9 @@ export default {
         liudongGntities.forEach((element) => {
           viewer.entities.remove(element);
         });
+        buildTopLines.forEach((element) => {
+          viewer.entities.remove(element);
+        });
       }
     },
     cartesianToWgs84(x, y, z) {