@mint-ui/map 1.0.0 → 1.1.0

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

@@ -1,53 +1,54 @@
-/// <reference types="google.maps" />
-import { MintMapController } from "../core/MintMapController";
-import { MapType, MapVendorType } from "../types/CommonTypes";
-import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from "../types/MapDrawables";
-import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
-import { Bounds, Position } from "../types/MapTypes";
-import { MintMapProps } from "../types/MintMapProps";
-import { Property } from "csstype";
-export declare class GoogleMintMapController extends MintMapController {
-    type: MapType;
-    map: google.maps.Map | null;
-    scriptUrl: string;
-    scriptModules: string[];
-    protected mapEvent: MapEvent;
-    protected mapUIEvent: MapUIEvent;
-    constructor(props: MintMapProps);
-    polylineEvents: string[];
-    createPolyline(polyline: Polyline): void;
-    updatePolyline(polyline: Polyline, options: PolylineOptions): void;
-    polygonEvents: string[];
-    createPolygon(polygon: Polygon): void;
-    updatePolygon(polygon: Polygon, options: PolygonOptions): void;
-    private getValidOptions;
-    markerEvents: string[];
-    createMarker(marker: Marker): void;
-    updateMarker(marker: Marker, options: MarkerOptions): void;
-    private markerMaxZIndex;
-    private getMaxZIndex;
-    setMarkerZIndex(marker: Marker, zIndex: number): void;
-    markerToTheTop(marker: Marker): void;
-    clearDrawable(drawable: Drawable): boolean;
-    private dragged;
-    isMapDragged(): boolean;
-    setMapDragged(value: boolean): void;
-    private checkLoaded;
-    loadMapApi(): Promise<boolean>;
-    lastMousePosition: Position | null;
-    initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
-    destroyMap: () => void;
-    private fromGoogleBounds;
-    getCurrBounds(): Bounds;
-    panningTo(targetCenter: Position): void;
-    getZoomLevel(): number;
-    setZoomLevel(zoom: number): void;
-    getCenter(): Position;
-    setCenter(position: Position): void;
-    setMapCursor(cursor: Property.Cursor): void;
-    private eventMap;
-    addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    removeAllEventListener(eventName?: MapEventName | undefined): void;
-    private clearEventListener;
-}
+/// <reference types="google.maps" />
+import { MintMapController } from "../core/MintMapController";
+import { MapType, MapVendorType } from "../types/CommonTypes";
+import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from "../types/MapDrawables";
+import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
+import { Bounds, Position, Spacing } from '../types/MapTypes';
+import { MintMapProps } from "../types/MintMapProps";
+import { Property } from "csstype";
+export declare class GoogleMintMapController extends MintMapController {
+    type: MapType;
+    map: google.maps.Map | null;
+    scriptUrl: string;
+    scriptModules: string[];
+    protected mapEvent: MapEvent;
+    protected mapUIEvent: MapUIEvent;
+    constructor(props: MintMapProps);
+    polylineEvents: string[];
+    createPolyline(polyline: Polyline): void;
+    updatePolyline(polyline: Polyline, options: PolylineOptions): void;
+    polygonEvents: string[];
+    createPolygon(polygon: Polygon): void;
+    updatePolygon(polygon: Polygon, options: PolygonOptions): void;
+    private getValidOptions;
+    markerEvents: string[];
+    createMarker(marker: Marker): void;
+    updateMarker(marker: Marker, options: MarkerOptions): void;
+    private markerMaxZIndex;
+    private getMaxZIndex;
+    setMarkerZIndex(marker: Marker, zIndex: number): void;
+    markerToTheTop(marker: Marker): void;
+    clearDrawable(drawable: Drawable): boolean;
+    private dragged;
+    isMapDragged(): boolean;
+    setMapDragged(value: boolean): void;
+    private checkLoaded;
+    loadMapApi(): Promise<boolean>;
+    lastMousePosition: Position | null;
+    initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
+    destroyMap: () => void;
+    private fromGoogleBounds;
+    getCurrBounds(): Bounds;
+    panningTo(targetCenter: Position): void;
+    getZoomLevel(): number;
+    setZoomLevel(zoom: number): void;
+    getCenter(): Position;
+    setCenter(position: Position): void;
+    setMapCursor(cursor: Property.Cursor): void;
+    focusPositionsToFitViewport(positions: Position[], spacing?: number | Spacing): void;
+    private eventMap;
+    addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    removeAllEventListener(eventName?: MapEventName | undefined): void;
+    private clearEventListener;
+}

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

@@ -9,6 +9,17 @@ var MintMapController = require('../core/MintMapController.js');
 var waiting = require('../core/util/waiting.js');
 var MapEventTypes = require('../types/MapEventTypes.js');
 var MapTypes = require('../types/MapTypes.js');
