wangjuncheng
2025-04-20 1a452b6708a442915899d2ddf8288e28fd63bfbc
src/views/mnfz.vue
@@ -7,6 +7,7 @@
    @is-playing="isPlaying"
    :waterSimulateParams="waterSimulateParams"
    @playbackFinished="playbackFinished"
    @end="endSimulate"
  />
  <DebuffDetail
    v-if="showDebuffDetail"
@@ -17,15 +18,17 @@
</template>
<script setup>
import { ref, onMounted, onUnmounted } from "vue";
import { ref, onMounted, onUnmounted, provide } from "vue";
import TimeLine from "@/components/menu/TimeLine.vue";
import Left from "./left/Left.vue";
import echartInfo from "@/components/monifangzhen/echartInfo.vue";
import DebuffDetail from "@/components/tools/DebuffDetail.vue";
import DebuffTable from "@/components/tools/DebuffTable.vue";
import { getMaxInfluenceArea } from "@/api/index";
import { createPoint, geomToGeoJSON } from "@/utils/map.js";
import colors from "@/assets/img/left/colors3.png";
import danger from "@/assets/img/left/danger.png";
import { checkedKeys } from "@/store/index";
const waterSimulateParams = ref({});
const showWaterSimulate = ref(false);
@@ -34,13 +37,21 @@
const isDynamicMode = ref(false);
const isFinish = ref(true);
// 提供方法给所有子组件
provide("simulateActions", {
  startSimulate,
  endSimulate,
});
function startSimulate(form) {
  // console.log("form", form);
  showWaterSimulate.value = true;
  waterSimulateParams.value = form;
}
function endSimulate() {
  // showDebuffDetail.value = true
  showDebuffDetail.value = false
  clearTrailLine();
  removeDataSources();
  setTimeout(() => {
    showWaterSimulate.value = false;
@@ -50,11 +61,38 @@
const MaxInfluenceAreaList = ref([]);
const dataSources = [];
function getTimeMarkers() {
  // 将改 list数据的 gemo EPSG:4548 坐标 转为 wgs84 坐标系的 geojson 数据
  // 将 list 数据的 geom EPSG:4326 坐标转换为 WGS84 坐标系的 GeoJSON 数据
  const list = MaxInfluenceAreaList.value;
  list.forEach((item, index) => {
    const geosjon = geomToGeoJSON(item.geom);
    Cesium.GeoJsonDataSource.load(geosjon).then((dataSource) => {
    const geojson = JSON.parse(item.geom); // 解析 geom 字段为 GeoJSON 对象
    Cesium.GeoJsonDataSource.load(geojson).then((dataSource) => {
      // 设置样式,将颜色改为红色
      dataSource.entities.values.forEach((entity) => {
        // entity.polygon.material = new Cesium.Color(1.0, 0.0, 0.0, 0.6); // 红色,80% 不透明度
        // entity.polygon.material = new Cesium.Color.YELLOW; // 红色,80% 不透明度
        entity.polygon.outlineColor = Cesium.Color.YELLOW;
        entity.polygon.outline = true;
        // 使用提供的 X, Y, Z 坐标作为图标位置
        const position = Cesium.Cartesian3.fromDegrees(item.X, item.Y, item.Z);
        // 在中心点上方添加一个图标实体
        const billboardEntity = viewer.entities.add({
          position: position,
          billboard: {
            image: danger, // 图标的路径
            scale: 1.0, // 图标缩放比例
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 图标底部对齐到中心点
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 图标贴地
            distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 1500), // 控制可见距离范围 (0米到1500米)
          },
        });
        // 将图标实体与当前数据源关联
        dataSource.entities.add(billboardEntity);
      });
      // 添加数据源到 viewer
      viewer.dataSources.add(dataSource);
      dataSources.push(dataSource);
    });
@@ -65,6 +103,154 @@
    viewer.dataSources.remove(dataSource);
  });
}
let TrailLine = [];
async function showLine() {
  const position = [
    {
      x: -2172540.8322597803,
      y: 4339064.62665997,
      z: 4126183.3895281963,
    },
    {
      x: -2172480.18394144,
      y: 4339033.15167176,
      z: 4126240.9529584926,
    },
    {
      x: -2172454.114348403,
      y: 4339020.0398392705,
      z: 4126261.946960697,
    },
    {
      x: -2172377.9670952093,
      y: 4338976.609385458,
      z: 4126333.862357211,
    },
    {
      x: -2172299.4142002705,
      y: 4338951.971578909,
      z: 4126397.5205803993,
    },
    {
      x: -2172245.1703274297,
      y: 4338940.86037857,
      z: 4126436.276389208,
    },
    {
      x: -2172176.7332184147,
      y: 4338930.525741544,
      z: 4126477.629952572,
    },
    {
      x: -2172173.8151051304,
      y: 4338939.043883864,
      z: 4126469.336927342,
    },
    {
      x: -2172173.7151194704,
      y: 4338939.023235937,
      z: 4126469.4107743693,
    },
  ];
  let LineInterpolation = earthCtrl.core.LineInterpolation(earthCtrl.coreMap, {
    positions: position,
    num: 50,
    getHeight: true,
  });
  // console.log(LineInterpolation.height, "A");
  let min = LineInterpolation.height;
  let max = min.map((item) => {
    return item + 35;
  });
  console.log(min, max);
  let _TrailLine = earthCtrl.factory.createTrailLineWall(
    LineInterpolation.positions,
    {
      maximumHeights: max,
      minimumHeights: min,
      color: "#ffffff", //线颜色(可选)
      url: colors,
    }
  );
  TrailLine.push(_TrailLine);
}
// 清除轨迹线对象
function clearTrailLine() {
  TrailLine.forEach((item, index) => {
    if (item && typeof item.deleteObject === 'function') {
      item.deleteObject();
    } else if (item && typeof item.clear === 'function') {
      item.clear();
    } else if (item && earthCtrl && earthCtrl.coreMap) {
      earthCtrl.coreMap.entities.remove(item);
    }
  });
  TrailLine = [];
}
// function showLine() {
//   earthCtrl.factory.createSimpleGraphic(
//     "polyline",
//     { clampToGround: true },
//     (entity) => {
//       if (entity) {
//         const position = [
//           {
//             x: -2172540.8322597803,
//             y: 4339064.62665997,
//             z: 4126183.3895281963,
//           },
//           {
//             x: -2172480.18394144,
//             y: 4339033.15167176,
//             z: 4126240.9529584926,
//           },
//           {
//             x: -2172454.114348403,
//             y: 4339020.0398392705,
//             z: 4126261.946960697,
//           },
//           {
//             x: -2172377.9670952093,
//             y: 4338976.609385458,
//             z: 4126333.862357211,
//           },
//           {
//             x: -2172299.4142002705,
//             y: 4338951.971578909,
//             z: 4126397.5205803993,
//           },
//           {
//             x: -2172245.1703274297,
//             y: 4338940.86037857,
//             z: 4126436.276389208,
//           },
//           {
//             x: -2172176.7332184147,
//             y: 4338930.525741544,
//             z: 4126477.629952572,
//           },
//           {
//             x: -2172173.8151051304,
//             y: 4338939.043883864,
//             z: 4126469.336927342,
//           },
//           {
//             x: -2172173.7151194704,
//             y: 4338939.023235937,
//             z: 4126469.4107743693,
//           },
//         ];
//         // console.log("positions", positions);
//         addWall(position, [entity]);
//         earthCtrl.factory.SimpleGraphic.remove(entity.id);
//       }
//     }
//   );
// }
function timeUpdate(percentage) {
  if (percentage > 99) {
    if (showDebuffDetail.value) {
@@ -73,6 +259,7 @@
    checkedKeys.value = ["避险点"];
    showDebuffDetail.value = true;
    getTimeMarkers();
    showLine();
  }
}
function openDetail() {