接入视频流

wangyawei

2025-04-18 2d90fa3dc99fced159d0bc76939fd9b88e6aafe1

接入视频流

 src/components/tools/Aspect.vue

@@ -1,14 +1,20 @@
// 坡向分析
<template>
  <div class="aspect">
    <el-button @click="handleDraw">绘制区域</el-button>
    <el-button @click="handleClear">关闭坡度</el-button>
    <div>
      <el-button @click="handleDraw">绘制区域</el-button>
      <el-button @click="handleClear">关闭坡度</el-button>
    </div>
    <div style="margin-top: 10px">
      <el-button @click="handleaspect">坡度分析</el-button>
      <el-button @click="handleSlope">坡向分析</el-button>
    </div>
  </div>
</template>
<script setup>
import { reactive, defineEmits } from "vue";
// 定义 emit 方法
const emit = defineEmits(["draw", "clear"]);
const emit = defineEmits(["draw", "clear", "handleaspect", "handleSlope"]);
const handleDraw = () => {
  console.log("绘制区域");
  emit("draw");
@@ -17,11 +23,19 @@
  console.log("关闭坡度");
  emit("clear");
};
const handleaspect = () => {
  console.log("坡度分析");
  emit("handleaspect");
};
const handleSlope = () => {
  console.log("坡向分析");
  emit("handleSlope");
};
</script>
<style lang="less" scoped>
.aspect {
  width: 215px;
  height: 50px;
  // height: 50px;
  background: url("@/assets/img/tools/plotting_new.png") no-repeat;
  filter: opacity(83%);
  background-size: 100% 100%;

 src/components/tools/LayerTree.vue

@@ -1,22 +1,29 @@
<template>
  <div class="layer-tree">
    <<<<<<< HEAD <el-tree ref="treeRef" style="max-width: 600px" show-checkbox node-key="label" :default-checked-keys="defaultSelectedKeys" @check-change="handleCheckChange" :data="treeData" />
    =======
    <el-tree ref="treeRef" style="max-width: 600px" show-checkbox node-key="label" :default-checked-keys="defaultSelectedKeys" @check-change="handleCheckChange" :data="treeData" />
    >>>>>>> f82eb01fe65e513fb43342db0e25cafa0e0d2db8
  </div>
</template>

<script setup>
import { ref, onMounted, onBeforeUnmount, watch, onUnmounted } from "vue"
import { createPoint, removeEntities, addTileset } from "@/utils/map"
import { deviceDictList, getDictName } from "@/constant/dict.js"
import { useRoute } from "vue-router"
import { loadAreaPolygon, clearAreaPolygon } from '@/utils/area'
import { checkedKeys } from '@/store/index'
import { getDuanMainData } from '@/api/index.js'
const route = useRoute()
import { ref, onMounted, onBeforeUnmount, watch, onUnmounted } from "vue";
import { createPoint, removeEntities, addTileset } from "@/utils/map";
import { deviceDictList, getDictName } from "@/constant/dict.js";
import { useRoute } from "vue-router";
import { loadAreaPolygon, clearAreaPolygon } from "@/utils/area";
import { checkedKeys } from "@/store/index";
import { getDuanMainData } from "@/api/index.js";
const route = useRoute();
const treeData = ref([
  {
    label: "三维服务",
    children: [{ label: "模型数据" }, { label: "地形数据" }, { label: "影像数据" }],
    children: [
      { label: "模型数据" },
      { label: "地形数据" },
      { label: "影像数据" },
    ],
  },
  {
    label: "图层数据",
@@ -41,40 +48,39 @@
      },
    ],
  },
])
const treeRef = ref(null)
const treeMap = new Map()
const defaultSelectedKeys = ref(["模型数据", "影像数据", "地形数据"])
]);
const treeRef = ref(null);
const treeMap = new Map();
const defaultSelectedKeys = ref(["模型数据", "影像数据", "地形数据"]);
function handleCheckChange (data, checked, indeterminate) {
  const label = data.label
  const list = treeMap.get(label)
  const label = data.label;
  const list = treeMap.get(label);
  if (list) {
    toggleLayerVisible(label, checked)
    return
    toggleLayerVisible(label, checked);
    return;
  }
  switch (label) {
    case "模型数据":
      list.show = checked
      break
      list.show = checked;
      break;
    case "北京市隐患点":
      console.log("北京市隐患点", checked, indeterminate)
      break
      console.log("北京市隐患点", checked, indeterminate);
      break;
    case "孙胡沟隐患点":
      console.log("孙胡沟隐患点", checked, indeterminate)
      break
      console.log("孙胡沟隐患点", checked, indeterminate);
      break;
    case "泥石流隐患点面数据":
      console.log("泥石流隐患点面数据", checked, indeterminate)
      break
      console.log("泥石流隐患点面数据", checked, indeterminate);
      break;
    case "综合监测设备信息":
      console.log("综合监测设备信息", checked, indeterminate)
      break
      console.log("综合监测设备信息", checked, indeterminate);
      break;
    case "孙胡沟仿真标注地物":
      console.log("孙胡沟仿真标注地物", checked, indeterminate)
      break
      console.log("孙胡沟仿真标注地物", checked, indeterminate);
      break;
    case "避险点":
      addTetrahedron()
      break

      addTetrahedron();
      break;
  }
}
function initMap () {
@@ -92,6 +98,11 @@
    sourceType: "ctb",
    url: "http://106.120.22.26:9103/gisserver/ctsserver/llmbdem",
  })
  // let TerrainLayer = earthCtrl.factory.createTerrainLayer({
  //   sourceType: "ctb",
  //   url: "https://tiles1.geovisearth.com/base/v1/terrain?token=486dac3bec56d7d7c2a581c150be2bd937462f1e8f3bc9c78b5658b396122405",
  //   requestVertexNormals: true,
  // });
  // treeMap.set("影像数据", ImageryLayer)
  treeMap.set("地形数据", TerrainLayer)
}
@@ -257,23 +268,23 @@
    latitude: 40.533623,
    longitude: 116.602406,
  },
])
]);

