@mint-ui/map 0.7.1-beta → 0.7.3-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/mint-map/core/MintMapController.d.ts +1 -0
- package/dist/components/mint-map/core/MintMapController.js +53 -1
- package/dist/components/mint-map/core/wrapper/MapControlWrapper.d.ts +2 -1
- package/dist/components/mint-map/core/wrapper/MapControlWrapper.js +3 -1
- package/dist/components/mint-map/core/wrapper/MintMapWrapper.module.scss.js +2 -2
- package/dist/index.es.js +57 -3
- package/dist/index.umd.js +57 -3
- package/package.json +1 -1
|
@@ -62,5 +62,6 @@ export declare abstract class MintMapController {
|
|
|
62
62
|
checkBoundsChangeThrottleTime(): boolean;
|
|
63
63
|
getBaseToMapZoom(zoomBase: number): number;
|
|
64
64
|
getMapToBaseZoom(mapZoom: number): number;
|
|
65
|
+
focusPositionsToFitViewport(positions: Position[]): void;
|
|
65
66
|
printStatus(): void;
|
|
66
67
|
}
|
|
@@ -7,7 +7,7 @@ var uuid = require('uuid');
|
|
|
7
7
|
var MapTypes = require('../types/MapTypes.js');
|
|
8
8
|
require('./util/animation.js');
|
|
9
9
|
require('./util/geo.js');
|
|
10
|
-
require('./util/polygon.js');
|
|
10
|
+
var polygon = require('./util/polygon.js');
|
|
11
11
|
var status = require('./util/status.js');
|
|
12
12
|
|
|
13
13
|
var MintMapController =
|
|
@@ -172,6 +172,58 @@ function () {
|
|
|
172
172
|
throw new Error("[getMapToBaseZoom][".concat(mapZoom, "] is not valid zoom level"));
|
|
173
173
|
};
|
|
174
174
|
|
|
175
|
+
MintMapController.prototype.focusPositionsToFitViewport = function (positions) {
|
|
176
|
+
var map = this; // positions 바운더리 구하기
|
|
177
|
+
|
|
178
|
+
var markerBounds = polygon.PolygonCalculator.getRegionInfo(positions);
|
|
179
|
+
|
|
180
|
+
if (!markerBounds.centerLat || !markerBounds.centerLng || !markerBounds.minLat || !markerBounds.maxLat || !markerBounds.minLng || !markerBounds.maxLng) {
|
|
181
|
+
return;
|
|
182
|
+
} // 이동해야할 센터 좌표
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
var toCenter = new MapTypes.Position(markerBounds.centerLat, markerBounds.centerLng); // 센터로 이동
|
|
186
|
+
|
|
187
|
+
map.setCenter(toCenter); // positions 바운더리의 폴리곤 값
|
|
188
|
+
|
|
189
|
+
var markerBoundsToPolygon = [new MapTypes.Position(markerBounds.minLat, markerBounds.minLng), new MapTypes.Position(markerBounds.minLat, markerBounds.maxLng), new MapTypes.Position(markerBounds.maxLat, markerBounds.maxLng), new MapTypes.Position(markerBounds.maxLat, markerBounds.minLng)]; // 적정 줌레벨 구하기
|
|
190
|
+
|
|
191
|
+
var zoomLevelResult = map.getZoomLevel();
|
|
192
|
+
var currZoomLevel = zoomLevelResult;
|
|
193
|
+
var iterCnt = 0;
|
|
194
|
+
var direction = undefined;
|
|
195
|
+
|
|
196
|
+
while (iterCnt < 23) {
|
|
197
|
+
//최대 줌레벨 갯수 만큼만 반복...
|
|
198
|
+
iterCnt += 1; // 줌 레벨 변경
|
|
199
|
+
|
|
200
|
+
map.setZoomLevel(currZoomLevel); // 현재 바운더리 구하기
|
|
201
|
+
|
|
202
|
+
var mapBounds = map.getCurrBounds(); // 현재 맵에 바운더리 포함된다면 줌레벨 더해서 반복 체크
|
|
203
|
+
|
|
204
|
+
if (mapBounds.includes(markerBoundsToPolygon)) {
|
|
205
|
+
if (direction === '-') {
|
|
206
|
+
// 직전에 이미 빼고있는 상태였다면 여기서 종료
|
|
207
|
+
break;
|
|
208
|
+
}
|
|
209
|
+
|
|
210
|
+
direction = '+';
|
|
211
|
+
currZoomLevel += 1;
|
|
212
|
+
} else {
|
|
213
|
+
// 포함되지 않으면
|
|
214
|
+
if (direction === '+') {
|
|
215
|
+
// 직전에 이미 더한 상태였다면 직전 줌레벨로 종료
|
|
216
|
+
currZoomLevel -= 1;
|
|
217
|
+
map.setZoomLevel(currZoomLevel);
|
|
218
|
+
break;
|
|
219
|
+
} else {
|
|
220
|
+
direction = '-';
|
|
221
|
+
currZoomLevel -= 1;
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
};
|
|
226
|
+
|
|
175
227
|
MintMapController.prototype.printStatus = function () {
|
|
176
228
|
status.Status.print();
|
|
177
229
|
};
|
|
@@ -6,6 +6,7 @@ export interface MapControlWrapperProps {
|
|
|
6
6
|
height?: string | number;
|
|
7
7
|
positionHorizontal?: AlignHorizontal;
|
|
8
8
|
positionVertical?: AlignVertical;
|
|
9
|
+
disablePointerEvent?: boolean;
|
|
9
10
|
}
|
|
10
11
|
/**
|
|
11
12
|
* Mint Map 컴포넌트
|
|
@@ -14,5 +15,5 @@ export interface MapControlWrapperProps {
|
|
|
14
15
|
*
|
|
15
16
|
* @returns {JSX.Element} JSX
|
|
16
17
|
*/
|
|
17
|
-
export declare function MapControlWrapper({ width, height, positionHorizontal, positionVertical, children }: PropsWithChildren<MapControlWrapperProps>): JSX.Element;
|
|
18
|
+
export declare function MapControlWrapper({ width, height, positionHorizontal, positionVertical, disablePointerEvent, children }: PropsWithChildren<MapControlWrapperProps>): JSX.Element;
|
|
18
19
|
export {};
|
|
@@ -29,6 +29,7 @@ function MapControlWrapper(_a) {
|
|
|
29
29
|
positionHorizontal = _d === void 0 ? 'left' : _d,
|
|
30
30
|
_e = _a.positionVertical,
|
|
31
31
|
positionVertical = _e === void 0 ? 'top' : _e,
|
|
32
|
+
disablePointerEvent = _a.disablePointerEvent,
|
|
32
33
|
children = _a.children;
|
|
33
34
|
return React__default["default"].createElement("div", {
|
|
34
35
|
className: cn('mint-map-control-wrapper-container'),
|
|
@@ -40,7 +41,8 @@ function MapControlWrapper(_a) {
|
|
|
40
41
|
className: cn('mint-map-control-wrapper'),
|
|
41
42
|
style: {
|
|
42
43
|
width: width,
|
|
43
|
-
height: height
|
|
44
|
+
height: height,
|
|
45
|
+
pointerEvents: disablePointerEvent === true ? 'none' : 'auto'
|
|
44
46
|
}
|
|
45
47
|
}, children));
|
|
46
48
|
}
|
|
@@ -6,8 +6,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
6
6
|
|
|
7
7
|
var styleInject__default = /*#__PURE__*/_interopDefaultLegacy(styleInject);
|
|
8
8
|
|
|
9
|
-
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-
|
|
10
|
-
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-
|
|
9
|
+
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV {\n position: absolute;\n z-index: 1;\n}";
|
|
10
|
+
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-overlay-wrapper":"MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV"};
|
|
11
11
|
styleInject__default["default"](css_248z);
|
|
12
12
|
|
|
13
13
|
module.exports = styles;
|
package/dist/index.es.js
CHANGED
|
@@ -1197,6 +1197,58 @@ function () {
|
|
|
1197
1197
|
throw new Error("[getMapToBaseZoom][".concat(mapZoom, "] is not valid zoom level"));
|
|
1198
1198
|
};
|
|
1199
1199
|
|
|
1200
|
+
MintMapController.prototype.focusPositionsToFitViewport = function (positions) {
|
|
1201
|
+
var map = this; // positions 바운더리 구하기
|
|
1202
|
+
|
|
1203
|
+
var markerBounds = PolygonCalculator.getRegionInfo(positions);
|
|
1204
|
+
|
|
1205
|
+
if (!markerBounds.centerLat || !markerBounds.centerLng || !markerBounds.minLat || !markerBounds.maxLat || !markerBounds.minLng || !markerBounds.maxLng) {
|
|
1206
|
+
return;
|
|
1207
|
+
} // 이동해야할 센터 좌표
|
|
1208
|
+
|
|
1209
|
+
|
|
1210
|
+
var toCenter = new Position(markerBounds.centerLat, markerBounds.centerLng); // 센터로 이동
|
|
1211
|
+
|
|
1212
|
+
map.setCenter(toCenter); // positions 바운더리의 폴리곤 값
|
|
1213
|
+
|
|
1214
|
+
var markerBoundsToPolygon = [new Position(markerBounds.minLat, markerBounds.minLng), new Position(markerBounds.minLat, markerBounds.maxLng), new Position(markerBounds.maxLat, markerBounds.maxLng), new Position(markerBounds.maxLat, markerBounds.minLng)]; // 적정 줌레벨 구하기
|
|
1215
|
+
|
|
1216
|
+
var zoomLevelResult = map.getZoomLevel();
|
|
1217
|
+
var currZoomLevel = zoomLevelResult;
|
|
1218
|
+
var iterCnt = 0;
|
|
1219
|
+
var direction = undefined;
|
|
1220
|
+
|
|
1221
|
+
while (iterCnt < 23) {
|
|
1222
|
+
//최대 줌레벨 갯수 만큼만 반복...
|
|
1223
|
+
iterCnt += 1; // 줌 레벨 변경
|
|
1224
|
+
|
|
1225
|
+
map.setZoomLevel(currZoomLevel); // 현재 바운더리 구하기
|
|
1226
|
+
|
|
1227
|
+
var mapBounds = map.getCurrBounds(); // 현재 맵에 바운더리 포함된다면 줌레벨 더해서 반복 체크
|
|
1228
|
+
|
|
1229
|
+
if (mapBounds.includes(markerBoundsToPolygon)) {
|
|
1230
|
+
if (direction === '-') {
|
|
1231
|
+
// 직전에 이미 빼고있는 상태였다면 여기서 종료
|
|
1232
|
+
break;
|
|
1233
|
+
}
|
|
1234
|
+
|
|
1235
|
+
direction = '+';
|
|
1236
|
+
currZoomLevel += 1;
|
|
1237
|
+
} else {
|
|
1238
|
+
// 포함되지 않으면
|
|
1239
|
+
if (direction === '+') {
|
|
1240
|
+
// 직전에 이미 더한 상태였다면 직전 줌레벨로 종료
|
|
1241
|
+
currZoomLevel -= 1;
|
|
1242
|
+
map.setZoomLevel(currZoomLevel);
|
|
1243
|
+
break;
|
|
1244
|
+
} else {
|
|
1245
|
+
direction = '-';
|
|
1246
|
+
currZoomLevel -= 1;
|
|
1247
|
+
}
|
|
1248
|
+
}
|
|
1249
|
+
}
|
|
1250
|
+
};
|
|
1251
|
+
|
|
1200
1252
|
MintMapController.prototype.printStatus = function () {
|
|
1201
1253
|
Status.print();
|
|
1202
1254
|
};
|
|
@@ -5164,8 +5216,8 @@ function LoadingImage(_a) {
|
|
|
5164
5216
|
}))));
|
|
5165
5217
|
}
|
|
5166
5218
|
|
|
5167
|
-
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-
|
|
5168
|
-
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-
|
|
5219
|
+
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV {\n position: absolute;\n z-index: 1;\n}";
|
|
5220
|
+
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-overlay-wrapper":"MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV"};
|
|
5169
5221
|
styleInject(css_248z);
|
|
5170
5222
|
|
|
5171
5223
|
var cn = classNames.bind(styles);
|
|
@@ -5186,6 +5238,7 @@ function MapControlWrapper(_a) {
|
|
|
5186
5238
|
positionHorizontal = _d === void 0 ? 'left' : _d,
|
|
5187
5239
|
_e = _a.positionVertical,
|
|
5188
5240
|
positionVertical = _e === void 0 ? 'top' : _e,
|
|
5241
|
+
disablePointerEvent = _a.disablePointerEvent,
|
|
5189
5242
|
children = _a.children;
|
|
5190
5243
|
return React.createElement("div", {
|
|
5191
5244
|
className: cn('mint-map-control-wrapper-container'),
|
|
@@ -5197,7 +5250,8 @@ function MapControlWrapper(_a) {
|
|
|
5197
5250
|
className: cn('mint-map-control-wrapper'),
|
|
5198
5251
|
style: {
|
|
5199
5252
|
width: width,
|
|
5200
|
-
height: height
|
|
5253
|
+
height: height,
|
|
5254
|
+
pointerEvents: disablePointerEvent === true ? 'none' : 'auto'
|
|
5201
5255
|
}
|
|
5202
5256
|
}, children));
|
|
5203
5257
|
}
|
package/dist/index.umd.js
CHANGED
|
@@ -1201,6 +1201,58 @@
|
|
|
1201
1201
|
throw new Error("[getMapToBaseZoom][".concat(mapZoom, "] is not valid zoom level"));
|
|
1202
1202
|
};
|
|
1203
1203
|
|
|
1204
|
+
MintMapController.prototype.focusPositionsToFitViewport = function (positions) {
|
|
1205
|
+
var map = this; // positions 바운더리 구하기
|
|
1206
|
+
|
|
1207
|
+
var markerBounds = PolygonCalculator.getRegionInfo(positions);
|
|
1208
|
+
|
|
1209
|
+
if (!markerBounds.centerLat || !markerBounds.centerLng || !markerBounds.minLat || !markerBounds.maxLat || !markerBounds.minLng || !markerBounds.maxLng) {
|
|
1210
|
+
return;
|
|
1211
|
+
} // 이동해야할 센터 좌표
|
|
1212
|
+
|
|
1213
|
+
|
|
1214
|
+
var toCenter = new Position(markerBounds.centerLat, markerBounds.centerLng); // 센터로 이동
|
|
1215
|
+
|
|
1216
|
+
map.setCenter(toCenter); // positions 바운더리의 폴리곤 값
|
|
1217
|
+
|
|
1218
|
+
var markerBoundsToPolygon = [new Position(markerBounds.minLat, markerBounds.minLng), new Position(markerBounds.minLat, markerBounds.maxLng), new Position(markerBounds.maxLat, markerBounds.maxLng), new Position(markerBounds.maxLat, markerBounds.minLng)]; // 적정 줌레벨 구하기
|
|
1219
|
+
|
|
1220
|
+
var zoomLevelResult = map.getZoomLevel();
|
|
1221
|
+
var currZoomLevel = zoomLevelResult;
|
|
1222
|
+
var iterCnt = 0;
|
|
1223
|
+
var direction = undefined;
|
|
1224
|
+
|
|
1225
|
+
while (iterCnt < 23) {
|
|
1226
|
+
//최대 줌레벨 갯수 만큼만 반복...
|
|
1227
|
+
iterCnt += 1; // 줌 레벨 변경
|
|
1228
|
+
|
|
1229
|
+
map.setZoomLevel(currZoomLevel); // 현재 바운더리 구하기
|
|
1230
|
+
|
|
1231
|
+
var mapBounds = map.getCurrBounds(); // 현재 맵에 바운더리 포함된다면 줌레벨 더해서 반복 체크
|
|
1232
|
+
|
|
1233
|
+
if (mapBounds.includes(markerBoundsToPolygon)) {
|
|
1234
|
+
if (direction === '-') {
|
|
1235
|
+
// 직전에 이미 빼고있는 상태였다면 여기서 종료
|
|
1236
|
+
break;
|
|
1237
|
+
}
|
|
1238
|
+
|
|
1239
|
+
direction = '+';
|
|
1240
|
+
currZoomLevel += 1;
|
|
1241
|
+
} else {
|
|
1242
|
+
// 포함되지 않으면
|
|
1243
|
+
if (direction === '+') {
|
|
1244
|
+
// 직전에 이미 더한 상태였다면 직전 줌레벨로 종료
|
|
1245
|
+
currZoomLevel -= 1;
|
|
1246
|
+
map.setZoomLevel(currZoomLevel);
|
|
1247
|
+
break;
|
|
1248
|
+
} else {
|
|
1249
|
+
direction = '-';
|
|
1250
|
+
currZoomLevel -= 1;
|
|
1251
|
+
}
|
|
1252
|
+
}
|
|
1253
|
+
}
|
|
1254
|
+
};
|
|
1255
|
+
|
|
1204
1256
|
MintMapController.prototype.printStatus = function () {
|
|
1205
1257
|
Status.print();
|
|
1206
1258
|
};
|
|
@@ -5168,8 +5220,8 @@
|
|
|
5168
5220
|
}))));
|
|
5169
5221
|
}
|
|
5170
5222
|
|
|
5171
|
-
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-
|
|
5172
|
-
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-
|
|
5223
|
+
var css_248z = ".MintMapWrapper-module_mint-map-control-wrapper-container__DONh7 {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n pointer-events: none;\n z-index: 101;\n}\n\n.MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV {\n position: absolute;\n z-index: 1;\n}";
|
|
5224
|
+
var styles = {"mint-map-control-wrapper-container":"MintMapWrapper-module_mint-map-control-wrapper-container__DONh7","mint-map-overlay-wrapper":"MintMapWrapper-module_mint-map-overlay-wrapper__Jn4wV"};
|
|
5173
5225
|
styleInject__default["default"](css_248z);
|
|
5174
5226
|
|
|
5175
5227
|
var cn = classNames__default["default"].bind(styles);
|
|
@@ -5190,6 +5242,7 @@
|
|
|
5190
5242
|
positionHorizontal = _d === void 0 ? 'left' : _d,
|
|
5191
5243
|
_e = _a.positionVertical,
|
|
5192
5244
|
positionVertical = _e === void 0 ? 'top' : _e,
|
|
5245
|
+
disablePointerEvent = _a.disablePointerEvent,
|
|
5193
5246
|
children = _a.children;
|
|
5194
5247
|
return React__default["default"].createElement("div", {
|
|
5195
5248
|
className: cn('mint-map-control-wrapper-container'),
|
|
@@ -5201,7 +5254,8 @@
|
|
|
5201
5254
|
className: cn('mint-map-control-wrapper'),
|
|
5202
5255
|
style: {
|
|
5203
5256
|
width: width,
|
|
5204
|
-
height: height
|
|
5257
|
+
height: height,
|
|
5258
|
+
pointerEvents: disablePointerEvent === true ? 'none' : 'auto'
|
|
5205
5259
|
}
|
|
5206
5260
|
}, children));
|
|
5207
5261
|
}
|