@mint-ui/map 0.2.0-beta → 0.3.0-beta

package/dist/components/mint-map/MintMap.d.ts

@@ -12,12 +12,14 @@ export interface MintMapProps extends MintMapEvents {
     visible?: boolean;
     markerCache?: boolean;
     markerCachePoolSize?: number;
+    boundsChangeThrottlingTime?: number;
 }
 export interface MintMapEvents {
     onBoundsChanged?: (bounds: Bounds) => void;
     onZoomChanged?: (level: number) => void;
     onLoad?: (map: MapVendorType, controller: MintMapController) => void;
     onClick?: (positon: Position) => void;
+    onMouseMove?: (positon: Position) => void;
 }
 export declare class Position {
     lat: number;
@@ -36,6 +38,7 @@ export declare class Bounds {
     private covertNWSEtoNESW;
     private covertNESWtoNWSE;
     getCenter(): Position;
+    includesPosition(pos: Position): boolean;
     getIncludedPositions(positions: Position[]): Position[];
     includes(positions: Position | Position[]): boolean;
     includesOnlyOnePoint(positions: Position[]): boolean;

package/dist/components/mint-map/MintMap.js

@@ -65,7 +65,11 @@ var Bounds = function () {
   };
 
   Bounds.prototype.getCenter = function () {
-    return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+    return new Position(this.se.lat + (this.nw.lat - this.se.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+  };
+
+  Bounds.prototype.includesPosition = function (pos) {
+    return this.nw.lng < pos.lng && this.se.lng > pos.lng && this.se.lat < pos.lat && this.nw.lat > pos.lat;
   };
 
   Bounds.prototype.getIncludedPositions = function (positions) {
@@ -74,7 +78,7 @@ var Bounds = function () {
     for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
       var pos = positions_1[_i];
 
-      if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+      if (this.includesPosition(pos)) {
         result.push(pos);
       }
     }
@@ -88,7 +92,7 @@ var Bounds = function () {
     for (var _i = 0, positions_2 = positions; _i < positions_2.length; _i++) {
       var pos = positions_2[_i];
 
-      if (this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng) {
+      if (!this.includesPosition(pos)) {
         return false;
       }
     }
@@ -100,7 +104,7 @@ var Bounds = function () {
     for (var _i = 0, positions_3 = positions; _i < positions_3.length; _i++) {
       var pos = positions_3[_i];
 
-      if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+      if (this.includesPosition(pos)) {
         return true;
       }
     }

package/dist/components/mint-map/core/MintMapController.d.ts

@@ -30,4 +30,6 @@ export declare abstract class MintMapController {
     buildUrl(baseUrl: string, param: {
         [key: string]: string | string[];
     }): string;
+    private processedTime;
+    checkBoundsChangeThrottleTime(): boolean;
 }

package/dist/components/mint-map/core/MintMapController.js

@@ -8,6 +8,7 @@ var MintMapController = function () {
   function MintMapController(props) {
     this.mapApiLoaded = false;
     this.mapInitialized = false;
+    this.processedTime = 0;
     this.mapProps = props;
   }
 
@@ -52,6 +53,18 @@ var MintMapController = function () {
     return "".concat(baseUrl, "?").concat(params);
   };
 
+  MintMapController.prototype.checkBoundsChangeThrottleTime = function () {
+    if (!this.mapProps.boundsChangeThrottlingTime) return true;
+    var time = new Date().getTime();
+
+    if (this.processedTime > 0 && time - this.processedTime < this.mapProps.boundsChangeThrottlingTime) {
+      return false;
+    } else {
+      this.processedTime = time;
+      return true;
+    }
+  };
+
   return MintMapController;
 }();
 

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

@@ -0,0 +1,18 @@
+import { Bounds, Position } from "../../MintMap";
+export interface ClusterInfo {
+    bounds: Bounds;
+    checked: boolean;
+    center: boolean;
+    centerPosition: Position;
+    incList: any;
+    itemList: Position[];
+    size: number;
+}
+export interface ClusterStatus {
+    total: number;
+    average: number;
+    min: number;
+    max: number;
+}
+export declare type ClusterSizeCalculator = (info: ClusterInfo, status: ClusterStatus) => number;
+export declare const getClusterInfo: (basePixelSize: number, mapBounds: Bounds, mapWidth: number, mapHeight: number, itemList: Position[], sizeFunction?: ClusterSizeCalculator) => (ClusterInfo[] | Bounds[])[];

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

@@ -19,7 +19,7 @@ function MapPolygonWrapper(_a) {
   React.useEffect(function () {
     return function () {
       if (polygonRef.current) {
-        console.log('polygon cleared', controller.clearDrawable(polygonRef.current));
+        controller.clearDrawable(polygonRef.current);
       }
     };
   }, []);

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

@@ -19,7 +19,7 @@ function MapPolylineWrapper(_a) {
   React.useEffect(function () {
     return function () {
       if (polylineRef.current) {
-        console.log('polyline cleared', controller.clearDrawable(polylineRef.current));
+        controller.clearDrawable(polylineRef.current);
       }
     };
   }, []);

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

@@ -23,7 +23,13 @@ var GoogleMintMapController = function (_super) {
     _this.dragged = false;
 
     _this.destroyMap = function () {
-      console.log("".concat(_this.type, " map destroy feature is not supported"));
+      try {
+        _this.map && google.maps.event.clearInstanceListeners(_this.map);
+      } catch (e) {
+        console.log('google map destroy error', e);
+      }
+
+      console.log("".concat(_this.type, " map destroyed"));
     };
 
     console.log("".concat(_this.type, " controller loadded"));
@@ -111,7 +117,8 @@ var GoogleMintMapController = function (_super) {
       var outLine = position.map(function (elem) {
         return Array.isArray(elem) ? new MintMap.Position(elem[1], elem[0]) : elem;
       });
-      var paths = innerPositions ? tslib.__spreadArray([outLine], innerPositions, true) : [outLine];
+      var paths = [outLine];
+      innerPositions && paths.push.apply(paths, innerPositions);
       var pol_2 = new google.maps.Polygon({
         map: this.map,
         paths: paths,
@@ -136,6 +143,16 @@ var GoogleMintMapController = function (_super) {
   GoogleMintMapController.prototype.updatePolygon = function (polygon, options) {
     if (polygon && polygon.native && polygon.native instanceof google.maps.Polygon) {
       var polygonOption = this.getValidOptions(options);
+
+      if (this.map && Array.isArray(options.position)) {
+        var outLine = options.position.map(function (elem) {
+          return Array.isArray(elem) ? new MintMap.Position(elem[1], elem[0]) : elem;
+        });
+        var paths = [outLine];
+        options.innerPositions && paths.push.apply(paths, options.innerPositions);
+        polygonOption.paths = paths;
+      }
+
       polygon.native.setOptions(polygonOption);
     }
   };
@@ -367,18 +384,28 @@ var GoogleMintMapController = function (_super) {
                     minZoom: (_c = this.mapProps.base) === null || _c === void 0 ? void 0 : _c.minZoomLevel,
                     zoom: (_d = this.mapProps.base) === null || _d === void 0 ? void 0 : _d.zoomLevel,
                     disableDefaultUI: true,
-                    gestureHandling: 'greedy'
+                    gestureHandling: 'greedy',
+                    clickableIcons: false
                   });
                   map.addListener('idle', function () {
-                    _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                    _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                   });
                   map.addListener('zoom_changed', function () {
                     _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                   });
                   map.addListener('click', function (e) {
+                    if (!_this.mapProps.onClick) return;
+                    var pos = new MintMap.Position(e.latLng.lat(), e.latLng.lng());
+                    pos.offset = new MintMap.Offset(e.pixel.x, e.pixel.y);
+
+                    _this.mapProps.onClick(pos);
+                  });
+                  map.addListener('mousemove', function (e) {
+                    if (!_this.mapProps.onMouseMove) return;
                     var pos = new MintMap.Position(e.latLng.lat(), e.latLng.lng());
                     pos.offset = new MintMap.Offset(e.pixel.x, e.pixel.y);
-                    _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                    _this.mapProps.onMouseMove(pos);
                   });
                   this.map = map;
                   this.mapInitialized = true;

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

@@ -127,7 +127,8 @@ var NaverMintMapController = function (_super) {
       var outLine = position.map(function (elem) {
         return Array.isArray(elem) ? new MintMap.Position(elem[1], elem[0]) : elem;
       });
-      var paths = innerPositions ? tslib.__spreadArray([outLine], innerPositions, true) : [outLine];
+      var paths = [outLine];
+      innerPositions && paths.push.apply(paths, innerPositions);
       var pol_2 = new naver.maps.Polygon({
         map: this.map,
         paths: paths,
@@ -150,8 +151,18 @@ var NaverMintMapController = function (_super) {
 
   NaverMintMapController.prototype.updatePolygon = function (polygon, options) {
     if (polygon && polygon.native && polygon.native instanceof naver.maps.Polygon) {
+      var paths = void 0;
+
+      if (Array.isArray(options.position)) {
+        var outLine = options.position.map(function (elem) {
+          return Array.isArray(elem) ? new MintMap.Position(elem[1], elem[0]) : elem;
+        });
+        paths = [outLine];
+        options.innerPositions && paths.push.apply(paths, options.innerPositions);
+      }
+
       polygon.native.setOptions({
-        paths: polygon.native.getPaths(),
+        paths: paths || polygon.native.getPaths(),
         visible: options.visible === undefined || options.visible,
         strokeColor: options.lineColor,
         strokeWeight: options.lineSize,
@@ -415,17 +426,25 @@ var NaverMintMapController = function (_super) {
                       _this.dragged = true;
                     }
                   });
-                  map.addListener('idle', function () {
-                    _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                  map.addListener('idle', function (e) {
+                    _this.map && _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                   });
                   map.addListener('zoom_changed', function () {
                     _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                   });
                   map.addListener('click', function (e) {
-                    console.log('map click', e);
+                    if (!_this.mapProps.onClick) return;
                     var pos = new MintMap.Position(e.coord.y, e.coord.x);
                     pos.offset = new MintMap.Offset(e.offset.x, e.offset.y);
-                    _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                    _this.mapProps.onClick(pos);
+                  });
+                  map.addListener('mousemove', function (e) {
+                    if (!_this.mapProps.onMouseMove) return;
+                    var pos = new MintMap.Position(e.coord.y, e.coord.x);
+                    pos.offset = new MintMap.Offset(e.offset.x, e.offset.y);
+
+                    _this.mapProps.onMouseMove(pos);
                   });
                   this.map = map;
                   this.mapInitialized = true;
@@ -454,14 +473,14 @@ var NaverMintMapController = function (_super) {
   NaverMintMapController.prototype.destroyMap = function () {
     var _a;
 
-    console.log("".concat(this.type, " map destroyed"));
-
     try {
       this.map && this.map.destroy();
       (_a = this.markerPool) === null || _a === void 0 ? void 0 : _a.destroy();
     } catch (e) {
       console.log('naver map destroy error', e);
     }
+
+    console.log("".concat(this.type, " map destroyed"));
   };
 
   NaverMintMapController.prototype.getCurrBounds = function () {
@@ -470,7 +489,7 @@ var NaverMintMapController = function (_super) {
     }
 
     var bounds = this.map.getBounds();
-    return MintMap.Bounds.fromNWSE(new MintMap.Position(bounds.getMin().y, bounds.getMin().x), new MintMap.Position(bounds.getMax().y, bounds.getMax().x));
+    return MintMap.Bounds.fromNWSE(new MintMap.Position(bounds.getMax().y, bounds.getMin().x), new MintMap.Position(bounds.getMin().y, bounds.getMax().x));
   };
 
   NaverMintMapController.prototype.panningTo = function (targetCenter) {

package/dist/index.es.js

@@ -1,4 +1,4 @@
-import { __awaiter, __generator, __extends, __spreadArray, __assign, __rest } from 'tslib';
+import { __awaiter, __generator, __extends, __assign, __rest, __spreadArray } from 'tslib';
 import React, { createContext, useContext, useRef, useState, useEffect } from 'react';
 import classNames from 'classnames/bind';
 import styleInject from 'style-inject';
@@ -319,6 +319,7 @@ var MintMapController = function () {
   function MintMapController(props) {
     this.mapApiLoaded = false;
     this.mapInitialized = false;
+    this.processedTime = 0;
     this.mapProps = props;
   }
 
@@ -363,6 +364,18 @@ var MintMapController = function () {
     return "".concat(baseUrl, "?").concat(params);
   };
 
+  MintMapController.prototype.checkBoundsChangeThrottleTime = function () {
+    if (!this.mapProps.boundsChangeThrottlingTime) return true;
+    var time = new Date().getTime();
+
+    if (this.processedTime > 0 && time - this.processedTime < this.mapProps.boundsChangeThrottlingTime) {
+      return false;
+    } else {
+      this.processedTime = time;
+      return true;
+    }
+  };
+
   return MintMapController;
 }();
 
@@ -511,7 +524,8 @@ var NaverMintMapController = function (_super) {
       var outLine = position.map(function (elem) {
         return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
       });
-      var paths = innerPositions ? __spreadArray([outLine], innerPositions, true) : [outLine];
+      var paths = [outLine];
+      innerPositions && paths.push.apply(paths, innerPositions);
       var pol_2 = new naver.maps.Polygon({
         map: this.map,
         paths: paths,
@@ -534,8 +548,18 @@ var NaverMintMapController = function (_super) {
 
   NaverMintMapController.prototype.updatePolygon = function (polygon, options) {
     if (polygon && polygon.native && polygon.native instanceof naver.maps.Polygon) {
+      var paths = void 0;
+
+      if (Array.isArray(options.position)) {
+        var outLine = options.position.map(function (elem) {
+          return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
+        });
+        paths = [outLine];
+        options.innerPositions && paths.push.apply(paths, options.innerPositions);
+      }
+
       polygon.native.setOptions({
-        paths: polygon.native.getPaths(),
+        paths: paths || polygon.native.getPaths(),
         visible: options.visible === undefined || options.visible,
         strokeColor: options.lineColor,
         strokeWeight: options.lineSize,
@@ -799,17 +823,25 @@ var NaverMintMapController = function (_super) {
                       _this.dragged = true;
                     }
                   });
-                  map.addListener('idle', function () {
-                    _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                  map.addListener('idle', function (e) {
+                    _this.map && _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                   });
                   map.addListener('zoom_changed', function () {
                     _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                   });
                   map.addListener('click', function (e) {
-                    console.log('map click', e);
+                    if (!_this.mapProps.onClick) return;
                     var pos = new Position(e.coord.y, e.coord.x);
                     pos.offset = new Offset(e.offset.x, e.offset.y);
-                    _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                    _this.mapProps.onClick(pos);
+                  });
+                  map.addListener('mousemove', function (e) {
+                    if (!_this.mapProps.onMouseMove) return;
+                    var pos = new Position(e.coord.y, e.coord.x);
+                    pos.offset = new Offset(e.offset.x, e.offset.y);
+
+                    _this.mapProps.onMouseMove(pos);
                   });
                   this.map = map;
                   this.mapInitialized = true;
@@ -838,14 +870,14 @@ var NaverMintMapController = function (_super) {
   NaverMintMapController.prototype.destroyMap = function () {
     var _a;
 
-    console.log("".concat(this.type, " map destroyed"));
-
     try {
       this.map && this.map.destroy();
       (_a = this.markerPool) === null || _a === void 0 ? void 0 : _a.destroy();
     } catch (e) {
       console.log('naver map destroy error', e);
     }
+
+    console.log("".concat(this.type, " map destroyed"));
   };
 
   NaverMintMapController.prototype.getCurrBounds = function () {
@@ -854,7 +886,7 @@ var NaverMintMapController = function (_super) {
     }
 
     var bounds = this.map.getBounds();
-    return Bounds.fromNWSE(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
+    return Bounds.fromNWSE(new Position(bounds.getMax().y, bounds.getMin().x), new Position(bounds.getMin().y, bounds.getMax().x));
   };
 
   NaverMintMapController.prototype.panningTo = function (targetCenter) {
@@ -896,7 +928,13 @@ var GoogleMintMapController = function (_super) {
     _this.dragged = false;
 
     _this.destroyMap = function () {
-      console.log("".concat(_this.type, " map destroy feature is not supported"));
+      try {
+        _this.map && google.maps.event.clearInstanceListeners(_this.map);
+      } catch (e) {
+        console.log('google map destroy error', e);
+      }
+
+      console.log("".concat(_this.type, " map destroyed"));
     };
 
     console.log("".concat(_this.type, " controller loadded"));
@@ -984,7 +1022,8 @@ var GoogleMintMapController = function (_super) {
       var outLine = position.map(function (elem) {
         return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
       });
-      var paths = innerPositions ? __spreadArray([outLine], innerPositions, true) : [outLine];
+      var paths = [outLine];
+      innerPositions && paths.push.apply(paths, innerPositions);
       var pol_2 = new google.maps.Polygon({
         map: this.map,
         paths: paths,
@@ -1009,6 +1048,16 @@ var GoogleMintMapController = function (_super) {
   GoogleMintMapController.prototype.updatePolygon = function (polygon, options) {
     if (polygon && polygon.native && polygon.native instanceof google.maps.Polygon) {
       var polygonOption = this.getValidOptions(options);
+
+      if (this.map && Array.isArray(options.position)) {
+        var outLine = options.position.map(function (elem) {
+          return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
+        });
+        var paths = [outLine];
+        options.innerPositions && paths.push.apply(paths, options.innerPositions);
+        polygonOption.paths = paths;
+      }
+
       polygon.native.setOptions(polygonOption);
     }
   };
@@ -1240,18 +1289,28 @@ var GoogleMintMapController = function (_super) {
                     minZoom: (_c = this.mapProps.base) === null || _c === void 0 ? void 0 : _c.minZoomLevel,
                     zoom: (_d = this.mapProps.base) === null || _d === void 0 ? void 0 : _d.zoomLevel,
                     disableDefaultUI: true,
-                    gestureHandling: 'greedy'
+                    gestureHandling: 'greedy',
+                    clickableIcons: false
                   });
                   map.addListener('idle', function () {
-                    _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                    _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                   });
                   map.addListener('zoom_changed', function () {
                     _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                   });
                   map.addListener('click', function (e) {
+                    if (!_this.mapProps.onClick) return;
                     var pos = new Position(e.latLng.lat(), e.latLng.lng());
                     pos.offset = new Offset(e.pixel.x, e.pixel.y);
-                    _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                    _this.mapProps.onClick(pos);
+                  });
+                  map.addListener('mousemove', function (e) {
+                    if (!_this.mapProps.onMouseMove) return;
+                    var pos = new Position(e.latLng.lat(), e.latLng.lng());
+                    pos.offset = new Offset(e.pixel.x, e.pixel.y);
+
+                    _this.mapProps.onMouseMove(pos);
                   });
                   this.map = map;
                   this.mapInitialized = true;
@@ -1353,7 +1412,11 @@ var Bounds = function () {
   };
 
   Bounds.prototype.getCenter = function () {
-    return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+    return new Position(this.se.lat + (this.nw.lat - this.se.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+  };
+
+  Bounds.prototype.includesPosition = function (pos) {
+    return this.nw.lng < pos.lng && this.se.lng > pos.lng && this.se.lat < pos.lat && this.nw.lat > pos.lat;
   };
 
   Bounds.prototype.getIncludedPositions = function (positions) {
@@ -1362,7 +1425,7 @@ var Bounds = function () {
     for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
       var pos = positions_1[_i];
 
-      if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+      if (this.includesPosition(pos)) {
         result.push(pos);
       }
     }
@@ -1376,7 +1439,7 @@ var Bounds = function () {
     for (var _i = 0, positions_2 = positions; _i < positions_2.length; _i++) {
       var pos = positions_2[_i];
 
-      if (this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng) {
+      if (!this.includesPosition(pos)) {
         return false;
       }
     }
@@ -1388,7 +1451,7 @@ var Bounds = function () {
     for (var _i = 0, positions_3 = positions; _i < positions_3.length; _i++) {
       var pos = positions_3[_i];
 
-      if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+      if (this.includesPosition(pos)) {
         return true;
       }
     }
@@ -1928,7 +1991,7 @@ function MapPolygonWrapper(_a) {
   useEffect(function () {
     return function () {
       if (polygonRef.current) {
-        console.log('polygon cleared', controller.clearDrawable(polygonRef.current));
+        controller.clearDrawable(polygonRef.current);
       }
     };
   }, []);
@@ -2181,7 +2244,7 @@ function MapPolylineWrapper(_a) {
   useEffect(function () {
     return function () {
       if (polylineRef.current) {
-        console.log('polyline cleared', controller.clearDrawable(polylineRef.current));
+        controller.clearDrawable(polylineRef.current);
       }
     };
   }, []);

package/dist/index.umd.js

@@ -324,6 +324,7 @@
     function MintMapController(props) {
       this.mapApiLoaded = false;
       this.mapInitialized = false;
+      this.processedTime = 0;
       this.mapProps = props;
     }
 
@@ -368,6 +369,18 @@
       return "".concat(baseUrl, "?").concat(params);
     };
 
+    MintMapController.prototype.checkBoundsChangeThrottleTime = function () {
+      if (!this.mapProps.boundsChangeThrottlingTime) return true;
+      var time = new Date().getTime();
+
+      if (this.processedTime > 0 && time - this.processedTime < this.mapProps.boundsChangeThrottlingTime) {
+        return false;
+      } else {
+        this.processedTime = time;
+        return true;
+      }
+    };
+
     return MintMapController;
   }();
 
@@ -516,7 +529,8 @@
         var outLine = position.map(function (elem) {
           return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
         });
-        var paths = innerPositions ? tslib.__spreadArray([outLine], innerPositions, true) : [outLine];
+        var paths = [outLine];
+        innerPositions && paths.push.apply(paths, innerPositions);
         var pol_2 = new naver.maps.Polygon({
           map: this.map,
           paths: paths,
@@ -539,8 +553,18 @@
 
     NaverMintMapController.prototype.updatePolygon = function (polygon, options) {
       if (polygon && polygon.native && polygon.native instanceof naver.maps.Polygon) {
+        var paths = void 0;
+
+        if (Array.isArray(options.position)) {
+          var outLine = options.position.map(function (elem) {
+            return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
+          });
+          paths = [outLine];
+          options.innerPositions && paths.push.apply(paths, options.innerPositions);
+        }
+
         polygon.native.setOptions({
-          paths: polygon.native.getPaths(),
+          paths: paths || polygon.native.getPaths(),
           visible: options.visible === undefined || options.visible,
           strokeColor: options.lineColor,
           strokeWeight: options.lineSize,
@@ -804,17 +828,25 @@
                         _this.dragged = true;
                       }
                     });
-                    map.addListener('idle', function () {
-                      _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                    map.addListener('idle', function (e) {
+                      _this.map && _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                     });
                     map.addListener('zoom_changed', function () {
                       _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                     });
                     map.addListener('click', function (e) {
-                      console.log('map click', e);
+                      if (!_this.mapProps.onClick) return;
                       var pos = new Position(e.coord.y, e.coord.x);
                       pos.offset = new Offset(e.offset.x, e.offset.y);
-                      _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                      _this.mapProps.onClick(pos);
+                    });
+                    map.addListener('mousemove', function (e) {
+                      if (!_this.mapProps.onMouseMove) return;
+                      var pos = new Position(e.coord.y, e.coord.x);
+                      pos.offset = new Offset(e.offset.x, e.offset.y);
+
+                      _this.mapProps.onMouseMove(pos);
                     });
                     this.map = map;
                     this.mapInitialized = true;
@@ -843,14 +875,14 @@
     NaverMintMapController.prototype.destroyMap = function () {
       var _a;
 
-      console.log("".concat(this.type, " map destroyed"));
-
       try {
         this.map && this.map.destroy();
         (_a = this.markerPool) === null || _a === void 0 ? void 0 : _a.destroy();
       } catch (e) {
         console.log('naver map destroy error', e);
       }
+
+      console.log("".concat(this.type, " map destroyed"));
     };
 
     NaverMintMapController.prototype.getCurrBounds = function () {
@@ -859,7 +891,7 @@
       }
 
       var bounds = this.map.getBounds();
-      return Bounds.fromNWSE(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
+      return Bounds.fromNWSE(new Position(bounds.getMax().y, bounds.getMin().x), new Position(bounds.getMin().y, bounds.getMax().x));
     };
 
     NaverMintMapController.prototype.panningTo = function (targetCenter) {
@@ -901,7 +933,13 @@
       _this.dragged = false;
 
       _this.destroyMap = function () {
-        console.log("".concat(_this.type, " map destroy feature is not supported"));
+        try {
+          _this.map && google.maps.event.clearInstanceListeners(_this.map);
+        } catch (e) {
+          console.log('google map destroy error', e);
+        }
+
+        console.log("".concat(_this.type, " map destroyed"));
       };
 
       console.log("".concat(_this.type, " controller loadded"));
@@ -989,7 +1027,8 @@
         var outLine = position.map(function (elem) {
           return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
         });
-        var paths = innerPositions ? tslib.__spreadArray([outLine], innerPositions, true) : [outLine];
+        var paths = [outLine];
+        innerPositions && paths.push.apply(paths, innerPositions);
         var pol_2 = new google.maps.Polygon({
           map: this.map,
           paths: paths,
@@ -1014,6 +1053,16 @@
     GoogleMintMapController.prototype.updatePolygon = function (polygon, options) {
       if (polygon && polygon.native && polygon.native instanceof google.maps.Polygon) {
         var polygonOption = this.getValidOptions(options);
+
+        if (this.map && Array.isArray(options.position)) {
+          var outLine = options.position.map(function (elem) {
+            return Array.isArray(elem) ? new Position(elem[1], elem[0]) : elem;
+          });
+          var paths = [outLine];
+          options.innerPositions && paths.push.apply(paths, options.innerPositions);
+          polygonOption.paths = paths;
+        }
+
         polygon.native.setOptions(polygonOption);
       }
     };
@@ -1245,18 +1294,28 @@
                       minZoom: (_c = this.mapProps.base) === null || _c === void 0 ? void 0 : _c.minZoomLevel,
                       zoom: (_d = this.mapProps.base) === null || _d === void 0 ? void 0 : _d.zoomLevel,
                       disableDefaultUI: true,
-                      gestureHandling: 'greedy'
+                      gestureHandling: 'greedy',
+                      clickableIcons: false
                     });
                     map.addListener('idle', function () {
-                      _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
+                      _this.checkBoundsChangeThrottleTime() && _this.mapProps.onBoundsChanged && _this.mapProps.onBoundsChanged(_this.getCurrBounds());
                     });
                     map.addListener('zoom_changed', function () {
                       _this.map && _this.mapProps.onZoomChanged && _this.mapProps.onZoomChanged(_this.map.getZoom());
                     });
                     map.addListener('click', function (e) {
+                      if (!_this.mapProps.onClick) return;
                       var pos = new Position(e.latLng.lat(), e.latLng.lng());
                       pos.offset = new Offset(e.pixel.x, e.pixel.y);
-                      _this.mapProps.onClick && _this.mapProps.onClick(pos);
+
+                      _this.mapProps.onClick(pos);
+                    });
+                    map.addListener('mousemove', function (e) {
+                      if (!_this.mapProps.onMouseMove) return;
+                      var pos = new Position(e.latLng.lat(), e.latLng.lng());
+                      pos.offset = new Offset(e.pixel.x, e.pixel.y);
+
+                      _this.mapProps.onMouseMove(pos);
                     });
                     this.map = map;
                     this.mapInitialized = true;
@@ -1358,7 +1417,11 @@
     };
 
     Bounds.prototype.getCenter = function () {
-      return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+      return new Position(this.se.lat + (this.nw.lat - this.se.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
+    };
+
+    Bounds.prototype.includesPosition = function (pos) {
+      return this.nw.lng < pos.lng && this.se.lng > pos.lng && this.se.lat < pos.lat && this.nw.lat > pos.lat;
     };
 
     Bounds.prototype.getIncludedPositions = function (positions) {
@@ -1367,7 +1430,7 @@
       for (var _i = 0, positions_1 = positions; _i < positions_1.length; _i++) {
         var pos = positions_1[_i];
 
-        if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+        if (this.includesPosition(pos)) {
           result.push(pos);
         }
       }
@@ -1381,7 +1444,7 @@
       for (var _i = 0, positions_2 = positions; _i < positions_2.length; _i++) {
         var pos = positions_2[_i];
 
-        if (this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng) {
+        if (!this.includesPosition(pos)) {
           return false;
         }
       }
@@ -1393,7 +1456,7 @@
       for (var _i = 0, positions_3 = positions; _i < positions_3.length; _i++) {
         var pos = positions_3[_i];
 
-        if (!(this.nw.lat > pos.lat || this.se.lat < pos.lat || this.nw.lng > pos.lng || this.se.lng < pos.lng)) {
+        if (this.includesPosition(pos)) {
           return true;
         }
       }
@@ -1933,7 +1996,7 @@
     React.useEffect(function () {
       return function () {
         if (polygonRef.current) {
-          console.log('polygon cleared', controller.clearDrawable(polygonRef.current));
+          controller.clearDrawable(polygonRef.current);
         }
       };
     }, []);
@@ -2186,7 +2249,7 @@
     React.useEffect(function () {
       return function () {
         if (polylineRef.current) {
-          console.log('polyline cleared', controller.clearDrawable(polylineRef.current));
+          controller.clearDrawable(polylineRef.current);
         }
       };
     }, []);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mint-ui/map",
-  "version": "0.2.0-beta",
+  "version": "0.3.0-beta",
   "main": "./dist/index.js",
   "module": "./dist/index.es.js",
   "browser": "./dist/index.umd.js",