@mint-ui/map 1.1.3 → 1.2.0-test.2

package/dist/components/mint-map/core/advanced/woongCanvas/shared/types.d.ts

@@ -0,0 +1,121 @@
+import Konva from "konva";
+import { Position, Offset } from "../../../../types";
+/**
+ * 폴리곤 경로 정의
+ */
+export interface Paths {
+    type: string;
+    coordinates: number[][][][];
+}
+/**
+ * 캔버스 마커/폴리곤 기본 옵션
+ */
+/**
+ * 캔버스 마커/폴리곤의 기본 필수 속성
+ * (렌더링에 필요한 최소 정보)
+ */
+export interface CanvasMarkerOption {
+    id: string;
+    position: Position[];
+    boxWidth?: number;
+    boxHeight?: number;
+    paths?: Paths;
+    isDonutPolygon?: boolean;
+}
+/**
+ * 서버 데이터와 캔버스 옵션을 결합한 타입
+ * @template T 서버에서 받은 원본 데이터 타입 (예: Marker, Polygon)
+ * @example
+ * // API에서 받은 Marker 타입을 그대로 유지하면서 캔버스 렌더링 정보 추가
+ * type MarkerWithCanvas = CanvasMarkerData<Marker>
+ * // { raId, lat, lng, buildingName, totalArea } + { id, position, boxWidth, ... }
+ */
+export declare type CanvasMarkerData<T = {}> = T & CanvasMarkerOption;
+/**
+ * 렌더링 유틸리티 함수들
+ */
+export interface RenderUtils<T> {
+    getOrComputePolygonOffsets: (polygonData: CanvasMarkerData<T>) => number[][][][] | null;
+    getOrComputeMarkerOffset: (markerData: CanvasMarkerData<T>) => Offset | null;
+}
+/**
+ * 커스텀 렌더링 함수 파라미터 - Base Layer
+ */
+export interface RenderBaseParams<T> {
+    /** Canvas 2D 렌더링 컨텍스트 (순수 Canvas API) */
+    ctx: CanvasRenderingContext2D;
+    /** 렌더링할 마커 데이터 배열 */
+    items: CanvasMarkerData<T>[];
+    /** 현재 선택된 마커 ID Set */
+    selectedIds: Set<string>;
+    /** 렌더링 유틸리티 함수들 */
+    utils: RenderUtils<T>;
+}
+/**
+ * 커스텀 렌더링 함수 타입 - Base Layer
+ *
+ * 🔥 순수 Canvas API 사용 (Konva 지식 불필요!)
+ *
+ * @example
+ * const renderBase = ({ ctx, items, selectedIds, utils }) => {
+ *   for (const item of items) {
+ *     if (selectedIds.has(item.id)) continue;
+ *     const pos = utils.getOrComputeMarkerOffset(item);
+ *     ctx.fillRect(pos.x, pos.y, 50, 50); // 순수 Canvas API!
+ *   }
+ * };
+ */
+export declare type CustomRenderBase<T> = (params: RenderBaseParams<T>) => void;
+/**
+ * 커스텀 렌더링 함수 파라미터 - Animation Layer
+ */
+export interface RenderAnimationParams<T> {
+    /** Konva Layer 인스턴스 */
+    layer: Konva.Layer;
+    /** 현재 선택된 마커 ID Set */
+    selectedIds: Set<string>;
+    /** 전체 마커 데이터 배열 */
+    items: CanvasMarkerData<T>[];
+    /** 렌더링 유틸리티 함수들 */
+    utils: RenderUtils<T>;
+}
+/**
+ * 커스텀 렌더링 함수 타입 - Animation Layer (선택)
+ *
+ * @example
+ * const renderAnimation = ({ layer, selectedIds, items, utils }) => {
+ *   for (const id of selectedIds) {
+ *     const item = items.find(i => i.id === id);
+ *     // Konva 애니메이션 구현
+ *   }
+ * };
+ */
+export declare type CustomRenderAnimation<T> = (params: RenderAnimationParams<T>) => void;
+/**
+ * 커스텀 렌더링 함수 파라미터 - Event Layer
+ */
+export interface RenderEventParams<T> {
+    /** Canvas 2D 렌더링 컨텍스트 (순수 Canvas API) */
+    ctx: CanvasRenderingContext2D;
+    /** 현재 hover된 마커 데이터 */
+    hoveredItem: CanvasMarkerData<T> | null;
+    /** 렌더링 유틸리티 함수들 */
+    utils: RenderUtils<T>;
+    /** 현재 선택된 마커 데이터 배열 (선택 강조용) */
+    selectedItems?: CanvasMarkerData<T>[];
+}
+/**
+ * 커스텀 렌더링 함수 타입 - Event Layer
+ *
+ * 🔥 순수 Canvas API 사용 (Konva 지식 불필요!)
+ *
+ * @example
+ * const renderEvent = ({ ctx, hoveredItem, utils, selectedItems }) => {
+ *   if (hoveredItem) {
+ *     const pos = utils.getOrComputeMarkerOffset(hoveredItem);
+ *     ctx.fillStyle = 'red';
+ *     ctx.fillRect(pos.x, pos.y, 50, 50); // 순수 Canvas API!
+ *   }
+ * };
+ */
+export declare type CustomRenderEvent<T> = (params: RenderEventParams<T>) => void;