+require('../core/MintMapCore.js');
+require('react');
+require('../types/MapDrawables.js');
+require('../core/provider/MintMapProvider.js');
+require('react-dom');
+require('../core/util/animation.js');
+require('../core/util/geo.js');
+var polygon = require('../core/util/polygon.js');
+require('../naver/NaverMintMapController.js');
+require('../core/advanced/MapLoadingComponents.js');
+require('../core/wrapper/MapControlWrapper.js');
 
 var GoogleMintMapController =
 /** @class */
@@ -445,7 +456,7 @@ function (_super) {
             return tslib.__generator(this, function (_g) {
               switch (_g.label) {
                 case 0:
-                  //이미 생성했으면 
+                  //이미 생성했으면
                   //1. divElement 가 그대로인 경우 기존 map 객체 리턴
                   //2. divElement 가 바뀐경우 기존 map 객체 destroy 하고 새로 생성
                   if (this.mapInitialized && this.map) {
@@ -601,6 +612,19 @@ function (_super) {
     });
   };
 
+  GoogleMintMapController.prototype.focusPositionsToFitViewport = function (positions, spacing) {
+    var _a;
+
+    var markerBounds = polygon.PolygonCalculator.getRegionInfo(positions);
+
+    if (!markerBounds.maxLat || !markerBounds.minLat || !markerBounds.maxLng || !markerBounds.minLng) {
+      throw new Error('markerBounds is invalid! in focusPositionsToFitViewport');
+    }
+
+    var pointBounds = new google.maps.LatLngBounds(new google.maps.LatLng(markerBounds.minLat, markerBounds.minLng), new google.maps.LatLng(markerBounds.maxLat, markerBounds.maxLng));
+    (_a = this.map) === null || _a === void 0 ? void 0 : _a.fitBounds(pointBounds, spacing);
+  };
+
   GoogleMintMapController.prototype.addEventListener = function (eventName, callback) {
     var _this = this;
 

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

@@ -1,5 +1,5 @@
-export * from './MintMap';
-export * from './core';
-export * from './naver/NaverMintMapController';
-export * from './google/GoogleMintMapController';
-export * from './types';
+export * from './MintMap';
+export * from './core';
+export * from './naver/NaverMintMapController';
+export * from './google/GoogleMintMapController';
+export * from './types';

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

@@ -10,6 +10,17 @@ var MapTypes = require('../types/MapTypes.js');
 var MapEventTypes = require('../types/MapEventTypes.js');
 var log = require('../core/util/log.js');
 var status = require('../core/util/status.js');
+require('../core/MintMapCore.js');
+require('react');
+require('../types/MapDrawables.js');
+require('../core/provider/MintMapProvider.js');
+require('react-dom');
+require('../core/util/animation.js');
+require('../core/util/geo.js');
+var polygon = require('../core/util/polygon.js');
+require('../naver/NaverMintMapController.js');
+require('../core/advanced/MapLoadingComponents.js');
+require('../core/wrapper/MapControlWrapper.js');
 
 var KakaoMintMapController =
 /** @class */
@@ -560,13 +571,13 @@ function (_super) {
   };
 
   KakaoMintMapController.prototype.getSafeZoomValue = function (value) {
-    /**
-     * 카카오는 구글/네이버와 다르게 줌레벨이 작아질수록 확대된다 (가장 확대된 것이 0)
-     * - 가장 확대된 값 : 1
-     * - 가장 축소된 값 : 14
-     *
-     * 그래서 세계지도가 없는 카카오는 동일한 사정인 네이버와 매핑하기로 한다.
-     * 문제는 둘 간의 줌 레벨별 축척이 일치하지 않는다. 그래서 가장 유사한 레벨 끼리 매핑이 필요하다
+    /**
+     * 카카오는 구글/네이버와 다르게 줌레벨이 작아질수록 확대된다 (가장 확대된 것이 0)
+     * - 가장 확대된 값 : 1
+     * - 가장 축소된 값 : 14
+     *
+     * 그래서 세계지도가 없는 카카오는 동일한 사정인 네이버와 매핑하기로 한다.
+     * 문제는 둘 간의 줌 레벨별 축척이 일치하지 않는다. 그래서 가장 유사한 레벨 끼리 매핑이 필요하다
     */
     var mapValue = this.getBaseToMapZoom(value);
 
@@ -641,6 +652,28 @@ function (_super) {
     return latLng ? new MapTypes.Position(latLng.getLat(), latLng.getLng()) : new MapTypes.Position(0, 0);
   };
 
+  KakaoMintMapController.prototype.focusPositionsToFitViewport = function (positions, spacing) {
+    var _a;
+
+    var markerBounds = polygon.PolygonCalculator.getRegionInfo(positions);
+
+    if (!markerBounds.maxLat || !markerBounds.minLat || !markerBounds.maxLng || !markerBounds.minLng) {
+      throw new Error('markerBounds is invalid! in focusPositionsToFitViewport');
+    }
+
+    var pointBounds = new kakao.maps.LatLngBounds(new kakao.maps.LatLng(markerBounds.minLat, markerBounds.minLng), new kakao.maps.LatLng(markerBounds.maxLat, markerBounds.maxLng));
+    var topSpacing, rightSpacing, bottomSpacing, leftSpacing;
+
+    if (typeof spacing === 'number') {
+      topSpacing = rightSpacing = bottomSpacing = leftSpacing = spacing;
+    } else if (spacing instanceof MapTypes.Spacing) {
+      topSpacing = spacing.top, rightSpacing = spacing.right, bottomSpacing = spacing.bottom, leftSpacing = spacing.left;
+    } // 카카오 지도는 setBounds 함수를 실행 할 때 애니메이션 효과가 없다.
+
+
+    (_a = this.map) === null || _a === void 0 ? void 0 : _a.setBounds(pointBounds, topSpacing, rightSpacing, bottomSpacing, leftSpacing);
+  };
+
   KakaoMintMapController.prototype.addEventListener = function (eventName, callback) {
     var _this = this;
 

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

@@ -1,55 +1,56 @@
-/// <reference types="navermaps" />
-import { MintMapController } from "../core/MintMapController";
-import { ObjectPool } from '@mint-ui/tools';
-import { MapType, MapVendorType } from "../types/CommonTypes";
-import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from "../types/MapDrawables";
-import { Bounds, Offset, Position } from "../types/MapTypes";
-import { MintMapProps } from "../types/MintMapProps";
-import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
-import { Property } from "csstype";
-export declare class NaverMintMapController extends MintMapController {
-    type: MapType;
-    map: naver.maps.Map | null;
-    scriptUrl: string;
-    scriptModules: string[];
-    protected mapEvent: MapEvent;
-    protected mapUIEvent: MapUIEvent;
-    markerPool?: ObjectPool<naver.maps.Marker>;
-    constructor(props: MintMapProps);
-    private initMarkerPool;
-    polylineEvents: string[];
-    createPolyline(polyline: Polyline): void;
-    updatePolyline(polyline: Polyline, options: PolylineOptions): void;
-    polygonEvents: string[];
-    createPolygon(polygon: Polygon): void;
-    updatePolygon(polygon: Polygon, options: PolygonOptions): void;
-    markerEvents: string[];
-    createMarker(marker: Marker): void;
-    updateMarker(marker: Marker, options: MarkerOptions): void;
-    private markerMaxZIndex;
-    private getMaxZIndex;
-    setMarkerZIndex(marker: Marker, zIndex: number): void;
-    markerToTheTop(marker: Marker): void;
-    clearDrawable(drawable: Drawable): boolean;
-    private dragged;
-    isMapDragged(): boolean;
-    setMapDragged(value: boolean): void;
-    private checkLoaded;
-    loadMapApi(): Promise<boolean>;
-    initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
-    private getSafeZoomValue;
-    destroyMap(): void;
-    getCurrBounds(): Bounds;
-    panningTo(targetCenter: Position): void;
-    getZoomLevel(): number;
-    setZoomLevel(zoom: number): void;
-    getCenter(): Position;
-    setCenter(position: Position): void;
-    setMapCursor(cursor: Property.Cursor): void;
-    naverPositionToOffset(position: Position): Offset;
-    private eventMap;
-    addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
-    removeAllEventListener(eventName?: MapEventName | undefined): void;
-    private clearEventListener;
-}
+/// <reference types="navermaps" />
+import { MintMapController } from "../core/MintMapController";
+import { ObjectPool } from '@mint-ui/tools';
+import { MapType, MapVendorType } from "../types/CommonTypes";
+import { Drawable, Marker, MarkerOptions, Polygon, PolygonOptions, Polyline, PolylineOptions } from "../types/MapDrawables";
+import { Bounds, Offset, Position, Spacing } from '../types/MapTypes';
+import { MintMapProps } from "../types/MintMapProps";
+import { EventCallback, EventParamType, MapEvent, MapEventName, MapUIEvent } from "../types/MapEventTypes";
+import { Property } from "csstype";
+export declare class NaverMintMapController extends MintMapController {
+    type: MapType;
+    map: naver.maps.Map | null;
+    scriptUrl: string;
+    scriptModules: string[];
+    protected mapEvent: MapEvent;
+    protected mapUIEvent: MapUIEvent;
+    markerPool?: ObjectPool<naver.maps.Marker>;
+    constructor(props: MintMapProps);
+    private initMarkerPool;
+    polylineEvents: string[];
+    createPolyline(polyline: Polyline): void;
+    updatePolyline(polyline: Polyline, options: PolylineOptions): void;
+    polygonEvents: string[];
+    createPolygon(polygon: Polygon): void;
+    updatePolygon(polygon: Polygon, options: PolygonOptions): void;
+    markerEvents: string[];
+    createMarker(marker: Marker): void;
+    updateMarker(marker: Marker, options: MarkerOptions): void;
+    private markerMaxZIndex;
+    private getMaxZIndex;
+    setMarkerZIndex(marker: Marker, zIndex: number): void;
+    markerToTheTop(marker: Marker): void;
+    clearDrawable(drawable: Drawable): boolean;
+    private dragged;
+    isMapDragged(): boolean;
+    setMapDragged(value: boolean): void;
+    private checkLoaded;
+    loadMapApi(): Promise<boolean>;
+    initializingMap(divElement: HTMLDivElement): Promise<MapVendorType>;
+    private getSafeZoomValue;
+    destroyMap(): void;
+    getCurrBounds(): Bounds;
+    panningTo(targetCenter: Position): void;
+    getZoomLevel(): number;
+    setZoomLevel(zoom: number): void;
+    getCenter(): Position;
+    setCenter(position: Position): void;
+    setMapCursor(cursor: Property.Cursor): void;
+    focusPositionsToFitViewport(positions: Position[], spacing?: number | Spacing): void;
+    naverPositionToOffset(position: Position): Offset;
+    private eventMap;
+    addEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    removeEventListener(eventName: MapEventName, callback: EventCallback<EventParamType>): void;
+    removeAllEventListener(eventName?: MapEventName | undefined): void;
+    private clearEventListener;
+}

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

@@ -10,6 +10,16 @@ var MapTypes = require('../types/MapTypes.js');
 var MapEventTypes = require('../types/MapEventTypes.js');
 var log = require('../core/util/log.js');
 var status = require('../core/util/status.js');
+require('../core/MintMapCore.js');
+require('react');
+require('../types/MapDrawables.js');
+require('../core/provider/MintMapProvider.js');
+require('react-dom');
+require('../core/util/animation.js');
+require('../core/util/geo.js');
+var polygon = require('../core/util/polygon.js');
+require('../core/advanced/MapLoadingComponents.js');
+require('../core/wrapper/MapControlWrapper.js');
 
 var NaverMintMapController =
 /** @class */
@@ -258,11 +268,11 @@ function (_super) {
       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 MapTypes.Position) {
@@ -402,7 +412,7 @@ function (_super) {
                   };
 
                   params = tslib.__assign({
-                    ncpClientId: this.mapProps.mapKey,
+                    ncpKeyId: this.mapProps.mapKey,
                     submodules: this.scriptModules.join(','),
                     callback: callbackName
                   }, this.mapProps.scriptParams);
@@ -465,7 +475,7 @@ function (_super) {
             return tslib.__generator(this, function (_g) {
               switch (_g.label) {
                 case 0:
-                  //이미 생성했으면 
+                  //이미 생성했으면
                   //1. divElement 가 그대로인 경우 기존 map 객체 리턴
                   //2. divElement 가 바뀐경우 기존 map 객체 destroy 하고 새로 생성
                   if (this.mapInitialized && this.map) {
@@ -646,6 +656,34 @@ function (_super) {
     target && (target.style.cursor = cursor);
   };
 
+  NaverMintMapController.prototype.focusPositionsToFitViewport = function (positions, spacing) {
+    var _a;
+
+    var markerBounds = polygon.PolygonCalculator.getRegionInfo(positions);
+
+    if (!markerBounds.maxLat || !markerBounds.minLat || !markerBounds.maxLng || !markerBounds.minLng) {
+      throw new Error('markerBounds is invalid! in focusPositionsToFitViewport');
+    }
+
+    var pointBounds = naver.maps.PointBounds.bounds(new naver.maps.LatLng(markerBounds.minLat, markerBounds.minLng), new naver.maps.LatLng(markerBounds.maxLat, markerBounds.maxLng));
+    var marginOptions;
+
+    if (typeof spacing === 'number') {
+      marginOptions = {
+        top: spacing,
+        right: spacing,
+        bottom: spacing,
+        left: spacing
+      };
+    } else if (spacing instanceof MapTypes.Spacing) {
+      marginOptions = spacing;
+    }
+
+    (_a = this.map) === null || _a === void 0 ? void 0 : _a.panToBounds(pointBounds, {
+      duration: 500
+    }, marginOptions);
+  };
+
   NaverMintMapController.prototype.naverPositionToOffset = function (position) {
     if (!this.map) {
       return new MapTypes.Offset(0, 0);