123

wangjuncheng

2025-06-16 4b7b8185bdce4272cd5f256fcc777056f54add6d

 src/utils/water.js

@@ -1,5 +1,8 @@
import { cartesianToXY } from "@/utils/map";

import { useSimStore } from "@/store/simulation";
import { storeToRefs } from "pinia";
const simStore = useSimStore();
const { waterLegendData } = storeToRefs(simStore);
let water = null;

/**
@@ -17,20 +20,75 @@
 * 创建水体模拟层
 * @param {Object} options - 可选参数
 * @param {number} options.interval - 水体模拟的时间间隔（单位：毫秒）
 * @param {string} options.baseUrl - 仿真服务地址
 * @param {boolean} options.colorRender - 是否启用颜色渲染
 */
export function createWaterPrimitive(options = {}) {
  const { interval = 1000 } = options; // 默认 interval 为 1000
  const {
    baseUrl = "/simu/c2h1dc",
    interval = 1000,
    colorRender = true,
    minFlowRate = 0.1,   // 新增参数
    maxFlowRate = 12     // 新增参数
  } = options;

  // 定义水深颜色映射的色标
  const colorStops = [
    "#09a2dc", "#58c196", "#bedf74", "#d7f06e",
    "#ffe930", "#fdd10a", "#feb652", "#fd7f06",
    "#fe2b07", "#4d0a08"
  ];

  const levelCount = colorStops.length;
  const minAllowed = 0.01; // 最小允许值
  const threshold = 1;     // 小值与大值分界点

  let effectiveMin = Math.max(minFlowRate, minAllowed); // 最小不能小于 0.01

  const waterHeightLevels = [];

  // 分两段构造高度数组
  for (let i = 0; i < levelCount; i++) {
    let ratio = i / (levelCount - 1); // 0 ~ 1

    let height;
    if (ratio <= 0.5) {
      // 前半段：低值区域，使用强指数增长，从 effectiveMin 到 threshold
      const localRatio = ratio * 2; // 映射到 0~1
      const expRatio = Math.pow(localRatio, 2); // 更强调低值区域密度
      height = effectiveMin + (threshold - effectiveMin) * expRatio;
    } else {
      // 后半段：高值区域，从 threshold 到 maxFlowRate，使用指数增长
      const localRatio = (ratio - 0.5) * 2; // 映射到 0~1
      const expBase = Math.exp(Math.log(maxFlowRate / threshold) / 1);
      height = threshold * Math.pow(expBase, localRatio);
    }

    waterHeightLevels.push({
      height: parseFloat(height.toFixed(2)), // 保留两位小数
      color: colorStops[i]
    });
  }

  waterLegendData.value = waterHeightLevels;
  console.log(waterLegendData.value, '图例数据');

  // 创建图层
  water = earthCtrl.simulate.createWaterSimulateLayer({
    baseUrl: "/simu/c2h1dc", // 仿真服务 URL
    interval, // 动态设置 interval
    color: new SmartEarth.Cesium.Color.fromCssColorString("#D4F2E7"),
    loop: false, // 是否循环播放
    callback: timeCallback, // 回调函数
    baseUrl,
    interval,
    color: SmartEarth.Cesium.Color.fromCssColorString("#D4F2E7"),
    loop: false,
    callback: timeCallback,
    alphaByDepth: -0.3,
    waterHeightLevels,
    colorRender,
  });
  console.log(`Water simulation started with interval: ${interval}ms`);
}

  console.log(
    `仿真模拟参数：请求路径 ${baseUrl}, 帧间间隔 ${interval}ms, 是否开启专题渲染 ${colorRender}`
  );
}
/**
 * 初始化水体模拟视图
 */
@@ -48,7 +106,7 @@
    },
  };
  viewer.scene.camera.flyTo(view);
  console.log("Camera view initialized for water simulation.");
  // console.log("Camera view initialized for water simulation.");
}

/**
@@ -57,7 +115,7 @@
export function pauseWaterSimulation() {
  if (water) {
    water.pause();
    console.log("Water simulation paused.");
    console.log("暂停仿真");
  } else {
    console.warn("No water simulation to pause.");
  }
@@ -69,7 +127,7 @@
export function resumeWaterSimulation() {
  if (water) {
    water.resume();
    console.log("Water simulation resumed.");
    console.log("继续仿真");
  } else {
    console.warn("No water simulation to resume.");
  }
@@ -77,24 +135,36 @@

/**
 * 跳转到某个时间点的水面状态
 * @param {number} closestIndex - 目标时间戳索引
 */
export function setTimeForWaterSimulation(closestIndex) {
  console.log(closestIndex,'index');
  
  if (water) {
    const imageList = water.getTimeList(); // 获取所有可用时间戳
    if (imageList.length === 0) {
    const imageList = water.getTimeList();

    if (!imageList.length) {
      console.warn("No timestamps available for water simulation.");
      return;
    }
    const idx = Math.floor(Math.random() * imageList.length); // 随机选择一个时间戳
    // const idx = Math.floor(Math.random() * imageList.length); //随机索引跳转，实际中用不到，只用作演示
    console.log(
      `Jumping to timestamp: count:[${imageList.length}], index:[${idx}]`
      `Jumping to timestamp: count:[${imageList.length}], index:[${closestIndex}]`
    );
    
    water.setTime(imageList[closestIndex]); // 设置时间戳，跳转到对应时刻
    water.setTime(imageList[closestIndex]);
  } else {
    console.warn("No water simulation to set time for.");
  }
}

/**
 * 设置或关闭颜色渲染
 * @param {boolean} enabled
 */
export function toggleWaterColorRender(enabled) {
  if (water) {
    water.colorRender = enabled;
    console.log(`是否开启专题渲染 ${enabled}`);
  } else {
    console.warn("No water simulation to toggle color rendering.");
  }
}

@@ -103,5 +173,5 @@
 * @param {number} timeStamp - 当前时间戳
 */
function timeCallback(timeStamp) {
  console.log(`Current timestamp: ${timeStamp}`);
}
  // console.log(`Current timestamp: ${timeStamp}`);
}