function initDevicePoint () {
  let list = []
function initDevicePoint() {
  let list = [];

  devicetList.value.forEach(item => {
    item.type = getDictName(deviceDictList, item.dictDeviceType)
    item.name = item.type
    item.id = item.deviceId
    item.className = "device"
    item.showLabel = true
    const entity = createPoint(item)
    entity.show = false
  devicetList.value.forEach((item) => {
    item.type = getDictName(deviceDictList, item.dictDeviceType);
    item.name = item.type;
    item.id = item.deviceId;
    item.className = "device";
    item.showLabel = true;
    const entity = createPoint(item);
    entity.show = false;

    list.push(entity)
  })
  treeMap.set("综合监测设备信息", list)
    list.push(entity);
  });
  treeMap.set("综合监测设备信息", list);
}

const districtList = ref([
@@ -301,7 +312,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "尹家西沟尹建燕家屋后崩塌隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -352,7 +364,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "河西于凤英家屋后崩塌隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -403,7 +416,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "南梁小东沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "",
    preventionLevel: "",
    preventionPlan: "定期巡查,立警示牌",
@@ -454,7 +468,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "大窑沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已监测、已治理",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -505,7 +520,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "大东沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已治理",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移",
@@ -556,8 +572,10 @@
    monitor: "",
    monitorAdvice: "",
    name: "尹家西沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已监测；灾害体变化：4处坡积物垮塌，堆积至坡脚，方量约20m³。",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes:
      "已监测；灾害体变化：4处坡积物垮塌，堆积至坡脚，方量约20m³。",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移",
    preventionUnit: "乡镇",
@@ -607,7 +625,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "北大地西洼子沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "沟口正对房屋，降雨时出水量大，建议治理，汛期加强巡查",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -658,7 +677,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "范家庄王秀莲家屋后崩塌隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "边坡较陡，顺向岩层，房屋靠近坡脚，建议尽快治理",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -709,7 +729,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "三亩地范忠田家屋后崩塌隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，更换警示牌",
@@ -760,8 +781,10 @@
    monitor: "",
    monitorAdvice: "",
    name: "于家西沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已监测，2018村已治理；沟口堆积扇明显，正对房屋，建议汛期加强巡查",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes:
      "已监测，2018村已治理；沟口堆积扇明显，正对房屋，建议汛期加强巡查",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移",
    preventionUnit: "乡镇",
@@ -811,7 +834,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "椴树底下东沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已治理：威胁对象重复：与110116030015重复5户11人",
    preventionLevel: "",
    preventionPlan: "定期巡查，预警转移，立警示牌",
@@ -862,7 +886,8 @@
    monitor: "",
    monitorAdvice: "",
    name: "河东南沟泥石流隐患点",
    number: "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    number:
      "13716108909,13716029391,13716291714,13716191943,13716427398,13124792612",
    preventionDes: "已监测",
    preventionLevel: "",
    preventionPlan: "定期巡查,立警示牌",
@@ -889,40 +914,39 @@
    volumePotential: "",
    width: 0,
  },
])
]);