package/dist/components/mint-map/core/advanced/woongCanvas/shared/utils.d.ts

@@ -0,0 +1,23 @@
+import { Offset } from "../../../../types";
+import { MintMapController } from "../../../MintMapController";
+import { CanvasMarkerData } from "./types";
+/**
+ * 폴리곤 offset 계산
+ */
+export declare const computePolygonOffsets: (polygonData: CanvasMarkerData<any>, controller: MintMapController) => number[][][][] | null;
+/**
+ * 마커 offset 계산
+ */
+export declare const computeMarkerOffset: (markerData: CanvasMarkerData<any>, controller: MintMapController) => Offset | null;
+/**
+ * Point-in-Polygon 알고리즘
+ */
+export declare const isPointInPolygon: (point: Offset, polygon: number[][]) => boolean;
+/**
+ * 폴리곤 히트 테스트
+ */
+export declare const isPointInPolygonData: (clickedOffset: Offset, polygonData: CanvasMarkerData<any>, getPolygonOffsets: (data: CanvasMarkerData<any>) => number[][][][] | null) => boolean;
+/**
+ * 마커 히트 테스트
+ */
+export declare const isPointInMarkerData: (clickedOffset: Offset, markerData: CanvasMarkerData<any>, getMarkerOffset: (data: CanvasMarkerData<any>) => Offset | null) => boolean;

package/dist/components/mint-map/core/advanced/woongCanvas/shared/utils.js

