@operato/weather 9.0.0-beta.56

package/dist/src/layers/cloud-layer.js

@@ -0,0 +1,203 @@
+import VectorSource from 'ol/source/Vector';
+import VectorLayer from 'ol/layer/Vector';
+import Feature from 'ol/Feature';
+import { fromLonLat } from 'ol/proj';
+import { Style, Fill } from 'ol/style';
+import Polygon from 'ol/geom/Polygon';
+import { BaseWeatherLayer } from './base-weather-layer.js';
+/**
+ * 구름 레이어 구현
+ */
+export class CloudLayer extends BaseWeatherLayer {
+    getType() {
+        return 'cloud';
+    }
+    /**
+     * 벡터 레이어를 생성하여 구름을 표현합니다.
+     */
+    createLayer() {
+        const source = new VectorSource();
+        if (!this.weatherData || this.weatherData.length === 0) {
+            return new VectorLayer({
+                source,
+                zIndex: 7
+            });
+        }
+        // 각 데이터 포인트의 위치와 구름 커버리지 추출
+        const points = this.weatherData.map(data => ({
+            lon: data.location.longitude,
+            lat: data.location.latitude,
+            coverage: data.cloud.coverage / 100
+        }));
+        console.log('구름 데이터 포인트:', points.length, '첫 번째 포인트:', points[0]);
+        // 개선된 구름 커버리지 보간 함수 - IDW(Inverse Distance Weighting) 기반 보간법
+        const interpolateCoverage = (lon, lat) => {
+            // 가장 가까운 이웃 개수 제한 - 모든 포인트 대신 가까운 포인트만 사용하여 국지적 패턴 유지
+            const MAX_NEIGHBORS = 5;
+            // 현재 위치에서 모든 포인트까지의 거리 계산
+            const distances = points.map(point => {
+                const dx = lon - point.lon;
+                const dy = lat - point.lat;
+                return {
+                    point,
+                    dist: Math.sqrt(dx * dx + dy * dy)
+                };
+            });
+            // 거리에 따라 정렬하고 가장 가까운 이웃만 선택
+            const nearestNeighbors = distances.sort((a, b) => a.dist - b.dist).slice(0, MAX_NEIGHBORS);
+            // 포인트가 정확히 일치하는 경우
+            if (nearestNeighbors.length > 0 && nearestNeighbors[0].dist < 0.0001) {
+                return nearestNeighbors[0].point.coverage;
+            }
+            // 역거리 가중치 보간법 적용 - 거리의 제곱에 반비례하는 가중치 사용
+            let totalWeight = 0;
+            let weightedCoverage = 0;
+            // 가중치 지수 - 낮을수록 더 부드러운 보간, 높을수록 가까운 값에 더 큰 영향
+            const power = 1.5;
+            nearestNeighbors.forEach(({ point, dist }) => {
+                // 작은 값으로 나누기 방지
+                const adjustedDist = Math.max(dist, 0.0001);
+                const weight = 1 / Math.pow(adjustedDist, power);
+                totalWeight += weight;
+                weightedCoverage += point.coverage * weight;
+            });
+            return weightedCoverage / totalWeight;
+        };
+        // 구름 커버리지에 따른 색상 계산 함수
+        const getColorFromCoverage = (coverage) => {
+            // 흰색에서 짙은 회색으로 그라데이션 (구름 농도가 짙을수록 더 어두워짐)
+            const intensity = Math.min(1, Math.max(0, coverage));
+            // 더 어두운 회색으로 조정
+            const brightness = Math.round(255 - intensity * 130);
+            // 구름 농도에 따라 투명도 조정 - 옅은 구름은 더 투명하게
+            const alpha = 0.2 + intensity * 0.6;
+            return `rgba(${brightness}, ${brightness}, ${brightness}, ${alpha})`;
+        };
+        // 그라데이션을 적용할 그리드 생성
+        const bounds = {
+            minLon: Infinity,
+            maxLon: -Infinity,
+            minLat: Infinity,
+            maxLat: -Infinity
+        };
+        // 데이터 포인트로부터 영역 경계 계산
+        points.forEach(point => {
+            bounds.minLon = Math.min(bounds.minLon, point.lon);
+            bounds.maxLon = Math.max(bounds.maxLon, point.lon);
+            bounds.minLat = Math.min(bounds.minLat, point.lat);
+            bounds.maxLat = Math.max(bounds.maxLat, point.lat);
+        });
+        // 경계에 마진 추가
+        const margin = 0.1;
+        bounds.minLon -= margin;
+        bounds.maxLon += margin;
+        bounds.minLat -= margin;
+        bounds.maxLat += margin;
+        // 고해상도 그리드 생성 (더 매끄러운 그라데이션을 위해)
+        const gridResolution = 80; // 적절한 해상도로 조정
+        const lonStep = (bounds.maxLon - bounds.minLon) / gridResolution;
+        const latStep = (bounds.maxLat - bounds.minLat) / gridResolution;
+        // 인접 셀 간의 값 차이 최소화를 위한 스무딩 함수
+        const smoothGrid = (grid, passes = 2) => {
+            const rows = grid.length;
+            if (rows === 0)
+                return grid;
+            const cols = grid[0].length;
+            const result = Array(rows)
+                .fill(0)
+                .map(() => Array(cols).fill(0));
+            // 여러 번 스무딩 패스 적용
+            for (let pass = 0; pass < passes; pass++) {
+                const currentGrid = pass === 0 ? grid : result;
+                for (let i = 0; i < rows; i++) {
+                    for (let j = 0; j < cols; j++) {
+                        // 현재 셀과 인접 셀의 평균 계산
+                        let sum = currentGrid[i][j];
+                        let count = 1;
+                        // 상하좌우 셀 확인
+                        const neighbors = [
+                            [i - 1, j],
+                            [i + 1, j],
+                            [i, j - 1],
+                            [i, j + 1]
+                        ];
+                        neighbors.forEach(([ni, nj]) => {
+                            if (ni >= 0 && ni < rows && nj >= 0 && nj < cols) {
+                                sum += currentGrid[ni][nj];
+                                count++;
+                            }
+                        });
+                        // 평균값으로 스무딩 (약간의 원본 가중치 부여)
+                        result[i][j] = currentGrid[i][j] * 0.6 + ((sum - currentGrid[i][j]) / (count - 1)) * 0.4;
+                    }
+                }
+            }
+            return result;
+        };
+        // 구름 데이터 그리드 생성
+        const coverageGrid = [];
+        for (let i = 0; i < gridResolution; i++) {
+            coverageGrid[i] = [];
+            for (let j = 0; j < gridResolution; j++) {
+                const centerLon = bounds.minLon + (j + 0.5) * lonStep;
+                const centerLat = bounds.minLat + (i + 0.5) * latStep;
+                coverageGrid[i][j] = interpolateCoverage(centerLon, centerLat);
+            }
+        }
+        // 그리드 스무딩 적용
+        const smoothedGrid = smoothGrid(coverageGrid, 2);
+        // 셀 생성 및 피처 추가
+        for (let i = 0; i < gridResolution; i++) {
+            for (let j = 0; j < gridResolution; j++) {
+                const lonMin = bounds.minLon + j * lonStep;
+                const lonMax = bounds.minLon + (j + 1) * lonStep;
+                const latMin = bounds.minLat + i * latStep;
+                const latMax = bounds.minLat + (i + 1) * latStep;
+                // 스무딩된 값 사용
+                const interpolatedCoverage = smoothedGrid[i][j];
+                // 너무 작은 커버리지는 제외
+                if (interpolatedCoverage < 0.01)
+                    continue;
+                // 셀 좌표 계산 및 변환
+                const coordinates = [
+                    [lonMin, latMin],
+                    [lonMax, latMin],
+                    [lonMax, latMax],
+                    [lonMin, latMax],
+                    [lonMin, latMin]
+                ].map(coord => fromLonLat(coord));
+                // 다각형 피처 생성
+                const feature = new Feature({
+                    geometry: new Polygon([coordinates]),
+                    coverage: interpolatedCoverage
+                });
+                source.addFeature(feature);
+            }
+        }
+        // 벡터 레이어 생성
+        return new VectorLayer({
+            source,
+            zIndex: 7,
+            className: 'cloud-layer',
+            opacity: 0.9,
+            style: feature => {
+                const coverage = feature.get('coverage');
+                return new Style({
+                    fill: new Fill({
+                        color: getColorFromCoverage(coverage)
+                    }),
+                    // 경계선 완전히 제거
+                    stroke: undefined
+                });
+            }
+        });
+    }
+    /**
+     * 레이어에 날씨 데이터를 설정합니다.
+     */
+    setWeatherData(data) {
+        this.weatherData = data;
+        this.updateLayer();
+    }
+}
+//# sourceMappingURL=cloud-layer.js.map