function initDistrictPoint () {
  let list = []
  districtList.value.forEach(item => {
    item.showBillboard = true
    item.className = "district"
    item.type = '泥石流'
    const entity = createPoint(item)
    entity.show = false
    list.push(entity)
  })
  treeMap.set("孙胡沟隐患点", list)
function initDistrictPoint() {
  let list = [];
  districtList.value.forEach((item) => {
    item.showBillboard = true;
    item.className = "district";
    item.type = "泥石流";
    const entity = createPoint(item);
    entity.show = false;
    list.push(entity);
  });
  treeMap.set("孙胡沟隐患点", list);
}

let divPointList = [];

let divPointList = []
function initDuanmianPoint() {
  getDuanMainData().then((res) => {
    const duanmianList = res.data;
    const list = [];
    duanmianList.forEach((item) => {
      item.id = item.id + item.alias;
      item.name = item.alias;
      item.longitude = item.lon;
      item.latitude = item.lat;
      item.showBillboard = false;
      item.className = "district";

function initDuanmianPoint () {
  getDuanMainData().then(res => {
    const duanmianList = res.data
    const list = []
    duanmianList.forEach(item => {
      item.id = item.id + item.alias
      item.name = item.alias
      item.longitude = item.lon
      item.latitude = item.lat
      item.showBillboard = false
      item.className = "district"

      const entity = createPoint(item)
      entity.show = false
      list.push(entity)
      return
      const entity = createPoint(item);
      entity.show = false;
      list.push(entity);
      return;
      const divPoint = earthCtrl.factory.createDivPoint(
        item.alias,
        { lon: longitude, lat: latitude },
@@ -937,26 +961,23 @@
          near: 0,
          far: 500000,
        }
      )
      divPoint.item.show = false
      console.log(divPoint)
      );
      divPoint.item.show = false;
      console.log(divPoint);

      divPointList.push(divPoint.item)
    })
    treeMap.set("孙胡沟仿真标注地物", list)
  })

  divPointList.push(divPoint.item);
});
treeMap.set("孙胡沟仿真标注地物", list);
  });
}