@@ -0,0 +1,115 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../../../types/MapDrawables.js');
+var MapTypes = require('../../../../types/MapTypes.js');
+require('../../../../types/MapEventTypes.js');
+
+/**
+ * 폴리곤 offset 계산
+ */
+
+var computePolygonOffsets = function (polygonData, controller) {
+  var paths = polygonData.paths;
+
+  if (!paths || paths.type !== 'MultiPolygon' || !paths.coordinates) {
+    return null;
+  }
+
+  var result = [];
+
+  for (var _i = 0, _a = paths.coordinates; _i < _a.length; _i++) {
+    var multiPolygon = _a[_i];
+    var multiPolygonOffsets = [];
+
+    for (var _b = 0, multiPolygon_1 = multiPolygon; _b < multiPolygon_1.length; _b++) {
+      var polygonGroup = multiPolygon_1[_b];
+      var polygonOffsets = [];
+
+      for (var _c = 0, polygonGroup_1 = polygonGroup; _c < polygonGroup_1.length; _c++) {
+        var coord = polygonGroup_1[_c];
+        var pos = new MapTypes.Position(coord[1], coord[0]);
+        var offset = controller.positionToOffset(pos);
+        polygonOffsets.push([offset.x, offset.y]);
+      }
+
+      multiPolygonOffsets.push(polygonOffsets);
+    }
+
+    result.push(multiPolygonOffsets);
+  }
+
+  return result;
+};
+/**
+ * 마커 offset 계산
+ */
+
+var computeMarkerOffset = function (markerData, controller) {
+  if (!markerData.position || markerData.position.length === 0) {
+    return null;
+  }
+
+  return controller.positionToOffset(markerData.position[0]);
+};
+/**
+ * Point-in-Polygon 알고리즘
+ */
+
+var isPointInPolygon = function (point, polygon) {
+  var inside = false;
+
+  for (var i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
+    var xi = polygon[i][0],
+        yi = polygon[i][1];
+    var xj = polygon[j][0],
+        yj = polygon[j][1];
+    var intersect = yi > point.y !== yj > point.y && point.x < (xj - xi) * (point.y - yi) / (yj - yi) + xi;
+    if (intersect) inside = !inside;
+  }
+
+  return inside;
+};
+/**
+ * 폴리곤 히트 테스트
+ */
+
+var isPointInPolygonData = function (clickedOffset, polygonData, getPolygonOffsets) {
+  var polygonOffsets = getPolygonOffsets(polygonData);
+  if (!polygonOffsets) return false;
+
+  for (var _i = 0, polygonOffsets_1 = polygonOffsets; _i < polygonOffsets_1.length; _i++) {
+    var multiPolygon = polygonOffsets_1[_i];
+
+    for (var _a = 0, multiPolygon_2 = multiPolygon; _a < multiPolygon_2.length; _a++) {
+      var polygonGroup = multiPolygon_2[_a];
+
+      if (isPointInPolygon(clickedOffset, polygonGroup)) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+};
+/**
+ * 마커 히트 테스트
+ */
+
+var isPointInMarkerData = function (clickedOffset, markerData, getMarkerOffset) {
+  var markerOffset = getMarkerOffset(markerData);
+  if (!markerOffset) return false;
+  var boxWidth = markerData.boxWidth || 50;
+  var boxHeight = markerData.boxHeight || 28;
+  var tailHeight = 6;
+  var x = markerOffset.x - boxWidth / 2;
+  var y = markerOffset.y - boxHeight - tailHeight;
+  return clickedOffset.x >= x && clickedOffset.x <= x + boxWidth && clickedOffset.y >= y && clickedOffset.y <= y + boxHeight;
+};
+
+exports.computeMarkerOffset = computeMarkerOffset;
+exports.computePolygonOffsets = computePolygonOffsets;
+exports.isPointInMarkerData = isPointInMarkerData;
+exports.isPointInPolygon = isPointInPolygon;
+exports.isPointInPolygonData = isPointInPolygonData;

package/dist/components/mint-map/core/util/geohash.d.ts

@@ -0,0 +1,2 @@
+export declare function geohashEncode(lat: number, lon: number, precision?: number): string;
+export declare function geohashNeighbors(hash: string): string[];

package/dist/components/mint-map/core/util/geohash.js

@@ -0,0 +1,125 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+// Lightweight Geohash encoder and neighbor utilities
+var BASE32 = '0123456789bcdefghjkmnpqrstuvwxyz';
+var NEIGHBORS = {
+  n: {
+    even: {
+      border: 'prxz',
+      neighbor: 'bc01fg45238967deuvhjyznpkmstqrwx'
+    },
+    odd: {
+      border: 'bcfguvyz',
+      neighbor: 'p0r21436x8zb9dcf5h7kjnmqesgutwvy'
+    }
+  },
+  s: {
+    even: {
+      border: '028b',
+      neighbor: '238967debc01fg45kmstqrwxuvhjyznp'
+    },
+    odd: {
+      border: '0145hjnp',
+      neighbor: '14365h7k9dcfesgujnmqp0r2twvyx8zb'
+    }
+  },
+  e: {
+    even: {
+      border: 'bcfguvyz',
+      neighbor: '14365h7k9dcfesgujnmqp0r2twvyx8zb'
+    },
+    odd: {
+      border: 'prxz',
+      neighbor: 'bc01fg45238967deuvhjyznpkmstqrwx'
+    }
+  },
+  w: {
+    even: {
+      border: '0145hjnp',
+      neighbor: '238967debc01fg45kmstqrwxuvhjyznp'
+    },
+    odd: {
+      border: '028b',
+      neighbor: 'p0r21436x8zb9dcf5h7kjnmqesgutwvy'
+    }
+  }
+};
+function geohashEncode(lat, lon, precision) {
+  if (precision === void 0) {
+    precision = 6;
+  }
+
+  var idx = 0;
+  var bit = 0;
+  var evenBit = true;
+  var geohash = '';
+  var latMin = -90,
+      latMax = 90;
+  var lonMin = -180,
+      lonMax = 180;
+
+  while (geohash.length < precision) {
+    if (evenBit) {
+      var lonMid = (lonMin + lonMax) / 2;
+
+      if (lon >= lonMid) {
+        idx = idx * 2 + 1;
+        lonMin = lonMid;
+      } else {
+        idx = idx * 2;
+        lonMax = lonMid;
+      }
+    } else {
+      var latMid = (latMin + latMax) / 2;
+
+      if (lat >= latMid) {
+        idx = idx * 2 + 1;
+        latMin = latMid;
+      } else {
+        idx = idx * 2;
+        latMax = latMid;
+      }
+    }
+
+    evenBit = !evenBit;
+
+    if (++bit == 5) {
+      geohash += BASE32.charAt(idx);
+      bit = 0;
+      idx = 0;
+    }
+  }
+
+  return geohash;
+}
+
+function adjacent(hash, dir) {
+  var lastChr = hash[hash.length - 1];
+  var type = hash.length % 2 ? 'odd' : 'even'; // @ts-ignore
+
+  var border = NEIGHBORS[dir][type].border; // @ts-ignore
+
+  var neighbor = NEIGHBORS[dir][type].neighbor;
+  var base = hash.substring(0, hash.length - 1);
+
+  if (border.indexOf(lastChr) !== -1) {
+    base = adjacent(base, dir);
+  }
+
+  var pos = neighbor.indexOf(lastChr);
+  var nextChr = BASE32.charAt(pos);
+  return base + nextChr;
+}
+
+function geohashNeighbors(hash) {
+  var n = adjacent(hash, 'n');
+  var s = adjacent(hash, 's');
+  var e = adjacent(hash, 'e');
+  var w = adjacent(hash, 'w');
+  return [hash, n, s, e, w, adjacent(n, 'e'), adjacent(n, 'w'), adjacent(s, 'e'), adjacent(s, 'w')];
+}
+
+exports.geohashEncode = geohashEncode;
+exports.geohashNeighbors = geohashNeighbors;

package/dist/components/mint-map/core/wrapper/MapMarkerWrapper.js

@@ -172,7 +172,7 @@ function MapMarkerWrapper(_a) {
   var onMouseOverHandler = function (e) {
     var _a;
 
-    var marker = markerRef.current;
+    var marker = markerRef.current; //console.log('onMouseOverHandler', marker);
 
     if (marker) {
       var mouseOverHandler = (_a = options === null || options === void 0 ? void 0 : options.event) === null || _a === void 0 ? void 0 : _a.get('mouseover');
@@ -185,25 +185,6 @@ function MapMarkerWrapper(_a) {
 
       next && topOnHover && controller.markerToTheTop(marker);
     }
-  }; // 20251014 | 장한별 | mouseleave 이벤트 추가, 마우스가 마커 위에서 떠날 때 원래 zindex 를 복구하기 위함
-
-
-  var onMouseLeaveHandler = function (e) {
-    var _a;
-
-    var marker = markerRef.current;
-
-    if (marker) {
-      var mouseOutHandler = (_a = options === null || options === void 0 ? void 0 : options.event) === null || _a === void 0 ? void 0 : _a.get('mouseout');
-      var next = true;
-
-      if (mouseOutHandler) {
-        var hasNext = mouseOutHandler(e);
-        hasNext !== undefined && (next = hasNext);
-      }
-
-      next && topOnHover && controller.restoreMarkerZIndex(marker);
-    }
   }; //create object
 
 
@@ -221,12 +202,10 @@ function MapMarkerWrapper(_a) {
     }); //드래그 여부 초기화를 먼저 수행하기 위해 capture : true 처리
 
     divElement.addEventListener('mouseover', onMouseOverHandler);
-    divElement.addEventListener('mouseleave', onMouseLeaveHandler);
     return function () {
       divElement.removeEventListener('click', onClickHandler);
       divElement.removeEventListener('mousedown', onMousedownHandler);
       divElement.removeEventListener('mouseover', onMouseOverHandler);
-      divElement.removeEventListener('mouseleave', onMouseLeaveHandler);
 
       if (markerRef.current) {
         controller.clearDrawable(markerRef.current);

package/dist/components/mint-map/google/GoogleMintMapController.d.ts

@@ -28,7 +28,6 @@ export declare class GoogleMintMapController extends MintMapController {
     private getMaxZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
-    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/google/GoogleMintMapController.js

@@ -18,7 +18,11 @@ require('../core/util/animation.js');
 require('../core/util/geo.js');
 var polygon = require('../core/util/polygon.js');
 require('../naver/NaverMintMapController.js');
+require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
+require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('../core/advanced/woongCanvas/shared/context.js');
+require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
 
 var GoogleMintMapController =
@@ -335,10 +339,6 @@ function (_super) {
     }
   };
 
-  GoogleMintMapController.prototype.restoreMarkerZIndex = function (marker) {// Google Maps에서는 restoreMarkerZIndex 기능을 지원하지 않습니다.
-    // 이 기능은 Naver Maps에서만 사용 가능합니다.
-  };
-
   GoogleMintMapController.prototype.clearDrawable = function (drawable) {
     if (drawable && drawable.native) {
       if (drawable.native instanceof google.maps.Marker || drawable.native instanceof google.maps.Polygon || drawable.native instanceof google.maps.Polyline) {

package/dist/components/mint-map/kakao/KakaoMintMapController.d.ts

@@ -31,7 +31,6 @@ export declare class KakaoMintMapController extends MintMapController {
     private getMaxZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
-    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/kakao/KakaoMintMapController.js

@@ -19,7 +19,11 @@ require('../core/util/animation.js');
 require('../core/util/geo.js');
 var polygon = require('../core/util/polygon.js');
 require('../naver/NaverMintMapController.js');
+require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
+require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('../core/advanced/woongCanvas/shared/context.js');
+require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
 
 var KakaoMintMapController =
@@ -343,10 +347,6 @@ function (_super) {
     }
   };
 
-  KakaoMintMapController.prototype.restoreMarkerZIndex = function (marker) {// Kakao Maps에서는 restoreMarkerZIndex 기능을 지원하지 않습니다.
-    // 이 기능은 Naver Maps에서만 사용 가능합니다.
-  };
-
   KakaoMintMapController.prototype.clearDrawable = function (drawable) {
     var _this = this;
 

package/dist/components/mint-map/naver/NaverMintMapController.d.ts

@@ -27,12 +27,9 @@ export declare class NaverMintMapController extends MintMapController {
     createMarker(marker: Marker): void;
     updateMarker(marker: Marker, options: MarkerOptions): void;
     private markerMaxZIndex;
-    private markerOriginalZIndex;
     private getMaxZIndex;
-    private getCurrentZIndex;
     setMarkerZIndex(marker: Marker, zIndex: number): void;
     markerToTheTop(marker: Marker): void;
-    restoreMarkerZIndex(marker: Marker): void;
     clearDrawable(drawable: Drawable): boolean;
     private dragged;
     isMapDragged(): boolean;

package/dist/components/mint-map/naver/NaverMintMapController.js

@@ -18,7 +18,11 @@ require('react-dom');
 require('../core/util/animation.js');
 require('../core/util/geo.js');
 var polygon = require('../core/util/polygon.js');
+require('../core/advanced/canvas/CanvasMarkerClaude.js');
 require('../core/advanced/MapLoadingComponents.js');
+require('../core/advanced/woongCanvas/WoongKonvaMarker.js');
+require('../core/advanced/woongCanvas/shared/context.js');
+require('../core/advanced/woongCanvas/shared/performance.js');
 require('../core/wrapper/MapControlWrapper.js');
 
 var NaverMintMapController =
@@ -335,49 +339,20 @@ function (_super) {
     }
   };
 
-  NaverMintMapController.prototype.getCurrentZIndex = function (marker) {
-    if (this.map && marker.element && marker.element instanceof HTMLElement) {
-      var parent_1 = marker.element.parentElement;
-
-      if (parent_1 && parent_1.style.zIndex) {
-        var zIndex = Number(parent_1.style.zIndex);
-        return isNaN(zIndex) ? undefined : zIndex;
-      }
-    }
-
-    return undefined;
-  };
-
   NaverMintMapController.prototype.setMarkerZIndex = function (marker, zIndex) {
     if (this.map && marker.element && marker.element instanceof HTMLElement) {
-      var parent_2 = marker.element.parentElement;
+      var parent_1 = marker.element.parentElement;
 
-      if (parent_2) {
-        parent_2.style.zIndex = String(zIndex);
+      if (parent_1) {
+        parent_1.style.zIndex = String(zIndex);
       }
     }
   };
 
   NaverMintMapController.prototype.markerToTheTop = function (marker) {
-    var currentZIndex = this.getCurrentZIndex(marker); // undefined면 null로 저장 (원래 zIndex가 없었음을 표시)
-
-    this.markerOriginalZIndex = currentZIndex !== undefined ? currentZIndex : null;
     this.setMarkerZIndex(marker, this.getMaxZIndex(1));
   };
 
-  NaverMintMapController.prototype.restoreMarkerZIndex = function (marker) {
-    if (this.markerOriginalZIndex !== undefined) {
-      if (this.markerOriginalZIndex === null) {
-        // 원래 zIndex가 없었으면 제거 (또는 초기값 0으로)
-        this.setMarkerZIndex(marker, 0);
-      } else {
-        this.setMarkerZIndex(marker, this.markerOriginalZIndex);
-      }
-
-      this.markerOriginalZIndex = undefined;
-    }
-  };
-
   NaverMintMapController.prototype.clearDrawable = function (drawable) {
     var _a;