fix: resolve options deep copy issue in deepMerge function

Author: hongfaqiu

example/CHANGELOG.md

@@ -1,5 +1,12 @@
 # example
 
+## 0.4.3
+
+### Patch Changes
+
+- Updated dependencies
+  - cesium-wind-layer@0.7.2
+
 ## 0.4.2
 
 ### Patch Changes

example/package.json

@@ -1,7 +1,7 @@
 {
   "name": "example",
   "private": true,
-  "version": "0.4.2",
+  "version": "0.4.3",
   "type": "module",
   "scripts": {
     "dev": "vite",

packages/cesium-wind-layer/CHANGELOG.md

@@ -1,5 +1,11 @@
 # cesium-wind-layer
 
+## 0.7.2
+
+### Patch Changes
+
+- fix: resolve options deep copy issue in deepMerge function
+
 ## 0.7.1
 
 ### Patch Changes

packages/cesium-wind-layer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cesium-wind-layer",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "publishConfig": {
     "access": "public"
   },

packages/cesium-wind-layer/src/index.ts

@@ -9,6 +9,7 @@ import {
 
 import { WindLayerOptions, WindData, WindDataAtLonLat } from './types';
 import { WindParticleSystem } from './windParticleSystem';
+import { deepMerge } from './utils';
 
 export * from './types';
 
@@ -308,13 +309,17 @@ export class WindLayer {
    */
   updateOptions(options: Partial<WindLayerOptions>): void {
     if (this._isDestroyed) return;
-    this.options = { ...this.options, ...options };
+    this.options = deepMerge(options, this.options);
     this.particleSystem.changeOptions(options);
     this.viewer.scene.requestRender();
     // Dispatch options change event
     this.dispatchEvent('optionsChange', this.options);
   }
 
+  /**
+   * Zoom to the wind data bounds.
+   * @param {number} [duration=0] - The duration of the zoom animation.
+   */
   zoomTo(duration: number = 0): void {
     if (this.windData.bounds) {
       const rectangle = Rectangle.fromDegrees(
@@ -330,24 +335,37 @@ export class WindLayer {
     }
   }
 
+  /**
+   * Add the wind layer to the scene.
+   */
   add(): void {
     this.primitives = this.particleSystem.getPrimitives();
     this.primitives.forEach(primitive => {
       this.scene.primitives.add(primitive);
     });
   }
 
+  /**
+   * Remove the wind layer from the scene.
+   */
   remove(): void {
     this.primitives.forEach(primitive => {
       this.scene.primitives.remove(primitive);
     });
     this.primitives = [];
   }
 
+  /**
+   * Check if the wind layer is destroyed.
+   * @returns {boolean} - True if the wind layer is destroyed, otherwise false.
+   */
   isDestroyed(): boolean {
     return this._isDestroyed;
   }
 
+  /**
+   * Destroy the wind layer and release all resources.
+   */
   destroy(): void {
     this.remove();
     this.removeEventListeners();
@@ -364,13 +382,23 @@ export class WindLayer {
     });
   }
 
+  /**
+   * Add an event listener for the specified event type.
+   * @param {WindLayerEventType} type - The type of event to listen for.
+   * @param {WindLayerEventCallback} callback - The callback function to execute when the event occurs.
+   */
   addEventListener(type: WindLayerEventType, callback: WindLayerEventCallback) {
     if (!this.eventListeners.has(type)) {
       this.eventListeners.set(type, new Set());
     }
     this.eventListeners.get(type)?.add(callback);
   }
 
+  /**
+   * Remove an event listener for the specified event type.
+   * @param {WindLayerEventType} type - The type of event to remove.
+   * @param {WindLayerEventCallback} callback - The callback function to remove.
+   */
   removeEventListener(type: WindLayerEventType, callback: WindLayerEventCallback) {
     this.eventListeners.get(type)?.delete(callback);
   }

packages/cesium-wind-layer/src/utils.ts

@@ -0,0 +1,34 @@
+export function deepMerge<T extends Record<string, any>>(from: Partial<T>, to: T): T {
+  // Handle null or undefined cases
+  if (!from) return to;
+  if (!to) return from as T;
+
+  // Create a new object to avoid modifying the original
+  const result = { ...to };
+
+  for (const key in from) {
+    if (Object.prototype.hasOwnProperty.call(from, key)) {
+      const fromValue = from[key];
+      const toValue = to[key];
+
+      // Handle array case
+      if (Array.isArray(fromValue)) {
+        result[key] = fromValue.slice();
+        continue;
+      }
+
+      // Handle object case
+      if (fromValue && typeof fromValue === 'object') {
+        result[key] = deepMerge(fromValue, toValue || {}) as T[Extract<keyof T, string>];
+        continue;
+      }
+
+      // Handle primitive values
+      if (fromValue !== undefined) {
+        result[key] = fromValue;
+      }
+    }
+  }
+
+  return result;
+}

packages/cesium-wind-layer/src/windParticleSystem.ts

@@ -3,6 +3,7 @@ import { WindParticlesComputing } from './windParticlesComputing';
 import { WindParticlesRendering } from './windParticlesRendering';
 import CustomPrimitive from './customPrimitive';
 import { ClearCommand, Color, Pass } from 'cesium';
+import { deepMerge } from './utils';
 
 export class WindParticleSystem {
   computing: WindParticlesComputing;
@@ -50,10 +51,7 @@ export class WindParticleSystem {
       maxParticlesChanged = true;
     }
 
-    const newOptions = {
-      ...this.options,
-      ...options
-    }
+    const newOptions = deepMerge(options, this.options);
     if (newOptions.particlesTextureSize < 1) {
       throw new Error('particlesTextureSize must be greater than 0');
     }

packages/cesium-wind-layer/src/windParticlesComputing.ts

@@ -2,6 +2,7 @@ import { PixelDatatype, PixelFormat, Sampler, Texture, TextureMagnificationFilte
 import { WindLayerOptions, WindData } from './types';
 import { ShaderManager } from './shaderManager';
 import CustomPrimitive from './customPrimitive'
+import { deepMerge } from './utils';
 
 export class WindParticlesComputing {
   context: any;
@@ -221,7 +222,7 @@ export class WindParticlesComputing {
 
   updateOptions(options: Partial<WindLayerOptions>) {
     const needUpdateWindTextures = options.flipY !== this.options.flipY;
-    this.options = { ...this.options, ...options };
+    this.options = deepMerge(options, this.options);
     if (needUpdateWindTextures) {
       this.reCreateWindTextures();
     }

packages/cesium-wind-layer/src/windParticlesRendering.ts

@@ -3,6 +3,7 @@ import { WindLayerOptions } from './types';
 import { WindParticlesComputing } from './windParticlesComputing';
 import CustomPrimitive from './customPrimitive';
 import { ShaderManager } from './shaderManager';
+import { deepMerge } from './utils';
 
 export class WindParticlesRendering {
   private context: any;
@@ -251,7 +252,7 @@ export class WindParticlesRendering {
       JSON.stringify(options.colors) !== JSON.stringify(this.options.colors);
 
     // Update options first
-    this.options = { ...this.options, ...options };
+    this.options = deepMerge(options, this.options);
 
     // Then update color table if needed
     if (needUpdateColorTable) {