function addTetrahedron (visible) {
  const emergencyAreaList = []
function addTetrahedron(visible) {
  const emergencyAreaList = [];

  loadAreaPolygon("/json/emergency_area.geojson", true).then(entities => {
    emergencyAreaList.push(...entities)
  })
  loadAreaPolygon("/json/emergency_area.geojson", true).then((entities) => {
    emergencyAreaList.push(...entities);
  });
  // console.log('polygon', polygon);



  let list = [
    {
@@ -977,8 +998,8 @@
      latitude: 40.558199,
      altitude: 528,
    },
  ]
  list.forEach(item => {
  ];
  list.forEach((item) => {
    let point = earthCtrl.factory.addTetrahedron({
      position: {
        lon: item.longitude,
@@ -987,70 +1008,78 @@
      },
      multiple: 1.0,
      scale: new SmartEarth.Cesium.Cartesian3(20, 20, 20),
    })
    console.log("point", point)
    emergencyAreaList.push(point)

  })
  treeMap.set("避险点", emergencyAreaList)

    });
    console.log("point", point);
    emergencyAreaList.push(point);
  });
  treeMap.set("避险点", emergencyAreaList);
}
function toggleLayerVisible (name, checked) {
  const entityList = treeMap.get(name)
function toggleLayerVisible(name, checked) {
  const entityList = treeMap.get(name);
  if (Array.isArray(entityList) && entityList.length > 0) {
    entityList.forEach(entity => {
      entity.show = checked
    })
    entityList.forEach((entity) => {
      entity.show = checked;
    });
  }
  treeMap.set(name, entityList)
  treeMap.set(name, entityList);
}

function getData () {
  initDevicePoint()
  initDistrictPoint()
  initDuanmianPoint()
function getData() {
  initDevicePoint();
  initDistrictPoint();
  initDuanmianPoint();
}

// 通过 store 传递需要选中的key
watch(() => checkedKeys.value, (keys) => {
  if (keys && Array.isArray(keys)) {
    treeRef.value.setCheckedKeys(defaultSelectedKeys.value.concat(keys), true)
watch(
  () => checkedKeys.value,
  (keys) => {
    if (keys && Array.isArray(keys)) {
      treeRef.value.setCheckedKeys(
        defaultSelectedKeys.value.concat(keys),
        true
      );
    }
  }
})
);

watch(
  () => route.fullPath,
  path => {
    const defaultKeys = defaultSelectedKeys.value
  (path) => {
    const defaultKeys = defaultSelectedKeys.value;
    if (path == "/yhgl") {
      treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟隐患点"), true)
      toggleLayerVisible("孙胡沟隐患点", true)
      toggleLayerVisible("综合监测设备信息", false)
      toggleLayerVisible("孙胡沟仿真标注地物", false)

      treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟隐患点"), true);
      toggleLayerVisible("孙胡沟隐患点", true);
      toggleLayerVisible("综合监测设备信息", false);
      toggleLayerVisible("孙胡沟仿真标注地物", false);
    } else if (path == "/zhjc") {
      treeRef.value.setCheckedKeys(defaultKeys.concat("综合监测设备信息"), true)
      toggleLayerVisible("综合监测设备信息", true)
      toggleLayerVisible("孙胡沟隐患点", false)
      toggleLayerVisible("孙胡沟仿真标注地物", false)
      treeRef.value.setCheckedKeys(
        defaultKeys.concat("综合监测设备信息"),
        true
      );
      toggleLayerVisible("综合监测设备信息", true);
      toggleLayerVisible("孙胡沟隐患点", false);
      toggleLayerVisible("孙胡沟仿真标注地物", false);
    } else if (path == "/mnfz") {
      treeRef.value.setCheckedKeys(defaultKeys.concat("孙胡沟仿真标注地物"), true)
      toggleLayerVisible("孙胡沟仿真标注地物", true)
      toggleLayerVisible("孙胡沟隐患点", false)
      toggleLayerVisible("综合监测设备信息", false)

      treeRef.value.setCheckedKeys(
        defaultKeys.concat("孙胡沟仿真标注地物"),
        true
      );
      toggleLayerVisible("孙胡沟仿真标注地物", true);
      toggleLayerVisible("孙胡沟隐患点", false);
      toggleLayerVisible("综合监测设备信息", false);
    } else {
      treeRef.value.setCheckedKeys(defaultKeys, true)
      treeRef.value.setCheckedKeys(defaultKeys, true);
    }
  }
)
);
onMounted(() => {
  initMap()
  getData()
})
  initMap();
  getData();
});
onUnmounted(() => {
  viewer.entities.removeAll()
})
  viewer.entities.removeAll();
});
</script>

