wangjuncheng
2025-06-25 1190b6e0bea6f91b85b8e1b574300b18aac3e562
11111111
已修改3个文件
145 ■■■■ 文件已修改
src/components/menu/TimeLine.vue 109 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/monifangzhen/echartInfo.vue 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/utils/water.js 35 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/menu/TimeLine.vue
@@ -201,6 +201,7 @@
});
let minFlowRate = ref();
let maxFlowRate = ref();
let maxStage = null;
// 计算属性
const progressPercentage = computed(
  () => (currentTime.value / duration.value) * 100
@@ -463,36 +464,94 @@
function updateWaterColorByTime() {
  if (!rainTotalInfo.value || rainTotalInfo.value.length === 0) return;
  // 辅助函数:将 "YYYY-MM-DD HH:mm:ss" 转换为 JavaScript Date 对象
  const timeToTimestamp = (timeStr) => new Date(timeStr).getTime();
  // 获取初始时间戳(第一个数据点的时间)
  const initialTimestamp = timeToTimestamp(rainTotalInfo.value[0].time);
  // 计算当前进度
  const progress = currentTime.value / duration.value;
  const floatIndex = progress * (rainTotalInfo.value.length - 1);
  const index = Math.floor(floatIndex);
  const nextIndex = Math.min(index + 1, rainTotalInfo.value.length - 1);
  const currentData = rainTotalInfo.value[index];
  const nextData = rainTotalInfo.value[nextIndex];
  const currentTimestamp = timeToTimestamp(currentData.time);
  // 已过去的时间(小时)
  const elapsedTimeInHours = parseFloat((currentTimestamp - initialTimestamp) / (1000 * 60 * 60));
  console.log(`持续了 ${elapsedTimeInHours} 小时`);
  // 启用插值(alpha 平滑过渡)
  const alpha = floatIndex - index;
  const currentTotal = currentData.total;
  const nextTotal = nextData.total;
  const total = currentTotal + (nextTotal - currentTotal) * alpha;
  console.log(`计算得到的时间步长为: ${timeStepInfo} 小时`);
  // 根据 total 设置颜色
  let color = "#D4F2E7"; // 默认蓝色
  const currentIntensity = currentData.intensity;
  const nextIntensity = nextData.intensity;
  const intensity = currentIntensity + (nextIntensity - currentIntensity);
  // 计算 IR(t)
  const D = elapsedTimeInHours + 0.0001; // 加一个极小量防止除零
  const IR = 56.9 * Math.pow(D, -0.746); // 单位 mm/h
  if (total >= 150) {
    color = '#663300';
  } else if (total >= 125) {
    color = '#B26633';
  } else if (total >= 100) {
    color = '#CC9966';
  } else if (total >= 75) {
    color = '#CCE5FF';
  } else if (total >= 50) {
    color = '#99CCFF';
  } else if (total >= 25) {
    color = '#66B3FF';
  // 判断当前阶段
  let stage = 0;
  if (intensity >= 1.0 * IR) {
    stage = 6;
  } else if (intensity >= 0.8 * IR) {
    stage = 5;
  } else if (intensity >= 0.6 * IR) {
    stage = 4;
  } else if (intensity >= 0.4 * IR) {
    stage = 3;
  } else if (intensity >= 0.2 * IR) {
    stage = 2;
  } else if (intensity > 0) {
    stage = 1;
  }
  // console.log(`当前 total: ${total.toFixed(2)}, 颜色: ${color}`);
  // updateWaterColor(color)
  // 更新全局最大阶段(不会回退)
  if (!maxStage) maxStage = 0;
  maxStage = Math.max(maxStage, stage);
  // 输出关键信息
  console.table({
    '当前时间': currentData.time,
    '累计时长 D(t) (h)': D.toFixed(2),
    '雨强阈值 IR(t) (mm/h)': IR.toFixed(2),
    '当前降雨强度 I(t) (mm/h)': intensity.toFixed(2),
    '当前阶段编号': stage,
    '最大阶段编号': maxStage,
    '是否触发泥石流': stage >= 5 ? '是' : '否'
  });
  // 根据最大阶段设置颜色
  let color = "#D4F2E7";
  switch (maxStage) {
    case 0:
      color = "#D4F2E7";
      break;
    case 1:
      color = "#66B3FF";
      break;
    case 2:
      color = "#99CCFF";
      break;
    case 3:
      color = "#CCE5FF";
      break;
    case 4:
      color = "#CC9966";
      break;
    case 5:
      color = "#B26633";
      break;
    case 6:
      color = "#663300";
      break;
  }
  updateWaterColor(color);
}
function updateWeatherByProgress() {
@@ -509,11 +568,11 @@
  // const rainValue = currentRain + (nextRain - currentRain) * alpha;
  const rainValue = currentRain + (nextRain - currentRain);
  // 打印当前处理的雨量数据
  console.log(
    `正在处理的雨量数据点: 当前=${currentRain}, 下一个=${nextRain}, 插值后=${rainValue.toFixed(
      2
    )}, 索引=${index}`
  );
  // console.log(
  //   `正在处理的雨量数据点: 当前=${currentRain}, 下一个=${nextRain}, 插值后=${rainValue.toFixed(
  //     2
  //   )}, 索引=${index}`
  // );
  // 如果当前索引未变化且插值差异不大,跳过重复更新
  if (index === lastUsedIndex && Math.abs(rainValue - lastRainValue) < 0.1) {
    // console.log('由于数据无显著变化,跳过本次更新');
src/components/monifangzhen/echartInfo.vue
@@ -309,7 +309,6 @@
  if (nowTime.value) {
    const timeParts = nowTime.value.split(" ");
    const timeOnly = timeParts[1]; // 获取 "mm:ss" 部分
    console.log(nowTime.value, "nowTime.valuenowTime.value");
    return timeOnly;
  }
};
src/utils/water.js
@@ -12,7 +12,7 @@
    enableWaterArrowFlow(false);
    water.destroy();
    water = null;
    console.log("Water simulation destroyed.");
    // console.log("Water simulation destroyed.");
  }
}
@@ -78,25 +78,26 @@
  }
  waterLegendData.value = waterHeightLevels;
  console.log(waterLegendData.value, "图例数据");
  // console.log(waterLegendData.value, "图例数据");
  water = await earthCtrl.simulate.createWaterSimulateLayer({
    baseUrl,
    interval,
    color: SmartEarth.Cesium.Color.fromCssColorString("#D4F2E7"),
    loop: false,
    callback: timeCallback,
    alphaByDepth: -0.3,
    // alphaByDepth: -0.3,
    alphaByDepth: -0.8,
    waterHeightLevels,
    colorRender,
    sizeIndex: 0,
  });
  enableWaterArrowFlow(false);
  // enableWaterArrowFlow(false);
  toggleWaterShadow(false);
  console.log(
    `仿真模拟参数:请求路径 ${baseUrl}, 帧间间隔 ${interval}ms, 是否开启专题渲染 ${colorRender}`
  );
  // console.log(
  //   `仿真模拟参数:请求路径 ${baseUrl}, 帧间间隔 ${interval}ms, 是否开启专题渲染 ${colorRender}`
  // );
}
/**
 * 初始化水体模拟视图
@@ -123,7 +124,7 @@
export function updateWaterColor(color) {
  if (water) {
    water.color = Cesium.Color.fromCssColorString(color);
    console.log("切换颜色为:",color);
    // console.log("切换颜色为:",color);
  } else {
    console.warn("No water simulation to pause.");
  }
@@ -134,7 +135,7 @@
export function pauseWaterSimulation() {
  if (water) {
    water.pause();
    console.log("暂停仿真");
    // console.log("暂停仿真");
  } else {
    console.warn("No water simulation to pause.");
  }
@@ -146,7 +147,7 @@
export function resumeWaterSimulation() {
  if (water) {
    water.resume();
    console.log("继续仿真");
    // console.log("继续仿真");
  } else {
    console.warn("No water simulation to resume.");
  }
@@ -165,9 +166,9 @@
      return;
    }
    // const idx = Math.floor(Math.random() * imageList.length); //随机索引跳转,实际中用不到,只用作演示
    console.log(
      `Jumping to timestamp: count:[${imageList.length}], index:[${closestIndex}]`
    );
    // console.log(
    //   `Jumping to timestamp: count:[${imageList.length}], index:[${closestIndex}]`
    // );
    water.setTime(imageList[closestIndex]);
  } else {
    console.warn("No water simulation to set time for.");
@@ -181,7 +182,7 @@
export function toggleWaterColorRender(enabled) {
  if (water) {
    water.colorRender = enabled;
    console.log(`是否开启专题渲染 ${enabled}`);
    // console.log(`是否开启专题渲染 ${enabled}`);
  } else {
    console.warn("No water simulation to toggle color rendering.");
  }
@@ -196,7 +197,7 @@
  if (water) {
    // 默认关闭状态
    water.flowEnabled = enabled; // 假设 SDK 支持此属性
    console.log(`箭头流向动画已${enabled ? "开启" : "关闭"}`);
    // console.log(`箭头流向动画已${enabled ? "开启" : "关闭"}`);
  } else {
    console.warn("未找到水体模拟图层,请先启动洪水模拟");
  }
@@ -218,7 +219,7 @@
      earthCtrl.shadowMap.maximumDistance = 10000.0; //最大距离
      earthCtrl.shadowMap.pointLightRadius = 50.0; //点光源半径
    }
    console.log(`阴影效果已${enabled ? "开启" : "关闭"}`);
    // console.log(`阴影效果已${enabled ? "开启" : "关闭"}`);
  } catch (error) {
    console.error("设置阴影失败:", error);
  }