package/dist/src/layers/cloud-layer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cloud-layer.js","sourceRoot":"","sources":["../../../src/layers/cloud-layer.ts"],"names":[],"mappings":"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","sourcesContent":["import BaseLayer from 'ol/layer/Base'\nimport VectorSource from 'ol/source/Vector'\nimport VectorLayer from 'ol/layer/Vector'\nimport Feature from 'ol/Feature'\nimport Point from 'ol/geom/Point'\nimport { fromLonLat } from 'ol/proj'\nimport { Style, Fill, Stroke } from 'ol/style'\nimport Polygon from 'ol/geom/Polygon'\n\nimport { BaseWeatherLayer } from './base-weather-layer.js'\nimport { WeatherData, WeatherLayerType } from '../types.js'\n\n/**\n * 구름 레이어 구현\n */\nexport class CloudLayer extends BaseWeatherLayer {\n  getType(): WeatherLayerType {\n    return 'cloud'\n  }\n\n  /**\n   * 벡터 레이어를 생성하여 구름을 표현합니다.\n   */\n  createLayer(): BaseLayer {\n    const source = new VectorSource()\n\n    if (!this.weatherData || this.weatherData.length === 0) {\n      return new VectorLayer({\n        source,\n        zIndex: 7\n      })\n    }\n\n    // 각 데이터 포인트의 위치와 구름 커버리지 추출\n    const points = this.weatherData.map(data => ({\n      lon: data.location.longitude,\n      lat: data.location.latitude,\n      coverage: data.cloud.coverage / 100\n    }))\n\n    console.log('구름 데이터 포인트:', points.length, '첫 번째 포인트:', points[0])\n\n    // 개선된 구름 커버리지 보간 함수 - IDW(Inverse Distance Weighting) 기반 보간법\n    const interpolateCoverage = (lon: number, lat: number) => {\n      // 가장 가까운 이웃 개수 제한 - 모든 포인트 대신 가까운 포인트만 사용하여 국지적 패턴 유지\n      const MAX_NEIGHBORS = 5\n\n      // 현재 위치에서 모든 포인트까지의 거리 계산\n      const distances = points.map(point => {\n        const dx = lon - point.lon\n        const dy = lat - point.lat\n        return {\n          point,\n          dist: Math.sqrt(dx * dx + dy * dy)\n        }\n      })\n\n      // 거리에 따라 정렬하고 가장 가까운 이웃만 선택\n      const nearestNeighbors = distances.sort((a, b) => a.dist - b.dist).slice(0, MAX_NEIGHBORS)\n\n      // 포인트가 정확히 일치하는 경우\n      if (nearestNeighbors.length > 0 && nearestNeighbors[0].dist < 0.0001) {\n        return nearestNeighbors[0].point.coverage\n      }\n\n      // 역거리 가중치 보간법 적용 - 거리의 제곱에 반비례하는 가중치 사용\n      let totalWeight = 0\n      let weightedCoverage = 0\n\n      // 가중치 지수 - 낮을수록 더 부드러운 보간, 높을수록 가까운 값에 더 큰 영향\n      const power = 1.5\n\n      nearestNeighbors.forEach(({ point, dist }) => {\n        // 작은 값으로 나누기 방지\n        const adjustedDist = Math.max(dist, 0.0001)\n        const weight = 1 / Math.pow(adjustedDist, power)\n\n        totalWeight += weight\n        weightedCoverage += point.coverage * weight\n      })\n\n      return weightedCoverage / totalWeight\n    }\n\n    // 구름 커버리지에 따른 색상 계산 함수\n    const getColorFromCoverage = (coverage: number) => {\n      // 흰색에서 짙은 회색으로 그라데이션 (구름 농도가 짙을수록 더 어두워짐)\n      const intensity = Math.min(1, Math.max(0, coverage))\n\n      // 더 어두운 회색으로 조정\n      const brightness = Math.round(255 - intensity * 130)\n\n      // 구름 농도에 따라 투명도 조정 - 옅은 구름은 더 투명하게\n      const alpha = 0.2 + intensity * 0.6\n\n      return `rgba(${brightness}, ${brightness}, ${brightness}, ${alpha})`\n    }\n\n    // 그라데이션을 적용할 그리드 생성\n    const bounds = {\n      minLon: Infinity,\n      maxLon: -Infinity,\n      minLat: Infinity,\n      maxLat: -Infinity\n    }\n\n    // 데이터 포인트로부터 영역 경계 계산\n    points.forEach(point => {\n      bounds.minLon = Math.min(bounds.minLon, point.lon)\n      bounds.maxLon = Math.max(bounds.maxLon, point.lon)\n      bounds.minLat = Math.min(bounds.minLat, point.lat)\n      bounds.maxLat = Math.max(bounds.maxLat, point.lat)\n    })\n\n    // 경계에 마진 추가\n    const margin = 0.1\n    bounds.minLon -= margin\n    bounds.maxLon += margin\n    bounds.minLat -= margin\n    bounds.maxLat += margin\n\n    // 고해상도 그리드 생성 (더 매끄러운 그라데이션을 위해)\n    const gridResolution = 80 // 적절한 해상도로 조정\n    const lonStep = (bounds.maxLon - bounds.minLon) / gridResolution\n    const latStep = (bounds.maxLat - bounds.minLat) / gridResolution\n\n    // 인접 셀 간의 값 차이 최소화를 위한 스무딩 함수\n    const smoothGrid = (grid: number[][], passes: number = 2): number[][] => {\n      const rows = grid.length\n      if (rows === 0) return grid\n\n      const cols = grid[0].length\n      const result = Array(rows)\n        .fill(0)\n        .map(() => Array(cols).fill(0))\n\n      // 여러 번 스무딩 패스 적용\n      for (let pass = 0; pass < passes; pass++) {\n        const currentGrid = pass === 0 ? grid : result\n\n        for (let i = 0; i < rows; i++) {\n          for (let j = 0; j < cols; j++) {\n            // 현재 셀과 인접 셀의 평균 계산\n            let sum = currentGrid[i][j]\n            let count = 1\n\n            // 상하좌우 셀 확인\n            const neighbors = [\n              [i - 1, j],\n              [i + 1, j],\n              [i, j - 1],\n              [i, j + 1]\n            ]\n\n            neighbors.forEach(([ni, nj]) => {\n              if (ni >= 0 && ni < rows && nj >= 0 && nj < cols) {\n                sum += currentGrid[ni][nj]\n                count++\n              }\n            })\n\n            // 평균값으로 스무딩 (약간의 원본 가중치 부여)\n            result[i][j] = currentGrid[i][j] * 0.6 + ((sum - currentGrid[i][j]) / (count - 1)) * 0.4\n          }\n        }\n      }\n\n      return result\n    }\n\n    // 구름 데이터 그리드 생성\n    const coverageGrid: number[][] = []\n\n    for (let i = 0; i < gridResolution; i++) {\n      coverageGrid[i] = []\n      for (let j = 0; j < gridResolution; j++) {\n        const centerLon = bounds.minLon + (j + 0.5) * lonStep\n        const centerLat = bounds.minLat + (i + 0.5) * latStep\n        coverageGrid[i][j] = interpolateCoverage(centerLon, centerLat)\n      }\n    }\n\n    // 그리드 스무딩 적용\n    const smoothedGrid = smoothGrid(coverageGrid, 2)\n\n    // 셀 생성 및 피처 추가\n    for (let i = 0; i < gridResolution; i++) {\n      for (let j = 0; j < gridResolution; j++) {\n        const lonMin = bounds.minLon + j * lonStep\n        const lonMax = bounds.minLon + (j + 1) * lonStep\n        const latMin = bounds.minLat + i * latStep\n        const latMax = bounds.minLat + (i + 1) * latStep\n\n        // 스무딩된 값 사용\n        const interpolatedCoverage = smoothedGrid[i][j]\n\n        // 너무 작은 커버리지는 제외\n        if (interpolatedCoverage < 0.01) continue\n\n        // 셀 좌표 계산 및 변환\n        const coordinates = [\n          [lonMin, latMin],\n          [lonMax, latMin],\n          [lonMax, latMax],\n          [lonMin, latMax],\n          [lonMin, latMin]\n        ].map(coord => fromLonLat(coord))\n\n        // 다각형 피처 생성\n        const feature = new Feature({\n          geometry: new Polygon([coordinates]),\n          coverage: interpolatedCoverage\n        })\n\n        source.addFeature(feature)\n      }\n    }\n\n    // 벡터 레이어 생성\n    return new VectorLayer({\n      source,\n      zIndex: 7,\n      className: 'cloud-layer',\n      opacity: 0.9,\n      style: feature => {\n        const coverage = feature.get('coverage') as number\n        return new Style({\n          fill: new Fill({\n            color: getColorFromCoverage(coverage)\n          }),\n          // 경계선 완전히 제거\n          stroke: undefined\n        })\n      }\n    })\n  }\n\n  /**\n   * 레이어에 날씨 데이터를 설정합니다.\n   */\n  setWeatherData(data: WeatherData[]) {\n    this.weatherData = data\n    this.updateLayer()\n  }\n}\n"]}

package/dist/src/layers/precipitation-layer.d.ts

@@ -0,0 +1,27 @@
+import { BaseWeatherLayer } from './base-weather-layer';
+import { WeatherData, WeatherLayerType } from '../types';
+import BaseLayer from 'ol/layer/Base';
+/**
+ * 강수량 레이어 구현
+ */
+export declare class PrecipitationLayer extends BaseWeatherLayer {
+    private animationFrameId?;
+    private animationTime;
+    getType(): WeatherLayerType;
+    /**
+     * 벡터 레이어를 생성하여 강수량을 표현합니다.
+     */
+    createLayer(): BaseLayer;
+    /**
+     * 애니메이션을 시작합니다.
+     */
+    startAnimation(): void;
+    /**
+     * 애니메이션을 중지합니다.
+     */
+    stopAnimation(): void;
+    /**
+     * 레이어에 날씨 데이터를 설정합니다.
+     */
+    setWeatherData(data: WeatherData[]): void;
+}

package/dist/src/layers/precipitation-layer.js

@@ -0,0 +1,344 @@
+import { BaseWeatherLayer } from './base-weather-layer';
+import VectorSource from 'ol/source/Vector';
+import VectorLayer from 'ol/layer/Vector';
+import Feature from 'ol/Feature';
+import { fromLonLat } from 'ol/proj';
+import { Style, Icon, Text, Fill, Stroke } from 'ol/style';
+import Polygon from 'ol/geom/Polygon';
+/**
+ * 강수량 레이어 구현
+ */
+export class PrecipitationLayer extends BaseWeatherLayer {
+    constructor() {
+        super(...arguments);
+        this.animationTime = 0;
+    }
+    getType() {
+        return 'precipitation';
+    }
+    /**
+     * 벡터 레이어를 생성하여 강수량을 표현합니다.
+     */
+    createLayer() {
+        const source = new VectorSource();
+        if (!this.weatherData || this.weatherData.length === 0) {
+            return new VectorLayer({
+                source,
+                zIndex: 12
+            });
+        }
+        // 강수량 데이터 추출 - 강수 확률이 일정 이상인 경우만 고려
+        const validData = this.weatherData.filter(data => data.precipitation.probability >= 20);
+        console.log('강수 데이터 포인트:', validData.length, '첫 번째 포인트:', validData.length > 0 ? validData[0] : 'none');
+        if (validData.length === 0) {
+            return new VectorLayer({
+                source,
+                zIndex: 12
+            });
+        }
+        // 각 데이터 포인트의 위치와 강수량 추출
+        const points = validData.map(data => ({
+            lon: data.location.longitude,
+            lat: data.location.latitude,
+            amount: data.precipitation.amount,
+            probability: data.precipitation.probability
+        }));
+        // 강수량 최대/최소값 계산
+        let minAmount = Infinity;
+        let maxAmount = -Infinity;
+        points.forEach(point => {
+            // 강수 확률을 가중치로 사용하여 실효 강수량 계산
+            const effectiveAmount = point.amount * (point.probability / 100);
+            minAmount = Math.min(minAmount, effectiveAmount);
+            maxAmount = Math.max(maxAmount, effectiveAmount);
+        });
+        console.log('강수량 최소/최대값:', minAmount, maxAmount);
+        // 강수량 정규화 함수 - 0~1 범위로 변환
+        const normalizeAmount = (amount) => {
+            if (maxAmount === minAmount)
+                return 0.5;
+            return (amount - minAmount) / (maxAmount - minAmount);
+        };
+        // 개선된 강수량 보간 함수 - IDW(Inverse Distance Weighting) 기반 보간법
+        const interpolateAmount = (lon, lat) => {
+            // 가장 가까운 이웃 개수 제한 - 모든 포인트 대신 가까운 포인트만 사용하여 국지적 패턴 유지
+            const MAX_NEIGHBORS = 5;
+            // 현재 위치에서 모든 포인트까지의 거리 계산
+            const distances = points.map(point => {
+                const dx = lon - point.lon;
+                const dy = lat - point.lat;
+                return {
+                    point,
+                    dist: Math.sqrt(dx * dx + dy * dy)
+                };
+            });
+            // 거리에 따라 정렬하고 가장 가까운 이웃만 선택
+            const nearestNeighbors = distances.sort((a, b) => a.dist - b.dist).slice(0, MAX_NEIGHBORS);
+            // 포인트가 정확히 일치하는 경우
+            if (nearestNeighbors.length > 0 && nearestNeighbors[0].dist < 0.0001) {
+                // 강수 확률을 가중치로 사용하여 실효 강수량 계산
+                return nearestNeighbors[0].point.amount * (nearestNeighbors[0].point.probability / 100);
+            }
+            // 역거리 가중치 보간법 적용 - 거리의 제곱에 반비례하는 가중치 사용
+            let totalWeight = 0;
+            let weightedAmount = 0;
+            // 가중치 지수 - 낮을수록 더 부드러운 보간, 높을수록 가까운 값에 더 큰 영향
+            const power = 2.0; // 강수는 지역적 특성이 강하므로 더 높은 지수 사용
+            nearestNeighbors.forEach(({ point, dist }) => {
+                // 작은 값으로 나누기 방지
+                const adjustedDist = Math.max(dist, 0.0001);
+                const weight = 1 / Math.pow(adjustedDist, power);
+                // 강수 확률을 가중치로 사용하여 실효 강수량 계산
+                const effectiveAmount = point.amount * (point.probability / 100);
+                totalWeight += weight;
+                weightedAmount += effectiveAmount * weight;
+            });
+            return weightedAmount / totalWeight;
+        };
+        // 강수량에 따른 색상 계산 함수
+        const getColorFromAmount = (amount, time = 0) => {
+            const normalized = normalizeAmount(amount);
+            if (normalized < 0.01)
+                return 'rgba(0,0,0,0)'; // 너무 적은 강수량은 투명하게
+            // 강수량에 따른 색상 설정 (파란색 계열)
+            const hue = 210 - normalized * 30; // 210~180 범위의 파란색
+            const saturation = 60 + normalized * 40; // 60~100% 채도
+            const lightness = 60 - normalized * 30; // 60~30% 밝기
+            // 강수량에 따라 투명도 조정
+            const alpha = 0.3 + normalized * 0.5;
+            // 애니메이션 효과 (시간에 따라 약간의 투명도 변화)
+            const animAlpha = alpha * (0.8 + Math.sin(time * 3) * 0.2);
+            return `hsla(${hue}, ${saturation}%, ${lightness}%, ${animAlpha})`;
+        };
+        // 그라데이션을 적용할 그리드 생성
+        const bounds = {
+            minLon: Infinity,
+            maxLon: -Infinity,
+            minLat: Infinity,
+            maxLat: -Infinity
+        };
+        // 데이터 포인트로부터 영역 경계 계산
+        points.forEach(point => {
+            bounds.minLon = Math.min(bounds.minLon, point.lon);
+            bounds.maxLon = Math.max(bounds.maxLon, point.lon);
+            bounds.minLat = Math.min(bounds.minLat, point.lat);
+            bounds.maxLat = Math.max(bounds.maxLat, point.lat);
+        });
+        // 경계에 마진 추가
+        const margin = 0.1;
+        bounds.minLon -= margin;
+        bounds.maxLon += margin;
+        bounds.minLat -= margin;
+        bounds.maxLat += margin;
+        // 고해상도 그리드 생성 (더 매끄러운 그라데이션을 위해)
+        const gridResolution = 80; // 적절한 해상도로 조정
+        const lonStep = (bounds.maxLon - bounds.minLon) / gridResolution;
+        const latStep = (bounds.maxLat - bounds.minLat) / gridResolution;
+        // 인접 셀 간의 값 차이 최소화를 위한 스무딩 함수
+        const smoothGrid = (grid, passes = 2) => {
+            const rows = grid.length;
+            if (rows === 0)
+                return grid;
+            const cols = grid[0].length;
+            const result = Array(rows)
+                .fill(0)
+                .map(() => Array(cols).fill(0));
+            // 여러 번 스무딩 패스 적용
+            for (let pass = 0; pass < passes; pass++) {
+                const currentGrid = pass === 0 ? grid : result;
+                for (let i = 0; i < rows; i++) {
+                    for (let j = 0; j < cols; j++) {
+                        // 현재 셀과 인접 셀의 평균 계산
+                        let sum = currentGrid[i][j];
+                        let count = 1;
+                        // 상하좌우 셀 확인
+                        const neighbors = [
+                            [i - 1, j],
+                            [i + 1, j],
+                            [i, j - 1],
+                            [i, j + 1]
+                        ];
+                        neighbors.forEach(([ni, nj]) => {
+                            if (ni >= 0 && ni < rows && nj >= 0 && nj < cols) {
+                                sum += currentGrid[ni][nj];
+                                count++;
+                            }
+                        });
+                        // 평균값으로 스무딩 (약간의 원본 가중치 부여)
+                        result[i][j] = currentGrid[i][j] * 0.7 + ((sum - currentGrid[i][j]) / (count - 1)) * 0.3;
+                    }
+                }
+            }
+            return result;
+        };
+        // 강수량 데이터 그리드 생성
+        const precipGrid = [];
+        for (let i = 0; i < gridResolution; i++) {
+            precipGrid[i] = [];
+            for (let j = 0; j < gridResolution; j++) {
+                const centerLon = bounds.minLon + (j + 0.5) * lonStep;
+                const centerLat = bounds.minLat + (i + 0.5) * latStep;
+                precipGrid[i][j] = interpolateAmount(centerLon, centerLat);
+            }
+        }
+        // 그리드 스무딩 적용 - 강수는 더 선명한 경계를 위해 약한 스무딩만 적용
+        const smoothedGrid = smoothGrid(precipGrid, 1);
+        // 셀 생성 및 피처 추가
+        for (let i = 0; i < gridResolution; i++) {
+            for (let j = 0; j < gridResolution; j++) {
+                const lonMin = bounds.minLon + j * lonStep;
+                const lonMax = bounds.minLon + (j + 1) * lonStep;
+                const latMin = bounds.minLat + i * latStep;
+                const latMax = bounds.minLat + (i + 1) * latStep;
+                // 스무딩된 값 사용
+                const interpolatedAmount = smoothedGrid[i][j];
+                // 너무 적은 강수량은 제외
+                if (interpolatedAmount < minAmount + (maxAmount - minAmount) * 0.05)
+                    continue;
+                // 셀 좌표 계산 및 변환
+                const coordinates = [
+                    [lonMin, latMin],
+                    [lonMax, latMin],
+                    [lonMax, latMax],
+                    [lonMin, latMax],
+                    [lonMin, latMin]
+                ].map(coord => fromLonLat(coord));
+                // 다각형 피처 생성
+                const feature = new Feature({
+                    geometry: new Polygon([coordinates]),
+                    amount: interpolatedAmount,
+                    // 애니메이션을 위한 랜덤 오프셋
+                    offset: Math.random()
+                });
+                source.addFeature(feature);
+            }
+        }
+        // CSS 블렌딩 모드 정의를 위한 클래스 이름 추가
+        const layerClass = 'precipitation-layer';
+        // 블렌딩 모드 스타일 추가
+        if (!document.getElementById('precipitation-layer-style')) {
+            const style = document.createElement('style');
+            style.id = 'precipitation-layer-style';
+            style.textContent = `
+        .${layerClass} canvas {
+          mix-blend-mode: multiply;
+        }
+      `;
+            document.head.appendChild(style);
+        }
+        // 벡터 레이어 생성
+        return new VectorLayer({
+            source,
+            zIndex: 12,
+            className: layerClass,
+            style: feature => {
+                const amount = feature.get('amount');
+                const offset = feature.get('offset');
+                // 애니메이션 시간 (오프셋을 통해 각 위치마다 다른 타이밍을 가짐)
+                const time = this.animationTime + offset * 5;
+                return new Style({
+                    fill: new Fill({
+                        color: getColorFromAmount(amount, time)
+                    }),
+                    // 경계선 완전히 제거
+                    stroke: undefined
+                });
+            }
+        });
+    }
+    /**
+     * 애니메이션을 시작합니다.
+     */
+    startAnimation() {
+        if (this.animationFrameId) {
+            this.stopAnimation();
+        }
+        this.animationTime = 0;
+        let lastFrameTime = 0;
+        const targetFPS = 30; // 초당 프레임 수 제한 (60fps → 30fps)
+        const frameInterval = 1000 / targetFPS;
+        const animate = (timestamp) => {
+            // 프레임 간 시간 제어
+            if (!lastFrameTime)
+                lastFrameTime = timestamp;
+            const deltaTime = timestamp - lastFrameTime;
+            // 목표 프레임 간격보다 적게 지났으면 다음 프레임으로 넘어감
+            if (deltaTime < frameInterval) {
+                this.animationFrameId = requestAnimationFrame(animate);
+                return;
+            }
+            // 지난 시간만큼 애니메이션 진행
+            const delta = Math.min(deltaTime / 1000, 0.1); // 최대 0.1초로 제한하여 큰 지연 방지
+            this.animationTime += delta * 0.5; // 속도 조절
+            lastFrameTime = timestamp;
+            // 맵 인스턴스 확인 (존재하지 않으면 애니메이션 종료)
+            if (!this.map) {
+                this.stopAnimation();
+                return;
+            }
+            // 지도가 현재 보이는지 확인 (화면 밖이면 렌더링 넘어감)
+            const mapElement = this.map.getTargetElement();
+            if (mapElement) {
+                const rect = mapElement.getBoundingClientRect();
+                // 화면에 완전히 보이지 않으면 렌더링 건너뛰기
+                const isVisible = rect.top < window.innerHeight && rect.bottom > 0 && rect.left < window.innerWidth && rect.right > 0;
+                // 화면에 보일 때만 렌더링
+                if (isVisible) {
+                    this.map.render();
+                }
+            }
+            // 다음 프레임 예약
+            this.animationFrameId = requestAnimationFrame(animate);
+        };
+        this.animationFrameId = requestAnimationFrame(animate);
+    }
+    /**
+     * 애니메이션을 중지합니다.
+     */
+    stopAnimation() {
+        if (this.animationFrameId) {
+            cancelAnimationFrame(this.animationFrameId);
+            this.animationFrameId = undefined;
+        }
+    }
+    /**
+     * 레이어에 날씨 데이터를 설정합니다.
+     */
+    setWeatherData(data) {
+        this.weatherData = data;
+        this.updateLayer();
+        // 데이터가 변경되면 애니메이션 재시작
+        this.startAnimation();
+    }
+}
+// 강수량 표시를 위한 스타일링
+const createPrecipitationFeatureStyle = (feature, resolution) => {
+    const properties = feature.getProperties();
+    const precipitation = properties.precipitation;
+    // 강수량이 없으면 빈 스타일 반환
+    if (!precipitation || precipitation === 0) {
+        return new Style({});
+    }
+    // 아이콘과 텍스트 스타일 생성
+    return new Style({
+        image: new Icon({
+            src: 'data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%230000ff" d="M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8s-8-3.59-8-8s3.59-8 8-8m0-2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 14l-4-4h8z"/></svg>',
+            scale: 0.8,
+            opacity: 0.8
+        }),
+        text: new Text({
+            text: `${precipitation} mm`,
+            font: 'bold 12px Arial',
+            fill: new Fill({
+                color: 'rgba(0, 0, 0, 0.9)'
+            }),
+            stroke: new Stroke({
+                color: 'rgba(255, 255, 255, 0.8)',
+                width: 3
+            }),
+            offsetY: -15
+        }),
+        zIndex: 12
+    });
+};
+//# sourceMappingURL=precipitation-layer.js.map