<style lang="less" scoped>
@@ -1063,4 +1092,4 @@
  height: 200px;
  z-index: 99;
}
</style>
</style>

 src/components/tools/SlopeAnalysis.vue

@@ -1,15 +1,6 @@
<template>
  <div class="terrain-settings">
    <el-form :model="form" label-width="80px">
      <!-- 地表渲染 -->
      <el-form-item label="地表渲染">
        <el-radio-group v-model="form.terrainRender">
          <el-radio :label="0">无</el-radio>
          <el-radio :label="1">坡度</el-radio>
        </el-radio-group>
      </el-form-item>

      <!-- 等高线开关 -->
      <el-form-item label="等高线">
        <el-switch
          v-model="form.contourLines"
@@ -51,7 +42,6 @@

// 初始化 form 数据
const form = reactive({
  terrainRender: 0,
  contourLines: false,
  color: "red",
  spacing: 50,

 src/components/tools/Tools.vue

@@ -42,16 +42,18 @@
      <div v-show="echartsShow" id="sectionCharts" class="sectionChars">
        <div id="echartsView1" style="width: 100%; height: 100%"></div>
      </div>
      <!-- 坡向分析 -->
      <!-- 坡度坡向分析 -->
      <Aspect
        v-show="showAspect"
        @draw="SlopeArrow"
        @clear="SlopeArrowClose"
        @handleaspect="handleaspect"
        @handleSlope="handleSlope"
        class="popup-menu-see"
      />
      <SlopeAnalysis
        @draw="SlopeAnalysiss"
        v-show="showSlope"
        v-show="isContourLabel"
        class="popup-menu-see"
        @update-slope="onUpdateSlope"
      />
@@ -128,9 +130,6 @@
// 坡向箭头弹窗
const showAspect = ref(false);

// 坡度分析弹窗
const showSlope = ref(false);

// 工具列表
const toolList = ref([
  {
@@ -162,8 +161,7 @@
    active: false,
    options: [
      { name: "点位信息提取", icon: "点位信息提取" },
      { name: "坡度分析", icon: "坡度坡向提取" },
      { name: "坡向分析", icon: "坡度坡向提取" },
      { name: "坡度坡向分析", icon: "坡度坡向提取" },
      { name: "剖面提取", icon: "剖面提取" },
      { name: "挖填方计算", icon: "挖填方计算" },
      { name: "等高线分析", icon: "等高线分析" },
@@ -201,7 +199,23 @@

// 处理工具点击事件
function handleClick(tool, event) {
  toolList.value.forEach((item) => {
    item.active =
      item.name === tool.name && currentToolOptions.value !== tool.options;
  });
  console.log(tool.options);
  // 如果当前工具已经是激活状态，则关闭它
  if (currentToolOptions.value === tool.options) {
    currentToolOptions.value = null; // 清空当前工具选项
    isPopupVisible.value = false; // 隐藏弹窗
    seeAnalyzeShow.value = false; // 可视域
    topographyShow.value = false; // 剖面
    echartsShow.value = false; // 剖面echarts
    showAspect.value = false; // 坡度坡向分析
    showRain.value = false; // 雨天
    showSnow.value = false; // 雪天
    return;
  }
  // 如果工具名称是 "图层管理"
  if (tool.name === "图层管理") {
    showLayerTree.value = !showLayerTree.value; // 切换图层树的显示状态
@@ -210,7 +224,6 @@
    topographyShow.value = false; //剖面
    echartsShow.value = false; //剖面echarts
    showAspect.value = false; //坡向箭头
    showSlope.value = false; //坡向箭头
    showRain.value = false; //雨天
    showSnow.value = false; //雨天
    return;
@@ -224,15 +237,17 @@
  topographyShow.value = false; //剖面
  echartsShow.value = false; //剖面echarts
  showAspect.value = false; //坡向箭头
  showSlope.value = false; //坡向箭头
  showRain.value = false; //雨天
  showSnow.value = false; //雨天
}

const currentOption = ref(null);

// 处理弹窗选项点击事件
function handleOptionClick(option) {
  isPopupVisible.value = false;
  console.log("Selected option:", option);
  currentOption.value = option.name;
  console.log("Selected option:", currentOption.value);
  const actionMap = {
    显示图层: () => (showLayerTree.value = true),
    隐藏图层: () => (showLayerTree.value = false),
@@ -278,11 +293,16 @@
    剖面提取: () => {
      topographyShow.value = true;
    },
    坡度分析: () => {
      showSlope.value = true;
    },
    坡向分析: () => {
    坡度坡向分析: () => {
      showAspect.value = true;
    },
    等高线分析: () => {
      isContourLabel.value = true;
      if (isContourLabel.value === false) {
        mapUtils.createContourLabel();
      } else {
        mapUtils.closeContourLabel();
      }
    },
    点位信息提取: () => {
      isPickActive.value = !isPickActive.value;
@@ -302,14 +322,6 @@
        mapUtils.FloodAnalysis("close");
      } else {
        mapUtils.FloodAnalysis();
      }
    },
    等高线分析: () => {
      isContourLabel.value = !isContourLabel.value;
      if (isContourLabel.value === false) {
        mapUtils.createContourLabel();
      } else {
        mapUtils.closeContourLabel();
      }
    },
  };
@@ -374,6 +386,14 @@
  mapUtils.handleClear();
};

// 划分区域
const SlopeArrow = () => {
  mapUtils.hfqy();
};
// 坡度分析
const handleaspect = () => {
  mapUtils.pdfx();
};
//坡度的箭头角度(角度为0~1,范围内的均匀插值)
const angles = [
  0.0, 0.1, 0.15, 0.2, 0.25, 0.3, 0.35, 0.4, 0.45, 0.5, 0.55, 0.6, 0.65, 0.7,
@@ -401,18 +421,17 @@
  "#F0AD56",
  "#F2CC45",
];

const SlopeArrow = () => {
// 坡向分析
const handleSlope = () => {
  mapUtils.pxjt(colors, angles);
};
// 关闭坡向箭头
// 关闭坡度坡向分析
const SlopeArrowClose = () => {
  mapUtils.cleanupAnalysisTools();
  mapUtils.clearPreviousAnalysis();
};

// 坡度分析
// 等高线
const formData = reactive({
  terrainRender: 0,
  contourLines: false,
  color: "red",
  spacing: 50,
@@ -420,14 +439,12 @@
});

const SlopeAnalysiss = () => {
  mapUtils.pdfx(formData);
  mapUtils.dgxfx(formData);
};


// 坡度
const onUpdateSlope = (newOption) => {
  Object.assign(formData, newOption);
  mapUtils.pdfx(formData);
  mapUtils.dgxfx(formData);
};

// 雨

 src/utils/tools.js

@@ -25,6 +25,7 @@
  snowEffect: null, // 新增雪效果实例
  regionTerrain: null,
  polygonPosition: [],
  PolygonArr: [],

  init(earthCtrl) {
    this.earthCtrl = earthCtrl;
@@ -91,81 +92,80 @@
  },
  // 区域划分工具
  hfqy() {
    // 初始化区域地形
    this.regionTerrain = earthCtrl.factory.createRegionTerrain({});
    this.polygonPosition = [];

    // 创建绘制工具
    const drawTool = earthCtrl.shapeTool.createDrawShapeTool((e) => {
      try {
        if (!e || !e.result) {
          throw new Error('Invalid drawing result');
        }

        // 转换坐标并存储
        const polygonI = [];
        for (const point of e.result) {
          const cartographic = earthCtrl.coreMap.scene.globe.ellipsoid.cartesianToCartographic(point);
          const lon = Cesium.Math.toDegrees(cartographic.longitude);
          const lat = Cesium.Math.toDegrees(cartographic.latitude);

          polygonI.push(lon, lat, 0);
          this.polygonPosition.push(lon, lat);
        }

        // 设置区域地形
        this.regionTerrain.setPositions(this.polygonPosition);
        this.regionTerrain.setRegionEnabled(true);

        // 清除绘制工具
        drawTool.removeFromMap();
      } catch (error) {
        console.error('Error during region drawing:', error);
        drawTool.removeFromMap();
    const draw = earthCtrl.shapeTool.createDrawShapeTool((e) => {
      const polygonI = [];
      for (const i of e.result) {
        const ellipsoid = earthCtrl.coreMap.scene.globe.ellipsoid;
        const cartographic = ellipsoid.cartesianToCartographic(i);
        const lon = SmartEarth.Cesium.Math.toDegrees(
          cartographic.longitude
        ); // 经度
        const lat = SmartEarth.Cesium.Math.toDegrees(cartographic.latitude); // 纬度
        polygonI.push(lon, lat, 0);
        this.polygonPosition.push(lon, lat);
      }
      this.PolygonArr.push({
        id: earthCtrl.factory.createUUID(),
        polygon: polygonI,
      });
      draw.removeFromMap();
      this.regionTerrain.setPositions(this.polygonPosition);
      this.regionTerrain.setRegionEnabled(true);
    });

    return drawTool;
  },
  // 坡度分析
  pdfx() {
    if (this.regionTerrain) {
      console.log('坡度分析');
      this.clearPreviousAnalysis(); // 先清除之前的分析
      this.regionTerrain.setType("slope");
      this.regionTerrain.update();
    }
  },

  // 坡向箭头
  pxjt(colors, angles) {
    this.hfqy()
    if (this.regionTerrain) {
      this.clearPreviousAnalysis(); // 先清除之前的分析
      this.regionTerrain.setType("aspect");
      this.regionTerrain.update();
    }

    this.slopeArrow = earthCtrl.factory.createSlopeArrow({});
    this.slopeArrow.setColorsAndAngles(colors, angles);
    this.regionTerrain.setPositions(this.polygonPosition);
    this.regionTerrain.setRegionEnabled(true);
    this.slopeArrow.setSlopeType(1);
  },

  // 坡度分析
  pdfx(option) {
    this.hfqy()
    this.elevationTool = new SmartEarth.ElevationTool(earthCtrl)
    if (option.terrainRender == '1') {
      this.elevationTool.type = 'slope'
    } else {
      this.elevationTool.type = 'none'
    }
    this.elevationTool.tf = option.contourLines
    this.elevationTool.setSpacing(option.spacing)
    this.elevationTool.setWidth(option.lineWidth)
  // 等高线分析
  dgxfx(option) {
    this.clearPreviousAnalysis(); // 先清除之前的分析
    this.hfqy();
    this.elevationTool = new SmartEarth.ElevationTool(earthCtrl);
    this.elevationTool.tf = option.contourLines;
    this.elevationTool.setSpacing(option.spacing);
    this.elevationTool.setWidth(option.lineWidth);
    this.elevationTool.setContourColor(option.color);
    this.elevationTool.render();
  },

  // 清理所有分析工具
  cleanupAnalysisTools() {
    // 坡向箭头
  // 清除之前的分析（坡度、坡向、等高线）
  clearPreviousAnalysis() {
    if (this.regionTerrain) {
      this.regionTerrain.setType("");
      this.regionTerrain.update();
    }

    if (this.slopeArrow) {
      this.slopeArrow.setSlopeType(0);
      this.slopeArrow = null;
      // this.slopeArrow = null;
    }
    // 选择区域
    if (this.regionTerrain) {
      this.regionTerrain.setRegionEnabled(false);
      this.regionTerrain = null;

    if (this.elevationTool) {
      this.elevationTool = null;
    }
    this.polygonPosition = [];
  },
  // 标绘
  CreateLabel(pic, show) {