@mint-ui/map 0.5.12-beta → 0.6.1-beta

package/dist/index.umd.js

@@ -477,23 +477,23 @@
     return PolygonCalculator;
   }();
 
-  /**
-   * 좌표값
-   * @description 위도/경도, DOM 상의 X/Y 좌표
+  /**
+   * 좌표값
+   * @description 위도/경도, DOM 상의 X/Y 좌표
    */
 
   var Position =
   /** @class */
   function () {
     function Position(lat, lng) {
-      /**
-       * 위도
-       * @description 위도(latitude)
+      /**
+       * 위도
+       * @description 위도(latitude)
        */
       this.lat = 0;
-      /**
-       * 경도
-       * @description 경도(longitude)
+      /**
+       * 경도
+       * @description 경도(longitude)
        */
 
       this.lng = 0;
@@ -601,15 +601,15 @@
 
     return Bounds;
   }();
-  /**
-   * DOM 상에서의 좌표를 표현 (픽셀을 나타내는 숫자)
+  /**
+   * DOM 상에서의 좌표를 표현 (픽셀을 나타내는 숫자)
    */
 
   var Offset =
   /** @class */
   function () {
-    /**
-     * DOM 상에서의 좌표를 표현 (픽셀을 나타내는 숫자)
+    /**
+     * DOM 상에서의 좌표를 표현 (픽셀을 나타내는 숫자)
      */
     function Offset(x, y) {
       this.x = x;
@@ -1140,12 +1140,12 @@
     MintMapController.prototype.getRandomFunctionName = function (prefix) {
       return "".concat(prefix, "_").concat(uuid.v4().replace(/-/g, '_'));
     };
-    /**
-     * URL 빌더 메서드
-     *
-     * @param {string} baseUrl: 기본 URL
-     * @param {{ [ key: string ]: string | string[] }} param: 파라미터 JSON
-     * @returns {string} URL
+    /**
+     * URL 빌더 메서드
+     *
+     * @param {string} baseUrl: 기본 URL
+     * @param {{ [ key: string ]: string | string[] }} param: 파라미터 JSON
+     * @returns {string} URL
      */
 
 
@@ -1153,14 +1153,14 @@
       var params = Object.entries(param).map(function (_a) {
         var key = _a[0],
             value = _a[1];
-        var temp = encodeURIComponent(Array.isArray(value) ? value.join(',') : value);
+        var temp = Array.isArray(value) ? value.join(',') : value;
         return "".concat(key, "=").concat(temp);
       }).join('&');
       return "".concat(baseUrl, "?").concat(params);
     };
-    /**
-     * 쓰로틀링 처리
-     * @returns
+    /**
+     * 쓰로틀링 처리
+     * @returns
      */
 
 
@@ -1461,6 +1461,8 @@
     tslib.__extends(NaverMintMapController, _super);
 
     function NaverMintMapController(props) {
+      var _a;
+
       var _this = _super.call(this, props) || this;
 
       _this.type = 'naver';
@@ -1474,7 +1476,12 @@
       _this.polygonEvents = ['mouseover', 'mouseout'];
       _this.markerEvents = ['click', 'mouseover', 'mouseout'];
       _this.dragged = false;
-      _this.eventMap = new Map(); //contextmenu 는 지원하지 않지만 호환성을 위해 rightclick 으로 대체
+      _this.eventMap = new Map(); //scriptModules 병합
+
+      if (props.scriptModules) {
+        (_a = _this.scriptModules).push.apply(_a, props.scriptModules);
+      } //contextmenu 는 지원하지 않지만 호환성을 위해 rightclick 으로 대체
+
 
       _this.mapUIEvent.CONTEXTMENU = 'rightclick';
       Object.freeze(_this.mapEvent);
@@ -1695,11 +1702,11 @@
         var map = marker.native.getMap();
 
         if (map) {
-          /** 중요!!!!
-           * naver 마커의 setOption(MarkerOptions) 은 내부적으로 setMap 을 무조건 강제 처리한다!!!
-           * setMap 을 처리하면 맵의 이벤트리스너 등등이 모두 초기화 되고 다시 맵을 add 하면서 마커관련된 모든 초기화가 다시 일어난다.
-           * (심지어 map 이 기존과 같은 객체인데도 초기화 처리함)
-           * 그래서 민트맵에서는 update 를 지원하는 항목별로 명시적으로 각각 처리한다.
+          /** 중요!!!!
+           * naver 마커의 setOption(MarkerOptions) 은 내부적으로 setMap 을 무조건 강제 처리한다!!!
+           * setMap 을 처리하면 맵의 이벤트리스너 등등이 모두 초기화 되고 다시 맵을 add 하면서 마커관련된 모든 초기화가 다시 일어난다.
+           * (심지어 map 이 기존과 같은 객체인데도 초기화 처리함)
+           * 그래서 민트맵에서는 update 를 지원하는 항목별로 명시적으로 각각 처리한다.
           */
           //Position
           if (options.position && options.position instanceof Position) {
@@ -2185,6 +2192,8 @@
     tslib.__extends(GoogleMintMapController, _super);
 
     function GoogleMintMapController(props) {
+      var _a;
+
       var _this = _super.call(this, props) || this;
 
       _this.type = 'google';
@@ -2211,9 +2220,14 @@
 
       };
 
-      _this.eventMap = new Map(); //google 은 zoomstart 가 없으므로 zoom_changed 로 대체 (하지만 zooming 되는 내내 여러번 호출됨)
+      _this.eventMap = new Map(); //scriptModules 병합
+
+      if (props.scriptModules) {
+        (_a = _this.scriptModules).push.apply(_a, props.scriptModules);
+      } //google 은 zoomstart 가 없으므로 zoom_changed 로 대체 (하지만 zooming 되는 내내 여러번 호출됨)
       //나중에 naver 와 마찬가지로 zoomstart 1번 zoom_changed 1번 호출되도록 바꾸는것 고려중
 
+
       _this.mapEvent.ZOOMSTART = 'zoom_changed';
       Object.freeze(_this.mapEvent);
       Object.freeze(_this.mapUIEvent);
@@ -2869,6 +2883,8 @@
     tslib.__extends(KakaoMintMapController, _super);
 
     function KakaoMintMapController(props) {
+      var _a;
+
       var _this = _super.call(this, props) || this;
 
       _this.type = 'kakao';
@@ -2882,7 +2898,12 @@
       _this.polygonEvents = ['mouseover', 'mouseout'];
       _this.markerEvents = ['click', 'mouseover', 'mouseout'];
       _this.dragged = false;
-      _this.eventMap = new Map(); //kakao only 이벤트이름 재정의 zoom_start
+      _this.eventMap = new Map(); //scriptModules 병합
+
+      if (props.scriptModules) {
+        (_a = _this.scriptModules).push.apply(_a, props.scriptModules);
+      } //kakao only 이벤트이름 재정의 zoom_start
+
 
       _this.mapEvent.ZOOMSTART = 'zoom_start'; //contextmenu 는 지원하지 않지만 호환성을 위해 rightclick 으로 대체
 
@@ -3403,13 +3424,13 @@
     };
 
     KakaoMintMapController.prototype.getSafeZoomValue = function (value) {
-      /**
-       * 카카오는 구글/네이버와 다르게 줌레벨이 작아질수록 확대된다 (가장 확대된 것이 0)
-       * - 가장 확대된 값 : 1
-       * - 가장 축소된 값 : 14
-       *
-       * 그래서 세계지도가 없는 카카오는 동일한 사정인 네이버와 매핑하기로 한다.
-       * 문제는 둘 간의 줌 레벨별 축척이 일치하지 않는다. 그래서 가장 유사한 레벨 끼리 매핑이 필요하다
+      /**
+       * 카카오는 구글/네이버와 다르게 줌레벨이 작아질수록 확대된다 (가장 확대된 것이 0)
+       * - 가장 확대된 값 : 1
+       * - 가장 축소된 값 : 14
+       *
+       * 그래서 세계지도가 없는 카카오는 동일한 사정인 네이버와 매핑하기로 한다.
+       * 문제는 둘 간의 줌 레벨별 축척이 일치하지 않는다. 그래서 가장 유사한 레벨 끼리 매핑이 필요하다
       */
       var mapValue = this.getBaseToMapZoom(value);
 
@@ -3594,12 +3615,12 @@
     lat: 37.5036845,
     lng: 127.0448698
   };
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MintMapProps} MintMapProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MintMapProps} MintMapProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MintMap(_a) {
@@ -3761,8 +3782,8 @@
   /** @class */
   function (_super) {
     tslib.__extends(Marker, _super);
-    /**
-     * 지도에 표시할 마커정보
+    /**
+     * 지도에 표시할 마커정보
      */
 
 
@@ -3780,8 +3801,8 @@
   /** @class */
   function (_super) {
     tslib.__extends(Polyline, _super);
-    /**
-     * 지도에 표시할 폴리곤정보
+    /**
+     * 지도에 표시할 폴리곤정보
      */
 
 
@@ -3799,8 +3820,8 @@
   /** @class */
   function (_super) {
     tslib.__extends(Polygon, _super);
-    /**
-     * 지도에 표시할 폴리곤정보
+    /**
+     * 지도에 표시할 폴리곤정보
      */
 
 
@@ -3810,8 +3831,8 @@
       _this.options = options;
       return _this;
     }
-    /**
-     * 폴리곤의 중점을 구한다.
+    /**
+     * 폴리곤의 중점을 구한다.
      */
 
 
@@ -4157,17 +4178,17 @@
   var offsetCalibration = function (mapType, divElement, options) {
     //google 맵의 anchor 보정 (네이버와 같이 왼쪽/위 기준으로 처리)
     if (mapType === 'google') {
-      divElement.style.transform = "translate(50%, 100%) translate(-".concat(options.anchor ? options.anchor.x : '0', "px, -").concat(options.anchor ? options.anchor.y : '0', "px)");
+      divElement.style.transform = "translate(50%, 100%) translate(".concat(options.anchor ? options.anchor.x * -1 : '0', "px, ").concat(options.anchor ? options.anchor.y * -1 : '0', "px)");
     } else if (mapType === 'kakao') {
-      divElement.style.transform = "translate(-".concat(options.anchor ? options.anchor.x : '0', "px, -").concat(options.anchor ? options.anchor.y : '0', "px)");
+      divElement.style.transform = "translate(".concat(options.anchor ? options.anchor.x * -1 : '0', "px, ").concat(options.anchor ? options.anchor.y * -1 : '0', "px)");
     }
   };
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
 
@@ -4330,12 +4351,12 @@
     return reactDom.createPortal(children, divElement);
   }
 
-  /**
-   * CircleMarker
-   *
-   * @param {CircleMarkerProps} CircleMarkerProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * CircleMarker
+   *
+   * @param {CircleMarkerProps} CircleMarkerProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function CircleMarker(_a) {
@@ -4451,12 +4472,12 @@
     }, children)));
   }
 
-  /**
-   *PolygonMarker
-   *
-   * @param {PolygonMarkerProps} PolygonMarkerProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   *PolygonMarker
+   *
+   * @param {PolygonMarkerProps} PolygonMarkerProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function PolygonMarker(_a) {
@@ -4627,12 +4648,12 @@
     }, children)));
   }
 
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MapPolygonWrapper(_a) {
@@ -5078,12 +5099,12 @@
   styleInject__default["default"](css_248z);
 
   var cn = classNames__default["default"].bind(styles);
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MapControlWrapper(_a) {
@@ -5111,12 +5132,12 @@
     }, children));
   }
 
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MapPolylineWrapper(_a) {
@@ -5157,12 +5178,12 @@
     log: function () {
     }
   };
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MapCanvasWrapper(_a) {
@@ -5481,12 +5502,12 @@
     }), renderFlag && React__default["default"].createElement(React__default["default"].Fragment, null));
   }
 
-  /**
-   * Mint Map 컴포넌트
-   *
-   * @param {MapControlWrapperProps} MapControlWrapperProps
-   *
-   * @returns {JSX.Element} JSX
+  /**
+   * Mint Map 컴포넌트
+   *
+   * @param {MapControlWrapperProps} MapControlWrapperProps
+   *
+   * @returns {JSX.Element} JSX
    */
 
   function MapCanvasMarkerWrapper(_props) {

package/package.json

@@ -1,77 +1,77 @@
-{
-  "name": "@mint-ui/map",
-  "version": "0.5.12-beta",
-  "main": "./dist/index.js",
-  "module": "./dist/index.es.js",
-  "browser": "./dist/index.umd.js",
-  "types": "./dist/index.d.ts",
-  "repository": "https://github.com/dev-rsquare/mint-ui-map",
-  "author": "RSQUARE",
-  "keywords": ["react", "react map", "map", "google", "naver", "kakao", "library", "typescript", "canvas", "marker"],
-  "license": "MIT",
-  "private": false,
-  "devDependencies": {
-    "@babel/core": "^7.18.2",
-    "@rollup/plugin-babel": "^5.3.1",
-    "@rollup/plugin-commonjs": "^22.0.0",
-    "@rollup/plugin-node-resolve": "^13.3.0",
-    "@rollup/plugin-typescript": "^8.3.2",
-    "@storybook/addon-actions": "^6.5.7",
-    "@storybook/addon-essentials": "^6.5.7",
-    "@storybook/addon-interactions": "^6.5.7",
-    "@storybook/addon-links": "^6.5.7",
-    "@storybook/builder-webpack5": "^6.5.7",
-    "@storybook/manager-webpack5": "^6.5.7",
-    "@storybook/preset-scss": "^1.0.3",
-    "@storybook/react": "^6.5.7",
-    "@storybook/testing-library": "^0.0.11",
-    "@types/classnames": "^2.3.1",
-    "@types/react": "^18.0.12",
-    "@types/react-dom": "^18.0.9",
-    "@types/uuid": "^9.0.0",
-    "@typescript-eslint/eslint-plugin": "^5.27.0",
-    "@typescript-eslint/parser": "^5.27.0",
-    "babel-loader": "^8.2.5",
-    "babel-plugin-react-icons": "^0.1.1",
-    "css-loader": "^6.7.1",
-    "eslint": "^8.17.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-react": "^7.30.0",
-    "eslint-plugin-react-hooks": "^4.5.0",
-    "eslint-plugin-sort-keys-fix": "^1.1.2",
-    "eslint-plugin-storybook": "^0.5.12",
-    "postcss": "^8.4.14",
-    "react": "^18.1.0",
-    "react-dom": "^18.1.0",
-    "rollup": "^2.75.5",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-postcss": "^4.0.2",
-    "sass": "^1.52.2",
-    "sass-loader": "^13.0.0",
-    "shx": "^0.3.4",
-    "style-loader": "^3.3.1",
-    "typescript": "^4.7.3"
-  },
-  "dependencies": {
-    "@types/google.maps": "^3.50.5",
-    "@types/navermaps": "^3.6.1",
-    "@types/kakaomaps": "1.1.2",
-    "@mint-ui/tools":"1.0.3",
-    "axios": "^1.2.0",
-    "classnames": "^2.3.1",
-    "style-inject": "^0.3.0",
-    "uuid": "^9.0.0",
-    "xml-js": "^1.6.11"
-  },
-  "scripts": {
-    "storybook": "start-storybook -p 3000",
-    "build-storybook": "build-storybook",
-    "prebuild": "shx rm -rf ./dist",
-    "build": "rollup -c",
-    "postbuild": "shx rm -rf ./dist/dist"
-  }
-}
+{
+  "name": "@mint-ui/map",
+  "version": "0.6.1-beta",
+  "main": "./dist/index.js",
+  "module": "./dist/index.es.js",
+  "browser": "./dist/index.umd.js",
+  "types": "./dist/index.d.ts",
+  "repository": "https://github.com/dev-rsquare/mint-ui-map",
+  "author": "RSQUARE",
+  "keywords": ["react", "react map", "map", "google", "naver", "kakao", "library", "typescript", "canvas", "marker"],
+  "license": "MIT",
+  "private": false,
+  "devDependencies": {
+    "@babel/core": "^7.18.2",
+    "@rollup/plugin-babel": "^5.3.1",
+    "@rollup/plugin-commonjs": "^22.0.0",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-typescript": "^8.3.2",
+    "@storybook/addon-actions": "^6.5.7",
+    "@storybook/addon-essentials": "^6.5.7",
+    "@storybook/addon-interactions": "^6.5.7",
+    "@storybook/addon-links": "^6.5.7",
+    "@storybook/builder-webpack5": "^6.5.7",
+    "@storybook/manager-webpack5": "^6.5.7",
+    "@storybook/preset-scss": "^1.0.3",
+    "@storybook/react": "^6.5.7",
+    "@storybook/testing-library": "^0.0.11",
+    "@types/classnames": "^2.3.1",
+    "@types/react": "^18.0.12",
+    "@types/react-dom": "^18.0.9",
+    "@types/uuid": "^9.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.27.0",
+    "@typescript-eslint/parser": "^5.27.0",
+    "babel-loader": "^8.2.5",
+    "babel-plugin-react-icons": "^0.1.1",
+    "css-loader": "^6.7.1",
+    "eslint": "^8.17.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.30.0",
+    "eslint-plugin-react-hooks": "^4.5.0",
+    "eslint-plugin-sort-keys-fix": "^1.1.2",
+    "eslint-plugin-storybook": "^0.5.12",
+    "postcss": "^8.4.14",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "rollup": "^2.75.5",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-postcss": "^4.0.2",
+    "sass": "^1.52.2",
+    "sass-loader": "^13.0.0",
+    "shx": "^0.3.4",
+    "style-loader": "^3.3.1",
+    "typescript": "^4.7.3"
+  },
+  "dependencies": {
+    "@types/google.maps": "^3.50.5",
+    "@types/navermaps": "^3.6.1",
+    "@types/kakaomaps": "1.1.2",
+    "@mint-ui/tools":"1.0.3",
+    "axios": "^1.2.0",
+    "classnames": "^2.3.1",
+    "style-inject": "^0.3.0",
+    "uuid": "^9.0.0",
+    "xml-js": "^1.6.11"
+  },
+  "scripts": {
+    "storybook": "start-storybook -p 3000",
+    "build-storybook": "build-storybook",
+    "prebuild": "shx rm -rf ./dist",
+    "build": "rollup -c",
+    "postbuild": "shx rm -rf ./dist/dist"
+  }
+}