src/api/hpApi.js

@@ -248,7 +248,7 @@
}

// 查询孙胡沟避险场所
export async function getSafePoint(data) {
export async function getSafePoint() {
  const response = await axios.get("/hp/safeHavenLocation/getDataSelect", {
    params: {
      divisionId: 110116110218
@@ -261,4 +261,26 @@
export async function getAllCode() {
  const response = await axios.get("/hp/district/getAll");
  return response.data;
}

// 获取天气预报
export async function getWeather() {
  // 获取当前时间戳
  const currentTimestamp = Date.now();

  // 创建Date对象
  const currentDate = new Date(currentTimestamp);

  // 格式化为年-月-日（YYYY-MM-DD）
  const year = currentDate.getFullYear();
  const month = String(currentDate.getMonth() + 1).padStart(2, '0'); // 月份从0开始，所以要+1
  const day = String(currentDate.getDate()).padStart(2, '0');
  const formattedDate = `${year}-${month}-${day}`;

  const response = await axios.get("/hp/weatherForecast/getSevenDaysWeather", {
    params: {
      inputDate: formattedDate
    }
  });
  return response.data;
}

 src/components/menu/CrossSectionalAnalysis.vue

@@ -78,6 +78,8 @@
import { getCrossSection } from '@/api/trApi.js'; // 假设你有真实接口
import { useSimStore } from '@/store/simulation';
import { storeToRefs } from 'pinia';
import { EventBus } from "@/eventBus";

const simStore = useSimStore();
const { selectedScheme } = storeToRefs(simStore);
const viewer = window.viewer;
@@ -234,6 +236,8 @@
        pickHandlerCross = null;
    }
    isPicking.value = false;
     simStore.crossSection = []
    EventBus.emit("clear-dM")
    console.log('这里发送请求，清空郭楠的echarts2');
    
}
@@ -293,6 +297,8 @@
    const startPoint = `${point1.longitude},${point1.latitude}`;
    const endPoint = `${point2.longitude},${point2.latitude}`;
    const result = await getCrossSectionInfo(startPoint, endPoint);
    simStore.crossSection = result
    EventBus.emit("redraw-dM")
    console.log(result,'这里是郭楠需要的断面数据');
    
    isUploaded.value = true;

 src/components/menu/TimeLine.vue

@@ -1158,9 +1158,9 @@
async function endSimulation() {
  clearAllPoints();
  simStore.openDia = true;
  simStore.crossSection = [];
  // 结束模拟之后清除layer列表
  simStore.rePlayList = [];
  console.log(simStore.rePlayList, "结束模拟清除rePlayListrePlayList列表");
  EventBus.emit("close-time");
  endSimulate();
  isWaterPrimitiveCreated.value = false;

 src/components/monifangzhen/echartInfo.vue

@@ -155,6 +155,28 @@
  chart2Data.value.resetLoading();
});

// 清除断面
EventBus.on("clear-dM", () => {
  chart2Data.value.stopUpdating();
  chart2Data.value.resetLoading();
  if (intervalId2) {
    clearInterval(intervalId2);
    intervalId2 = null;
  }
  if (stopNowTimeWatch) {
    stopNowTimeWatch(); // 停止 nowTime 的监听
    stopNowTimeWatch = null;
  }
});

// 重新绘制断面时，重新启动 nowTime 监听
EventBus.on("redraw-dM", () => {
  if (chart2Data.value) {
    chart2Data.value.startNowTimeWatch();
    chart2Data.value.loadJsonData();
  }
});

// 清除威胁对象中的数据
const resetTable = () => {
  currentIndex.value = 0;
@@ -220,6 +242,7 @@
  },
  { immediate: true } // 立即执行监听器
);

// 点击数据实现面片闪动的触发函数
function handleRowClick(row) {
  console.log("Row clicked:", row);
@@ -473,7 +496,6 @@
    const totalDuration = fixedFrameNum * 1000;
    const totalPoints = rainfallData.value.length;


    const animate = (index) => {
      if (index >= totalPoints) {
        console.log("Animation completed");
@@ -505,11 +527,6 @@
    }
  };

  // const stopUpdating = () => {
  //   clearTimeout(updateInterval);
  //   updateInterval = null;
  // };

  const resetLoading = () => {
    stopUpdating();
    fixedFrameNum = null;
@@ -533,45 +550,151 @@
  };
};

let stopNowTimeWatch = null; // 存储 watch 的停止函数
const setEcharts2 = () => {
  const chartDom = document.getElementById("echarts2");
  const myChart2 = echarts.init(chartDom);

  // 图表数据（与echarts1保持相同结构）
  // 图表数据
  let flowData = ref([]); // 原始数据
  let data1 = ref([]); // 实时流量
  let data2 = ref([]); // 累计流量
  let data2 = ref([]); // 流速
  let data3 = ref([]); // 深度（新增）
  let xAxisData = ref(["00:00"]);
  let updateInterval = ref(null);
  let dataIndex = ref(0);
  let lastProcessedTime = ref(0); // 记录上次处理的时间戳

  // 动态计算Y轴范围
  const calculateDynamicYAxis = (dataArray) => {
    const currentMax = Math.max(...dataArray, 1);
    const step = Math.ceil(currentMax / 3);
  // 将各种时间格式转换为时间戳
  const parseTimeToTimestamp = (time) => {
    if (!time) return 0;

    // 如果是时间戳（毫秒）
    if (typeof time === "number" && time > 1000000000000) {
      return time;
    }

    // 如果是Date对象
    if (time instanceof Date) {
      return time.getTime();
    }

    // 如果是时间字符串（如"2023-01-01 12:00:00"）
    if (typeof time === "string") {
      return new Date(time).getTime() || 0;
    }

    return 0;
  };

  // 动态计算Y轴范围（支持深度数据特殊处理）
  const calculateDynamicYAxis = (dataArray, isDepth = false) => {
    const filteredData = dataArray.filter((val) => val != null && val > 0);

    if (filteredData.length === 0) {
      return {
        min: 0,
        max: isDepth ? 10 : 0.001, // 深度默认范围更大
        interval: isDepth ? 2 : 0.0002,
      };
    }

    const maxValue = Math.max(...filteredData);
    const exponent = Math.floor(Math.log10(maxValue));
    const base = Math.pow(10, exponent);
    let step, max;

    if (isDepth) {
      // 深度数据的特殊处理
      step = Math.ceil(maxValue / 5); // 固定分为5段
      max = step * 5;
    } else if (maxValue < 0.01) {
      // 对于小数值，使用更精细的步长
      step = base / 5;
      max = step * 5;
    } else {
      // 常规处理
      step = base / 2;
      max = step * Math.ceil(maxValue / step) + step;
    }

    const decimalPlaces = Math.max(0, -exponent + 1);

    return {
      max: step * 3,
      interval: step,
      min: 0,
      max: parseFloat(max.toFixed(decimalPlaces)),
      interval: parseFloat(step.toFixed(decimalPlaces)),
    };
  };
  const loadJsonData = async () => {
    try {
      const response = await fetch("/json/于家西沟断面下数据.json");
      const result = await response.json();
      if (result?.data?.length) {
        flowData.value = result.data;
        if (flowData.value.length > 0) {
          data1.value = [flowData.value[0].value];
          data2.value = [flowData.value[0].total];
          updateChart();
        }

  // 根据指定时间加载数据
  const loadDataByTime = (targetTime) => {
    if (!flowData.value.length) return;

    const currentTimestamp = parseTimeToTimestamp(targetTime);

    // 找到当前时间及之前的所有数据
    const pastData = flowData.value.filter(
      (item) => parseTimeToTimestamp(item.time) <= currentTimestamp
    );

    if (pastData.length) {
      // 一次性加载历史数据
      data1.value = pastData.map((item) => item.flowRate);
      data2.value = pastData.map((item) => item.velocity);
      data3.value = pastData.map((item) => item.depth);
      xAxisData.value = pastData.map((item) => formatTime(item.time));

      // 设置从下一个数据点开始继续更新
      dataIndex.value = pastData.length;

      // 更新最后处理的时间
      lastProcessedTime.value = currentTimestamp;
    } else {
      // 没有历史数据，初始化空数据
      resetLoading();
    }

    updateChart();
  };

  // 处理时间跳变
  const handleTimeJump = (newTime) => {
    const newTimestamp = parseTimeToTimestamp(newTime);
    const timeDiff = Math.abs(newTimestamp - lastProcessedTime.value);

    // 如果时间变化超过5秒，认为是大幅跳变
    if (timeDiff > 5000) {
      stopUpdating();
      loadDataByTime(newTime);

      // 如果不是暂停状态，继续更新
      if (!isPaused.value) {
        startUpdating();
      }
    } catch (error) {
      console.error("数据加载失败:", error);
    }
  };

  // 图表配置（与echarts1保持相同结构和样式）
  // 时间格式化函数（时间戳转"HH:mm:ss"）
  const formatTime = (timestamp) => {
    const date = new Date(timestamp);
    const hours = date.getHours().toString().padStart(2, "0");
    const minutes = date.getMinutes().toString().padStart(2, "0");
    const seconds = date.getSeconds().toString().padStart(2, "0");
    return `${hours}:${minutes}:${seconds}`;
  };

  const loadJsonData = () => {
    const crossSectionData = simStore.crossSection;
    if (crossSectionData?.length) {
      flowData.value = crossSectionData;
      loadDataByTime(nowTime.value); // 加载当前时间之前的数据
    } else {
      resetLoading();
    }
  };

  // 图表配置（保持不变）
  const updateChart = () => {
    const option = {
      animation: false,
@@ -580,19 +703,17 @@
        axisPointer: { type: "cross" },
      },
      grid: {
        // 注释是因为 y轴上的单位被覆盖掉了
        // left: "1%",
        // right: "1%",
        bottom: "1%",
        containLabel: false,
      },
      legend: {
        data: ["实时流量", "累计流量"],
        data: ["实时流量", "流速", "深度"],
        textStyle: { color: "#fff" },
        right: "10px",
        selected: {
          实时流量: true,
          累计流量: true,
          流速: true,
          深度: true,
        },
      },
      xAxis: [
@@ -608,25 +729,32 @@
      yAxis: [
        {
          type: "value",
          name: "单位:m³/min",
          name: "流量(m³/s)",
          min: 0,
          ...calculateDynamicYAxis(data1.value),
          axisLabel: { color: "#fff" },
          splitLine: { show: false },
          nameTextStyle: {
            color: "#fff",
          },
          nameTextStyle: { color: "#fff" },
        },
        {
          type: "value",
          name: "单位:m³",
          name: "流速(m/s)",
          min: 0,
          ...calculateDynamicYAxis(data2.value),
          axisLabel: { color: "#fff" },
          splitLine: { show: true },
          nameTextStyle: {
            color: "#fff",
          },
          nameTextStyle: { color: "#fff" },
        },
        {
          type: "value",
          name: "深度(m)",
          min: 0,
          ...calculateDynamicYAxis(data3.value, true),
          axisLabel: { color: "#fff" },
          splitLine: { show: false },
          nameTextStyle: { color: "#fff" },
          position: "right",
          offset: 80,
        },
      ],
      series: [
@@ -634,75 +762,115 @@
          name: "实时流量",
          type: "bar",
          data: data1.value,
          itemStyle: {
            color: "#3268fe",
          },
          itemStyle: { color: "#3268fe" },
        },
        {
          name: "累计流量",
          name: "流速",
          type: "line",
          yAxisIndex: 1,
          data: data2.value,
          lineStyle: {
            color: "#ffb637",
          },
          lineStyle: { color: "#ffb637" },
        },
        {
          name: "深度",
          type: "line",
          yAxisIndex: 2,
          data: data3.value,
          lineStyle: { color: "#00ff99" },
          symbol: "none",
          smooth: true,
        },
      ],
    };
    myChart2.setOption(option, true);
  };

  // 数据更新（与echarts1相同逻辑）
  // 数据更新（保持不变）
  const updateData = () => {
    if (dataIndex.value < flowData.value.length) {
      const item = flowData.value[dataIndex.value];
      data1.value.push(item.value);
      data2.value.push(item.total);
      xAxisData.value.push(syncTimeWithTimeline());
      data1.value.push(item.flowRate);
      data2.value.push(item.velocity);
      data3.value.push(item.depth);
      xAxisData.value.push(formatTime(item.time));
      dataIndex.value++;
      lastProcessedTime.value = parseTimeToTimestamp(item.time);
      updateChart();
    } else {
      stopUpdating();
    }
  };

  // 控制方法（与echarts1完全一致）
  // 控制方法（保持不变）
  const startUpdating = (interval = 1000) => {
    if (!updateInterval) {
      updateInterval = setInterval(updateData, interval);
    if (!updateInterval.value) {
      updateInterval.value = setInterval(updateData, interval);
    }
  };

  const stopUpdating = () => {
    if (updateInterval) {
      clearInterval(updateInterval);
      updateInterval = null;
    if (updateInterval.value) {
      clearInterval(updateInterval.value);
      updateInterval.value = null;
    }
  };

  const resetLoading = () => {
    stopUpdating();
    dataIndex.value = 0;
    data1.value = [];
    data2.value = [];
    data1.value = [0];
    data2.value = [0];
    data3.value = [0];
    xAxisData.value = ["00:00"];
    if (flowData.value.length > 0) {
      data1.value = [flowData.value[0].value];
      data2.value = [flowData.value[0].total];
    }
    lastProcessedTime.value = 0;
    updateChart();
  };

  // 监听时间轴跳转
  const startNowTimeWatch = () => {
    if (stopNowTimeWatch) stopNowTimeWatch(); // 先停止旧的监听
    stopNowTimeWatch = watch(nowTime, (newTime) => {
      if (!isPaused.value) {
        handleTimeJump(newTime);
      }
    });
  };

  startNowTimeWatch();
  // 初始化
  loadJsonData();

  // 监听全局暂停状态
  watch(isPaused, (newVal) => {
    if (newVal) {
      stopUpdating();
    } else {
      startUpdating();
    }
  });

  return {
    myChart2,
    startUpdating,
    stopUpdating,
    loadJsonData,
    resetLoading,
    startNowTimeWatch,
  };
};

// 监听 simStore.crossSection 的变化
watch(
  () => simStore.crossSection,
  (newVal) => {
    if (newVal && !isPaused.value) {
      chart2Data.value.stopUpdating();
      chart2Data.value.startUpdating();
    }
    chart2Data.value.loadJsonData();
  },
  { deep: true }
);

const handleResize = () => {
  const chartBox1 = document.getElementById("echarts1");
@@ -735,6 +903,8 @@
onUnmounted(() => {
  EventBus.off("reset-table"); // 移除事件监听
  EventBus.off("clear-echart");
  EventBus.off("clear-dM");
  EventBus.off("redraw-dM");
  EventBus.off("time-update"); // 清理事件监听
});
</script>

 src/store/simulation.js

@@ -2,6 +2,8 @@
import { defineStore } from 'pinia'
import { ref } from 'vue'
export const useSimStore = defineStore('simulation', () => {
    // 断面数据
    const crossSection = ref([])
    const openDia = ref(true)
    // 历史回放列表
    const rePlayList = ref([])
@@ -223,6 +225,7 @@
        rePlayList,
        selectNWJ,
        openDia,
        crossSection,

        // 方案相关方法
        setSchemCard,

 src/utils/map.js

@@ -200,7 +200,7 @@
    if (Cesium.defined(picked) && id) {
      const entity = picked?.id;
      const simStore = useSimStore()
      if (entity && !simStore.openDia && entity.attrs.type == '泥位计') {
      if (entity && entity.attrs && !simStore.openDia && entity.attrs.type && entity.attrs.type == '泥位计') {
        let obj = {
          deviceName: entity.attrs.deviceName,
          latitude: entity.attrs.latitude,

 src/views/Screen.vue

@@ -146,11 +146,10 @@
import { useSimStore } from "@/store/simulation";
import { storeToRefs } from "pinia";
const simStore = useSimStore();
// const { showDangerAssess, rightRiverShow } = storeToRefs(simStore);

function flyToHomeView() {
  simStore.setBackToHome(true);
  // rightRiverShow.value = false;
  // showDangerAssess.value = false;

  router.push("/");
  const view = {
    destination: {