@evergis/react 3.1.2 → 3.1.3
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/index.d.ts +1 -0
- package/dist/react.cjs.development.js +953 -111
- package/dist/react.cjs.development.js.map +1 -1
- package/dist/react.cjs.production.min.js +1 -1
- package/dist/react.cjs.production.min.js.map +1 -1
- package/dist/react.esm.js +936 -93
- package/dist/react.esm.js.map +1 -1
- package/package.json +3 -3
|
@@ -4,107 +4,203 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
6
|
|
|
7
|
-
var lodash = require('lodash');
|
|
8
|
-
var api = require('@evergis/api');
|
|
9
|
-
var turf = require('@turf/turf');
|
|
10
7
|
var React = require('react');
|
|
11
8
|
var React__default = _interopDefault(React);
|
|
12
|
-
require('styled-components');
|
|
13
|
-
|
|
9
|
+
var styled = require('styled-components');
|
|
10
|
+
var styled__default = _interopDefault(styled);
|
|
11
|
+
var MapGL = require('react-map-gl/mapbox');
|
|
12
|
+
var MapGL__default = _interopDefault(MapGL);
|
|
14
13
|
require('@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css');
|
|
15
|
-
require('find-and');
|
|
14
|
+
var findAnd = require('find-and');
|
|
15
|
+
var lodash = require('lodash');
|
|
16
16
|
var dateFns = require('date-fns');
|
|
17
17
|
var wkt = require('wkt');
|
|
18
18
|
var MapboxDraw = _interopDefault(require('@mapbox/mapbox-gl-draw'));
|
|
19
|
+
var turf = require('@turf/turf');
|
|
20
|
+
var api = require('@evergis/api');
|
|
19
21
|
var signalr = require('@microsoft/signalr');
|
|
20
22
|
require('mapbox-gl/dist/mapbox-gl.css');
|
|
21
23
|
|
|
22
|
-
|
|
23
|
-
if (
|
|
24
|
-
|
|
24
|
+
function _classCallCheck(instance, Constructor) {
|
|
25
|
+
if (!(instance instanceof Constructor)) {
|
|
26
|
+
throw new TypeError("Cannot call a class as a function");
|
|
25
27
|
}
|
|
28
|
+
}
|
|
26
29
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
+
function _defineProperties(target, props) {
|
|
31
|
+
for (var i = 0; i < props.length; i++) {
|
|
32
|
+
var descriptor = props[i];
|
|
33
|
+
descriptor.enumerable = descriptor.enumerable || false;
|
|
34
|
+
descriptor.configurable = true;
|
|
35
|
+
if ("value" in descriptor) descriptor.writable = true;
|
|
36
|
+
Object.defineProperty(target, descriptor.key, descriptor);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
function _createClass(Constructor, protoProps, staticProps) {
|
|
41
|
+
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
42
|
+
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
43
|
+
return Constructor;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
function _extends() {
|
|
47
|
+
_extends = Object.assign || function (target) {
|
|
48
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
49
|
+
var source = arguments[i];
|
|
50
|
+
|
|
51
|
+
for (var key in source) {
|
|
52
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
53
|
+
target[key] = source[key];
|
|
54
|
+
}
|
|
55
|
+
}
|
|
30
56
|
}
|
|
31
57
|
|
|
32
|
-
|
|
33
|
-
|
|
58
|
+
return target;
|
|
59
|
+
};
|
|
60
|
+
|
|
61
|
+
return _extends.apply(this, arguments);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
function _inherits(subClass, superClass) {
|
|
65
|
+
if (typeof superClass !== "function" && superClass !== null) {
|
|
66
|
+
throw new TypeError("Super expression must either be null or a function");
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
subClass.prototype = Object.create(superClass && superClass.prototype, {
|
|
70
|
+
constructor: {
|
|
71
|
+
value: subClass,
|
|
72
|
+
writable: true,
|
|
73
|
+
configurable: true
|
|
34
74
|
}
|
|
75
|
+
});
|
|
76
|
+
if (superClass) _setPrototypeOf(subClass, superClass);
|
|
77
|
+
}
|
|
35
78
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
79
|
+
function _getPrototypeOf(o) {
|
|
80
|
+
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
|
|
81
|
+
return o.__proto__ || Object.getPrototypeOf(o);
|
|
82
|
+
};
|
|
83
|
+
return _getPrototypeOf(o);
|
|
84
|
+
}
|
|
39
85
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
86
|
+
function _setPrototypeOf(o, p) {
|
|
87
|
+
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
|
88
|
+
o.__proto__ = p;
|
|
89
|
+
return o;
|
|
90
|
+
};
|
|
43
91
|
|
|
44
|
-
|
|
45
|
-
|
|
92
|
+
return _setPrototypeOf(o, p);
|
|
93
|
+
}
|
|
46
94
|
|
|
47
|
-
|
|
48
|
-
|
|
95
|
+
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
96
|
+
if (source == null) return {};
|
|
97
|
+
var target = {};
|
|
98
|
+
var sourceKeys = Object.keys(source);
|
|
99
|
+
var key, i;
|
|
100
|
+
|
|
101
|
+
for (i = 0; i < sourceKeys.length; i++) {
|
|
102
|
+
key = sourceKeys[i];
|
|
103
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
104
|
+
target[key] = source[key];
|
|
49
105
|
}
|
|
50
106
|
|
|
51
|
-
return
|
|
52
|
-
|
|
107
|
+
return target;
|
|
108
|
+
}
|
|
53
109
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
110
|
+
function _assertThisInitialized(self) {
|
|
111
|
+
if (self === void 0) {
|
|
112
|
+
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
113
|
+
}
|
|
57
114
|
|
|
58
|
-
|
|
59
|
-
|
|
115
|
+
return self;
|
|
116
|
+
}
|
|
60
117
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
118
|
+
function _possibleConstructorReturn(self, call) {
|
|
119
|
+
if (call && (typeof call === "object" || typeof call === "function")) {
|
|
120
|
+
return call;
|
|
121
|
+
}
|
|
64
122
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
}, []);
|
|
68
|
-
};
|
|
123
|
+
return _assertThisInitialized(self);
|
|
124
|
+
}
|
|
69
125
|
|
|
70
|
-
|
|
71
|
-
if (!
|
|
72
|
-
|
|
126
|
+
function _taggedTemplateLiteralLoose(strings, raw) {
|
|
127
|
+
if (!raw) {
|
|
128
|
+
raw = strings.slice(0);
|
|
73
129
|
}
|
|
74
130
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
131
|
+
strings.raw = raw;
|
|
132
|
+
return strings;
|
|
133
|
+
}
|
|
78
134
|
|
|
79
|
-
|
|
80
|
-
|
|
135
|
+
var _templateObject;
|
|
136
|
+
const ErrorBoundaryContainer = /*#__PURE__*/styled__default.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100vh;\n"])));
|
|
81
137
|
|
|
82
|
-
|
|
83
|
-
|
|
138
|
+
function _callSuper(_this, derived, args) {
|
|
139
|
+
function isNativeReflectConstruct() {
|
|
140
|
+
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
141
|
+
if (Reflect.construct.sham) return false;
|
|
142
|
+
if (typeof Proxy === "function") return true;
|
|
84
143
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
144
|
+
try {
|
|
145
|
+
return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
146
|
+
} catch (e) {
|
|
147
|
+
return false;
|
|
148
|
+
}
|
|
88
149
|
}
|
|
89
|
-
};
|
|
90
150
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
151
|
+
derived = _getPrototypeOf(derived);
|
|
152
|
+
return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));
|
|
153
|
+
}
|
|
154
|
+
let ErrorBoundary = /*#__PURE__*/function (_Component) {
|
|
155
|
+
function ErrorBoundary() {
|
|
156
|
+
var _this2;
|
|
95
157
|
|
|
96
|
-
|
|
97
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
98
|
-
target[key] = source[key];
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
}
|
|
158
|
+
_classCallCheck(this, ErrorBoundary);
|
|
102
159
|
|
|
103
|
-
|
|
104
|
-
|
|
160
|
+
_this2 = _callSuper(this, ErrorBoundary, arguments);
|
|
161
|
+
_this2.state = {
|
|
162
|
+
hasError: false
|
|
163
|
+
};
|
|
164
|
+
return _this2;
|
|
165
|
+
}
|
|
105
166
|
|
|
106
|
-
|
|
107
|
-
|
|
167
|
+
_inherits(ErrorBoundary, _Component);
|
|
168
|
+
|
|
169
|
+
return _createClass(ErrorBoundary, [{
|
|
170
|
+
key: "componentDidCatch",
|
|
171
|
+
value: function componentDidCatch(error) {
|
|
172
|
+
// eslint-disable-next-line no-console
|
|
173
|
+
console.error(error);
|
|
174
|
+
}
|
|
175
|
+
}, {
|
|
176
|
+
key: "render",
|
|
177
|
+
value: function render() {
|
|
178
|
+
const {
|
|
179
|
+
children,
|
|
180
|
+
errorContents
|
|
181
|
+
} = this.props;
|
|
182
|
+
const {
|
|
183
|
+
hasError
|
|
184
|
+
} = this.state;
|
|
185
|
+
return !hasError ? React__default.createElement(React__default.Fragment, null, children) : React__default.createElement(ErrorBoundaryContainer, null, errorContents);
|
|
186
|
+
}
|
|
187
|
+
}], [{
|
|
188
|
+
key: "getDerivedStateFromError",
|
|
189
|
+
value: function getDerivedStateFromError() {
|
|
190
|
+
return {
|
|
191
|
+
hasError: true
|
|
192
|
+
};
|
|
193
|
+
}
|
|
194
|
+
}]);
|
|
195
|
+
}(React.Component);
|
|
196
|
+
|
|
197
|
+
var _templateObject$1;
|
|
198
|
+
const MapWrapper = /*#__PURE__*/styled__default.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n z-index: ", ";\n\n .mapbox-gl-draw_trash {\n display: none;\n }\n\n .mapboxgl-ctrl-logo {\n display: none;\n }\n\n .mapboxgl-ctrl.mapboxgl-ctrl-attrib {\n display: none;\n }\n\n .mapboxgl-ctrl-geocoder.mapboxgl-ctrl {\n width: 350px;\n }\n"])), (_ref) => {
|
|
199
|
+
let {
|
|
200
|
+
$zIndex
|
|
201
|
+
} = _ref;
|
|
202
|
+
return $zIndex != null ? $zIndex : 1;
|
|
203
|
+
});
|
|
108
204
|
|
|
109
205
|
const useMapContext = () => {
|
|
110
206
|
return React.useContext(MapContext);
|
|
@@ -123,14 +219,10 @@ const useCurrentSelectedFeature = () => {
|
|
|
123
219
|
|
|
124
220
|
const MapContext = /*#__PURE__*/React.createContext({});
|
|
125
221
|
|
|
126
|
-
var BaseMapTheme;
|
|
127
|
-
|
|
128
222
|
(function (BaseMapTheme) {
|
|
129
223
|
BaseMapTheme["Light"] = "light";
|
|
130
224
|
BaseMapTheme["Dark"] = "dark";
|
|
131
|
-
})(BaseMapTheme || (BaseMapTheme = {}));
|
|
132
|
-
|
|
133
|
-
var GeometrySelectionTypes;
|
|
225
|
+
})(exports.BaseMapTheme || (exports.BaseMapTheme = {}));
|
|
134
226
|
|
|
135
227
|
(function (GeometrySelectionTypes) {
|
|
136
228
|
GeometrySelectionTypes["Point"] = "select_point";
|
|
@@ -141,32 +233,24 @@ var GeometrySelectionTypes;
|
|
|
141
233
|
GeometrySelectionTypes["Zones"] = "zones_selection";
|
|
142
234
|
GeometrySelectionTypes["Coordinates"] = "xy";
|
|
143
235
|
GeometrySelectionTypes["Route"] = "selection_route";
|
|
144
|
-
})(GeometrySelectionTypes || (GeometrySelectionTypes = {}));
|
|
145
|
-
|
|
146
|
-
var GeometrySelectionToolTypes;
|
|
236
|
+
})(exports.GeometrySelectionTypes || (exports.GeometrySelectionTypes = {}));
|
|
147
237
|
|
|
148
238
|
(function (GeometrySelectionToolTypes) {
|
|
149
239
|
GeometrySelectionToolTypes["Replace"] = "Replace";
|
|
150
240
|
GeometrySelectionToolTypes["Unite"] = "Unite";
|
|
151
241
|
GeometrySelectionToolTypes["Crop"] = "Crop";
|
|
152
242
|
GeometrySelectionToolTypes["Edit"] = "Edit";
|
|
153
|
-
})(GeometrySelectionToolTypes || (GeometrySelectionToolTypes = {}));
|
|
154
|
-
|
|
155
|
-
var GeometrySelectionZoneTypes;
|
|
243
|
+
})(exports.GeometrySelectionToolTypes || (exports.GeometrySelectionToolTypes = {}));
|
|
156
244
|
|
|
157
245
|
(function (GeometrySelectionZoneTypes) {
|
|
158
246
|
GeometrySelectionZoneTypes["Walking"] = "Walking";
|
|
159
247
|
GeometrySelectionZoneTypes["Car"] = "Car";
|
|
160
|
-
})(GeometrySelectionZoneTypes || (GeometrySelectionZoneTypes = {}));
|
|
161
|
-
|
|
162
|
-
var GeometrySelectionRouteTypes;
|
|
248
|
+
})(exports.GeometrySelectionZoneTypes || (exports.GeometrySelectionZoneTypes = {}));
|
|
163
249
|
|
|
164
250
|
(function (GeometrySelectionRouteTypes) {
|
|
165
251
|
GeometrySelectionRouteTypes["Walking"] = "Walking";
|
|
166
252
|
GeometrySelectionRouteTypes["Car"] = "Car";
|
|
167
|
-
})(GeometrySelectionRouteTypes || (GeometrySelectionRouteTypes = {}));
|
|
168
|
-
|
|
169
|
-
var GeometryEditorMode;
|
|
253
|
+
})(exports.GeometrySelectionRouteTypes || (exports.GeometrySelectionRouteTypes = {}));
|
|
170
254
|
|
|
171
255
|
(function (GeometryEditorMode) {
|
|
172
256
|
GeometryEditorMode[GeometryEditorMode["Create"] = 0] = "Create";
|
|
@@ -175,7 +259,207 @@ var GeometryEditorMode;
|
|
|
175
259
|
GeometryEditorMode[GeometryEditorMode["Expand"] = 3] = "Expand";
|
|
176
260
|
GeometryEditorMode[GeometryEditorMode["Unite"] = 4] = "Unite";
|
|
177
261
|
GeometryEditorMode[GeometryEditorMode["Subtract"] = 5] = "Subtract";
|
|
178
|
-
})(GeometryEditorMode || (GeometryEditorMode = {}));
|
|
262
|
+
})(exports.GeometryEditorMode || (exports.GeometryEditorMode = {}));
|
|
263
|
+
|
|
264
|
+
const initialGeometrySelection = {
|
|
265
|
+
active: true,
|
|
266
|
+
loading: false,
|
|
267
|
+
type: exports.GeometrySelectionTypes.Point,
|
|
268
|
+
currentTool: exports.GeometrySelectionToolTypes.Replace,
|
|
269
|
+
history: {
|
|
270
|
+
features: [],
|
|
271
|
+
zones: [],
|
|
272
|
+
step: -1
|
|
273
|
+
},
|
|
274
|
+
editHistory: {
|
|
275
|
+
features: [],
|
|
276
|
+
step: -1
|
|
277
|
+
},
|
|
278
|
+
isBuffer: false,
|
|
279
|
+
settings: {
|
|
280
|
+
zoneDuration: 60,
|
|
281
|
+
zoneType: exports.GeometrySelectionZoneTypes.Walking,
|
|
282
|
+
routeType: exports.GeometrySelectionRouteTypes.Walking,
|
|
283
|
+
bufferRadius: "",
|
|
284
|
+
bufferMultiplier: "1",
|
|
285
|
+
bufferInclude: true,
|
|
286
|
+
selectOutside: false
|
|
287
|
+
}
|
|
288
|
+
};
|
|
289
|
+
const initialGeometryEditor = {
|
|
290
|
+
active: false
|
|
291
|
+
};
|
|
292
|
+
const initialSelectFeatures = {
|
|
293
|
+
initialized: false,
|
|
294
|
+
layerName: undefined,
|
|
295
|
+
currentId: null,
|
|
296
|
+
selectionOffset: 0,
|
|
297
|
+
features: {},
|
|
298
|
+
totalCounts: {},
|
|
299
|
+
statisticsActive: false,
|
|
300
|
+
geometryMasking: false
|
|
301
|
+
};
|
|
302
|
+
const MapProvider = (_ref) => {
|
|
303
|
+
let {
|
|
304
|
+
basemapItems,
|
|
305
|
+
defaultBasemap,
|
|
306
|
+
children
|
|
307
|
+
} = _ref;
|
|
308
|
+
const map = React.useRef();
|
|
309
|
+
const draw = React.useRef();
|
|
310
|
+
const [loaded, setLoaded] = React.useState(false);
|
|
311
|
+
const [basemapName, setBasemapName] = React.useState(defaultBasemap);
|
|
312
|
+
const [globeProjection, setGlobeProjection] = React.useState(false);
|
|
313
|
+
const [geometrySelection, setGeometrySelection] = React.useState(initialGeometrySelection);
|
|
314
|
+
const [geometryEditor, setGeometryEditor] = React.useState(initialGeometryEditor);
|
|
315
|
+
const [selectFeatures, setSelectFeatures] = React.useState(initialSelectFeatures);
|
|
316
|
+
const resetGeometrySelection = React.useCallback(() => {
|
|
317
|
+
setGeometrySelection(initialGeometrySelection);
|
|
318
|
+
}, []);
|
|
319
|
+
const resetGeometryEditor = React.useCallback(() => {
|
|
320
|
+
setGeometryEditor(initialGeometryEditor);
|
|
321
|
+
}, []);
|
|
322
|
+
const setNextFeature = React.useCallback(() => {
|
|
323
|
+
setSelectFeatures(state => {
|
|
324
|
+
var _features$layerName, _features$layerName2, _features$layerName3;
|
|
325
|
+
|
|
326
|
+
const {
|
|
327
|
+
layerName,
|
|
328
|
+
features,
|
|
329
|
+
currentId
|
|
330
|
+
} = state;
|
|
331
|
+
const currentIndex = features == null || (_features$layerName = features[layerName]) == null ? void 0 : _features$layerName.findIndex(item => item.id === currentId);
|
|
332
|
+
|
|
333
|
+
if (currentIndex === (features == null || (_features$layerName2 = features[layerName]) == null ? void 0 : _features$layerName2.length) - 1) {
|
|
334
|
+
return state;
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
const nextId = features == null || (_features$layerName3 = features[layerName]) == null || (_features$layerName3 = _features$layerName3[currentIndex + 1]) == null ? void 0 : _features$layerName3.id;
|
|
338
|
+
return _extends({}, state, {
|
|
339
|
+
currentId: nextId
|
|
340
|
+
});
|
|
341
|
+
});
|
|
342
|
+
}, []);
|
|
343
|
+
const setPrevFeature = React.useCallback(() => {
|
|
344
|
+
setSelectFeatures(state => {
|
|
345
|
+
var _features$layerName4, _features$layerName5;
|
|
346
|
+
|
|
347
|
+
const {
|
|
348
|
+
layerName,
|
|
349
|
+
features,
|
|
350
|
+
currentId
|
|
351
|
+
} = state;
|
|
352
|
+
const currentIndex = features == null || (_features$layerName4 = features[layerName]) == null ? void 0 : _features$layerName4.findIndex(item => item.id === currentId);
|
|
353
|
+
|
|
354
|
+
if (currentIndex === 0) {
|
|
355
|
+
return state;
|
|
356
|
+
}
|
|
357
|
+
|
|
358
|
+
const prevId = features == null || (_features$layerName5 = features[layerName]) == null || (_features$layerName5 = _features$layerName5[currentIndex - 1]) == null ? void 0 : _features$layerName5.id;
|
|
359
|
+
return _extends({}, state, {
|
|
360
|
+
currentId: prevId
|
|
361
|
+
});
|
|
362
|
+
});
|
|
363
|
+
}, []);
|
|
364
|
+
const setSelectedFeatures = React.useCallback((payload, currentId, offset) => {
|
|
365
|
+
setSelectFeatures(state => {
|
|
366
|
+
var _features$firstNotNul;
|
|
367
|
+
|
|
368
|
+
const features = payload != null ? payload : {};
|
|
369
|
+
const firstNotNullLayerName = Object.keys(features).find(key => features[key].length > 0);
|
|
370
|
+
const featureIdsToSelect = (_features$firstNotNul = features[firstNotNullLayerName]) == null ? void 0 : _features$firstNotNul.map((_ref2) => {
|
|
371
|
+
let {
|
|
372
|
+
id
|
|
373
|
+
} = _ref2;
|
|
374
|
+
return id;
|
|
375
|
+
});
|
|
376
|
+
return _extends({}, state, {
|
|
377
|
+
features,
|
|
378
|
+
layerName: firstNotNullLayerName,
|
|
379
|
+
currentId: currentId != null ? currentId : featureIdsToSelect == null ? void 0 : featureIdsToSelect[0],
|
|
380
|
+
selectionOffset: offset
|
|
381
|
+
});
|
|
382
|
+
});
|
|
383
|
+
}, []);
|
|
384
|
+
const setSelectedFeaturesTotalCounts = React.useCallback(payload => {
|
|
385
|
+
setSelectFeatures(state => _extends({}, state, {
|
|
386
|
+
totalCounts: payload
|
|
387
|
+
}));
|
|
388
|
+
}, []);
|
|
389
|
+
const setSelectFeaturesInitialized = React.useCallback(payload => {
|
|
390
|
+
setSelectFeatures(state => _extends({}, state, {
|
|
391
|
+
initialized: payload
|
|
392
|
+
}));
|
|
393
|
+
}, []);
|
|
394
|
+
const setSelectFeaturesLayerName = React.useCallback(payload => {
|
|
395
|
+
setSelectFeatures(state => {
|
|
396
|
+
var _state$features;
|
|
397
|
+
|
|
398
|
+
return _extends({}, state, {
|
|
399
|
+
layerName: payload,
|
|
400
|
+
currentId: (_state$features = state.features) == null || (_state$features = _state$features[payload]) == null || (_state$features = _state$features[0]) == null ? void 0 : _state$features.id,
|
|
401
|
+
selectionOffset: 0
|
|
402
|
+
});
|
|
403
|
+
});
|
|
404
|
+
}, []);
|
|
405
|
+
const setSelectFeaturesStatisticsActive = React.useCallback(payload => {
|
|
406
|
+
setSelectFeatures(state => _extends({}, state, {
|
|
407
|
+
statisticsActive: payload
|
|
408
|
+
}));
|
|
409
|
+
}, []);
|
|
410
|
+
const setSelectFeaturesGeometryMasking = React.useCallback(payload => {
|
|
411
|
+
setSelectFeatures(state => _extends({}, state, {
|
|
412
|
+
geometryMasking: payload
|
|
413
|
+
}));
|
|
414
|
+
}, []);
|
|
415
|
+
const updateCurrentFeature = React.useCallback(payload => {
|
|
416
|
+
setSelectFeatures(state => {
|
|
417
|
+
var _state$features$state, _state$features2;
|
|
418
|
+
|
|
419
|
+
return _extends({}, state, {
|
|
420
|
+
features: _extends({}, state.features, {
|
|
421
|
+
[state.layerName]: findAnd.changeProps((_state$features$state = (_state$features2 = state.features) == null ? void 0 : _state$features2[state.layerName]) != null ? _state$features$state : [], {
|
|
422
|
+
id: state.currentId
|
|
423
|
+
}, payload)
|
|
424
|
+
})
|
|
425
|
+
});
|
|
426
|
+
});
|
|
427
|
+
}, []);
|
|
428
|
+
const resetSelectedFeatures = React.useCallback(() => {
|
|
429
|
+
setSelectFeatures(initialSelectFeatures);
|
|
430
|
+
}, []);
|
|
431
|
+
return React__default.createElement(MapContext.Provider, {
|
|
432
|
+
value: {
|
|
433
|
+
map,
|
|
434
|
+
draw,
|
|
435
|
+
loaded,
|
|
436
|
+
setLoaded,
|
|
437
|
+
basemapItems,
|
|
438
|
+
basemapName,
|
|
439
|
+
setBasemapName,
|
|
440
|
+
defaultBasemap,
|
|
441
|
+
globeProjection,
|
|
442
|
+
setGlobeProjection,
|
|
443
|
+
geometrySelection,
|
|
444
|
+
setGeometrySelection,
|
|
445
|
+
resetGeometrySelection,
|
|
446
|
+
geometryEditor,
|
|
447
|
+
setGeometryEditor,
|
|
448
|
+
resetGeometryEditor,
|
|
449
|
+
selectFeatures,
|
|
450
|
+
setNextFeature,
|
|
451
|
+
setPrevFeature,
|
|
452
|
+
setSelectedFeatures,
|
|
453
|
+
setSelectedFeaturesTotalCounts,
|
|
454
|
+
setSelectFeaturesInitialized,
|
|
455
|
+
setSelectFeaturesLayerName,
|
|
456
|
+
setSelectFeaturesStatisticsActive,
|
|
457
|
+
setSelectFeaturesGeometryMasking,
|
|
458
|
+
updateCurrentFeature,
|
|
459
|
+
resetSelectedFeatures
|
|
460
|
+
}
|
|
461
|
+
}, children);
|
|
462
|
+
};
|
|
179
463
|
|
|
180
464
|
const useGeometryEditor = () => {
|
|
181
465
|
const {
|
|
@@ -196,7 +480,7 @@ const useEditingFeature = () => {
|
|
|
196
480
|
}] = useGeometryEditor();
|
|
197
481
|
const currentSelectedFeature = useCurrentSelectedFeature();
|
|
198
482
|
return React.useMemo(() => {
|
|
199
|
-
return active && (mode === GeometryEditorMode.Edit && layerName === (currentSelectedFeature == null ? void 0 : currentSelectedFeature.layer) || mode === GeometryEditorMode.Create);
|
|
483
|
+
return active && (mode === exports.GeometryEditorMode.Edit && layerName === (currentSelectedFeature == null ? void 0 : currentSelectedFeature.layer) || mode === exports.GeometryEditorMode.Create);
|
|
200
484
|
}, [active, currentSelectedFeature, layerName, mode]);
|
|
201
485
|
};
|
|
202
486
|
|
|
@@ -283,7 +567,7 @@ const useEwktGeometry = () => {
|
|
|
283
567
|
return "";
|
|
284
568
|
}
|
|
285
569
|
|
|
286
|
-
return type === GeometrySelectionTypes.Zones ? !lodash.isEmpty((_history$zones$histor = history.zones[history.step]) == null ? void 0 : _history$zones$histor[0]) ? "SRID=3857;" + geometryToWkt((_history$zones$histor2 = history.zones[history.step]) == null ? void 0 : _history$zones$histor2[0]) : "SRID=3857;" + geometryToWkt(history.features[history.step]) : "SRID=3857;" + geometryToWkt(history.features[history.step]);
|
|
570
|
+
return type === exports.GeometrySelectionTypes.Zones ? !lodash.isEmpty((_history$zones$histor = history.zones[history.step]) == null ? void 0 : _history$zones$histor[0]) ? "SRID=3857;" + geometryToWkt((_history$zones$histor2 = history.zones[history.step]) == null ? void 0 : _history$zones$histor2[0]) : "SRID=3857;" + geometryToWkt(history.features[history.step]) : "SRID=3857;" + geometryToWkt(history.features[history.step]);
|
|
287
571
|
}, [history.features, history.step, history.zones, type]);
|
|
288
572
|
};
|
|
289
573
|
|
|
@@ -584,6 +868,117 @@ const useUpdateCurrentFeature = () => {
|
|
|
584
868
|
}, [updateCurrentFeature]);
|
|
585
869
|
};
|
|
586
870
|
|
|
871
|
+
const findAttributeInExpression = expression => {
|
|
872
|
+
if (Array.isArray(expression) && expression.length === 2 && expression[0] === "get") {
|
|
873
|
+
return [expression[1]];
|
|
874
|
+
}
|
|
875
|
+
|
|
876
|
+
return expression.reduce((acc, curr) => {
|
|
877
|
+
if (!Array.isArray(curr)) {
|
|
878
|
+
return acc;
|
|
879
|
+
}
|
|
880
|
+
|
|
881
|
+
if (curr[0] === "get") {
|
|
882
|
+
return [...new Set([...acc, curr[1]])];
|
|
883
|
+
}
|
|
884
|
+
|
|
885
|
+
return [...new Set([...acc, ...findAttributeInExpression(curr)])];
|
|
886
|
+
}, []);
|
|
887
|
+
};
|
|
888
|
+
|
|
889
|
+
const getActualExtrusionHeight = paint => {
|
|
890
|
+
return Array.isArray(paint == null ? void 0 : paint["fill-extrusion-height"]) && (paint == null ? void 0 : paint["fill-extrusion-height"][0]) === "+" ? paint == null ? void 0 : paint["fill-extrusion-height"][1] : paint == null ? void 0 : paint["fill-extrusion-height"];
|
|
891
|
+
};
|
|
892
|
+
|
|
893
|
+
const parseClientStyle = style => {
|
|
894
|
+
var _style$items;
|
|
895
|
+
|
|
896
|
+
if (!style) {
|
|
897
|
+
return [];
|
|
898
|
+
}
|
|
899
|
+
|
|
900
|
+
return style == null || (_style$items = style.items) == null ? void 0 : _style$items.reduce((acc, curr) => {
|
|
901
|
+
var _Object$entries;
|
|
902
|
+
|
|
903
|
+
if (!curr.paint || lodash.isEmpty(curr.paint)) {
|
|
904
|
+
return acc;
|
|
905
|
+
}
|
|
906
|
+
|
|
907
|
+
return (_Object$entries = Object.entries(curr.paint)) == null ? void 0 : _Object$entries.reduce((paintAcc, _ref) => {
|
|
908
|
+
let [, value] = _ref;
|
|
909
|
+
|
|
910
|
+
if (!Array.isArray(value)) {
|
|
911
|
+
return paintAcc;
|
|
912
|
+
}
|
|
913
|
+
|
|
914
|
+
return [...new Set([...paintAcc, ...findAttributeInExpression(value)])];
|
|
915
|
+
}, []);
|
|
916
|
+
}, []);
|
|
917
|
+
};
|
|
918
|
+
|
|
919
|
+
const convertSpToTurfFeature = geometry => {
|
|
920
|
+
if (!geometry) {
|
|
921
|
+
return;
|
|
922
|
+
}
|
|
923
|
+
|
|
924
|
+
switch (geometry.type) {
|
|
925
|
+
case api.GeometryType.Point:
|
|
926
|
+
return turf.point(geometry.coordinates);
|
|
927
|
+
|
|
928
|
+
case api.GeometryType.Multipoint:
|
|
929
|
+
return turf.multiPoint(geometry.coordinates);
|
|
930
|
+
|
|
931
|
+
case api.GeometryType.Polyline:
|
|
932
|
+
return turf.multiLineString(geometry.coordinates);
|
|
933
|
+
|
|
934
|
+
case api.GeometryType.Polygon:
|
|
935
|
+
case api.GeometryType.Envelope:
|
|
936
|
+
return turf.polygon(geometry.coordinates);
|
|
937
|
+
}
|
|
938
|
+
};
|
|
939
|
+
|
|
940
|
+
const drawModeToGeometrySelectionType = mode => {
|
|
941
|
+
switch (mode) {
|
|
942
|
+
case "draw_point":
|
|
943
|
+
return exports.GeometrySelectionTypes.Point;
|
|
944
|
+
|
|
945
|
+
case "draw_polygon":
|
|
946
|
+
return exports.GeometrySelectionTypes.Polygon;
|
|
947
|
+
|
|
948
|
+
case "draw_line_string":
|
|
949
|
+
return exports.GeometrySelectionTypes.Line;
|
|
950
|
+
|
|
951
|
+
default:
|
|
952
|
+
return exports.GeometrySelectionTypes.Point;
|
|
953
|
+
}
|
|
954
|
+
};
|
|
955
|
+
|
|
956
|
+
const getGeometrySelectionTurfFeature = (coordinates, selectionType, toWgs) => {
|
|
957
|
+
if (toWgs) {
|
|
958
|
+
switch (selectionType) {
|
|
959
|
+
case exports.GeometrySelectionTypes.Point:
|
|
960
|
+
return turf.toWgs84(turf.point(coordinates));
|
|
961
|
+
|
|
962
|
+
case exports.GeometrySelectionTypes.Polygon:
|
|
963
|
+
return turf.toWgs84(turf.polygon(coordinates));
|
|
964
|
+
|
|
965
|
+
case exports.GeometrySelectionTypes.Line:
|
|
966
|
+
return turf.toWgs84(turf.lineString(coordinates));
|
|
967
|
+
}
|
|
968
|
+
}
|
|
969
|
+
|
|
970
|
+
switch (selectionType) {
|
|
971
|
+
case exports.GeometrySelectionTypes.Point:
|
|
972
|
+
return turf.toMercator(turf.point(coordinates));
|
|
973
|
+
|
|
974
|
+
case exports.GeometrySelectionTypes.Polygon:
|
|
975
|
+
return turf.toMercator(turf.polygon(coordinates));
|
|
976
|
+
|
|
977
|
+
case exports.GeometrySelectionTypes.Line:
|
|
978
|
+
return turf.toMercator(turf.lineString(coordinates));
|
|
979
|
+
}
|
|
980
|
+
};
|
|
981
|
+
|
|
587
982
|
const useZoomToFeatures = () => {
|
|
588
983
|
const {
|
|
589
984
|
map
|
|
@@ -791,49 +1186,496 @@ const useToggle = initial => {
|
|
|
791
1186
|
return [state, toggle, setState];
|
|
792
1187
|
};
|
|
793
1188
|
|
|
794
|
-
const
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
1189
|
+
const _excluded = ["zIndex", "lowerSiblings", "upperSiblings", "drawTriggerDeps", "onError", "children"];
|
|
1190
|
+
const Map = (_ref) => {
|
|
1191
|
+
let {
|
|
1192
|
+
zIndex,
|
|
1193
|
+
lowerSiblings,
|
|
1194
|
+
upperSiblings,
|
|
1195
|
+
drawTriggerDeps,
|
|
1196
|
+
onError,
|
|
1197
|
+
children
|
|
1198
|
+
} = _ref,
|
|
1199
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
798
1200
|
|
|
799
|
-
|
|
800
|
-
|
|
1201
|
+
const {
|
|
1202
|
+
map,
|
|
1203
|
+
setLoaded
|
|
1204
|
+
} = useMapContext();
|
|
1205
|
+
useMapDraw(drawTriggerDeps);
|
|
1206
|
+
return React__default.createElement(MapWrapper, {
|
|
1207
|
+
"$zIndex": zIndex
|
|
1208
|
+
}, lowerSiblings, React__default.createElement(MapGL__default, Object.assign({}, rest, {
|
|
1209
|
+
renderWorldCopies: true,
|
|
1210
|
+
antialias: true,
|
|
1211
|
+
doubleClickZoom: false,
|
|
1212
|
+
cursor: "default",
|
|
1213
|
+
onLoad: e => {
|
|
1214
|
+
map.current = e.target;
|
|
1215
|
+
map.current.on("error", onError);
|
|
1216
|
+
setLoaded(true);
|
|
1217
|
+
}
|
|
1218
|
+
}), children), upperSiblings);
|
|
1219
|
+
};
|
|
801
1220
|
|
|
802
|
-
|
|
803
|
-
|
|
1221
|
+
const BuildingsLayer = (_ref) => {
|
|
1222
|
+
let {
|
|
1223
|
+
beforeId,
|
|
1224
|
+
transparent
|
|
1225
|
+
} = _ref;
|
|
1226
|
+
return React__default.createElement(MapGL.Layer, {
|
|
1227
|
+
id: "mapbox-3d-buildings",
|
|
1228
|
+
source: "composite",
|
|
1229
|
+
"source-layer": "building",
|
|
1230
|
+
filter: ["==", "extrude", "true"],
|
|
1231
|
+
type: "fill-extrusion",
|
|
1232
|
+
minzoom: 15,
|
|
1233
|
+
beforeId: beforeId,
|
|
1234
|
+
paint: {
|
|
1235
|
+
"fill-extrusion-color": "#aaaaaa",
|
|
1236
|
+
"fill-extrusion-height": ["interpolate", ["linear"], ["zoom"], 15, 0, 15.05, ["get", "height"]],
|
|
1237
|
+
"fill-extrusion-base": ["interpolate", ["linear"], ["zoom"], 15, 0, 15.05, ["get", "min_height"]],
|
|
1238
|
+
"fill-extrusion-opacity": transparent ? 0 : 0.5
|
|
1239
|
+
}
|
|
1240
|
+
});
|
|
1241
|
+
};
|
|
1242
|
+
|
|
1243
|
+
const RasterLayer = (_ref) => {
|
|
1244
|
+
let {
|
|
1245
|
+
layer,
|
|
1246
|
+
tileUrl,
|
|
1247
|
+
visible,
|
|
1248
|
+
beforeId
|
|
1249
|
+
} = _ref;
|
|
1250
|
+
|
|
1251
|
+
if (!layer) {
|
|
1252
|
+
return null;
|
|
1253
|
+
}
|
|
1254
|
+
|
|
1255
|
+
return React__default.createElement(MapGL.Source, {
|
|
1256
|
+
id: layer.name,
|
|
1257
|
+
type: "raster",
|
|
1258
|
+
tiles: [tileUrl]
|
|
1259
|
+
}, React__default.createElement(MapGL.Layer, {
|
|
1260
|
+
id: layer.name,
|
|
1261
|
+
type: "raster",
|
|
1262
|
+
"source-layer": "default",
|
|
1263
|
+
beforeId: beforeId,
|
|
1264
|
+
layout: {
|
|
1265
|
+
visibility: visible ? "visible" : "none"
|
|
1266
|
+
}
|
|
1267
|
+
}));
|
|
1268
|
+
};
|
|
1269
|
+
|
|
1270
|
+
const DEFAULT_COLOR = "#00ffff";
|
|
1271
|
+
const DEFAULT_OPACITY = 0.5;
|
|
1272
|
+
const DEFAULT_SIZE = 4;
|
|
1273
|
+
const DEFAULT_LINE_WIDTH = 1;
|
|
1274
|
+
const DEFAULT_CIRCLE_PAINT = {
|
|
1275
|
+
"circle-radius": DEFAULT_SIZE,
|
|
1276
|
+
"circle-color": DEFAULT_COLOR,
|
|
1277
|
+
"circle-opacity": DEFAULT_OPACITY,
|
|
1278
|
+
"circle-stroke-width": 0,
|
|
1279
|
+
"circle-stroke-color": DEFAULT_COLOR,
|
|
1280
|
+
"circle-stroke-opacity": DEFAULT_OPACITY
|
|
1281
|
+
};
|
|
1282
|
+
const DEFAULT_FILL_PAINT = {
|
|
1283
|
+
"fill-color": DEFAULT_COLOR,
|
|
1284
|
+
"fill-opacity": DEFAULT_OPACITY
|
|
1285
|
+
};
|
|
1286
|
+
const DEFAULT_FILL_EXTRUSION_PAINT = {
|
|
1287
|
+
"fill-extrusion-base": 0,
|
|
1288
|
+
"fill-extrusion-vertical-gradient": true,
|
|
1289
|
+
"fill-extrusion-color": DEFAULT_COLOR,
|
|
1290
|
+
"fill-extrusion-opacity": DEFAULT_OPACITY,
|
|
1291
|
+
"fill-extrusion-height": 0
|
|
1292
|
+
};
|
|
1293
|
+
const DEFAULT_LINE_PAINT = {
|
|
1294
|
+
"line-color": DEFAULT_COLOR,
|
|
1295
|
+
"line-width": DEFAULT_LINE_WIDTH,
|
|
1296
|
+
"line-opacity": DEFAULT_OPACITY
|
|
1297
|
+
};
|
|
1298
|
+
|
|
1299
|
+
const getClientStyleItemPrefixSuffix = (geometryType, type) => {
|
|
1300
|
+
switch (geometryType) {
|
|
1301
|
+
case api.GeometryType.Point:
|
|
1302
|
+
return ["point-layer-", ""];
|
|
1303
|
+
|
|
1304
|
+
case api.GeometryType.Polyline:
|
|
1305
|
+
return ["polyline-layer-", ""];
|
|
1306
|
+
|
|
1307
|
+
case api.GeometryType.Polygon:
|
|
1308
|
+
switch (type) {
|
|
1309
|
+
case "line":
|
|
1310
|
+
return ["polygon-stroke-layer-", "-stroke"];
|
|
1311
|
+
|
|
1312
|
+
case "fill-extrusion":
|
|
1313
|
+
return ["polygon-extrusion-layer-", "-extrusion"];
|
|
1314
|
+
|
|
1315
|
+
default:
|
|
1316
|
+
return ["polygon-layer-", ""];
|
|
1317
|
+
}
|
|
804
1318
|
|
|
805
1319
|
default:
|
|
806
|
-
return
|
|
1320
|
+
return ["", ""];
|
|
807
1321
|
}
|
|
808
1322
|
};
|
|
809
1323
|
|
|
810
|
-
const
|
|
811
|
-
|
|
812
|
-
switch (selectionType) {
|
|
813
|
-
case GeometrySelectionTypes.Point:
|
|
814
|
-
return turf.toWgs84(turf.point(coordinates));
|
|
1324
|
+
const VectorLayer = (_ref) => {
|
|
1325
|
+
var _layer$configuration;
|
|
815
1326
|
|
|
816
|
-
|
|
817
|
-
|
|
1327
|
+
let {
|
|
1328
|
+
layer,
|
|
1329
|
+
tileUrl,
|
|
1330
|
+
visible,
|
|
1331
|
+
beforeId,
|
|
1332
|
+
getLayerTempStyle,
|
|
1333
|
+
onMount = () => null
|
|
1334
|
+
} = _ref;
|
|
1335
|
+
const clientStyle = layer == null || (_layer$configuration = layer.configuration) == null ? void 0 : _layer$configuration.clientStyle;
|
|
1336
|
+
const {
|
|
1337
|
+
idAttribute,
|
|
1338
|
+
geometryType
|
|
1339
|
+
} = layer.layerDefinition || {};
|
|
1340
|
+
const renderLayerByGeometryType = React.useCallback(() => {
|
|
1341
|
+
var _getLayerTempStyle, _getLayerTempStyle2, _getLayerTempStyle3, _getLayerTempStyle4, _getLayerTempStyle5, _getLayerTempStyle6, _getLayerTempStyle7, _getLayerTempStyle8, _getLayerTempStyle9, _getLayerTempStyle10, _getLayerTempStyle11, _getLayerTempStyle12, _getLayerTempStyle13, _getLayerTempStyle14;
|
|
1342
|
+
|
|
1343
|
+
const visibility = visible ? "visible" : "none";
|
|
1344
|
+
|
|
1345
|
+
switch (geometryType) {
|
|
1346
|
+
case api.GeometryType.Point:
|
|
1347
|
+
return React__default.createElement(MapGL.Layer, {
|
|
1348
|
+
id: layer.name,
|
|
1349
|
+
type: "circle",
|
|
1350
|
+
"source-layer": "default",
|
|
1351
|
+
beforeId: beforeId,
|
|
1352
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle.layout, {
|
|
1353
|
+
visibility
|
|
1354
|
+
}),
|
|
1355
|
+
paint: _extends({}, DEFAULT_CIRCLE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle2 = getLayerTempStyle(layer.name, "circle")) == null ? void 0 : _getLayerTempStyle2.paint)
|
|
1356
|
+
});
|
|
818
1357
|
|
|
819
|
-
case
|
|
820
|
-
return
|
|
1358
|
+
case api.GeometryType.Polygon:
|
|
1359
|
+
return [React__default.createElement(MapGL.Layer, {
|
|
1360
|
+
key: "polygon-layer-" + layer.name,
|
|
1361
|
+
id: layer.name,
|
|
1362
|
+
type: "fill",
|
|
1363
|
+
"source-layer": "default",
|
|
1364
|
+
beforeId: beforeId,
|
|
1365
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle3 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle3.layout, {
|
|
1366
|
+
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle4 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.settings) == null || (_getLayerTempStyle4 = _getLayerTempStyle4.fill) == null ? void 0 : _getLayerTempStyle4.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle5 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle5.paint))) ? "visible" : "none"
|
|
1367
|
+
}),
|
|
1368
|
+
paint: _extends({}, DEFAULT_FILL_PAINT, getLayerTempStyle == null || (_getLayerTempStyle6 = getLayerTempStyle(layer.name, "fill")) == null ? void 0 : _getLayerTempStyle6.paint)
|
|
1369
|
+
}), React__default.createElement(MapGL.Layer, {
|
|
1370
|
+
key: "polygon-stroke-layer-" + layer.name,
|
|
1371
|
+
id: layer.name + "-stroke",
|
|
1372
|
+
type: "line",
|
|
1373
|
+
"source-layer": "default",
|
|
1374
|
+
beforeId: beforeId,
|
|
1375
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle7 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle7.layout, {
|
|
1376
|
+
visibility: visible && (getLayerTempStyle == null || (_getLayerTempStyle8 = getLayerTempStyle(layer.name, "fill-extrusion")) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.settings) == null || (_getLayerTempStyle8 = _getLayerTempStyle8.fill) == null ? void 0 : _getLayerTempStyle8.showBottomSurface) !== false && Boolean(getActualExtrusionHeight(_extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle9 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle9.paint))) ? "visible" : "none"
|
|
1377
|
+
}),
|
|
1378
|
+
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle10 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle10.paint)
|
|
1379
|
+
}), React__default.createElement(MapGL.Layer, {
|
|
1380
|
+
key: "polygon-extrusion-layer-" + layer.name,
|
|
1381
|
+
id: layer.name + "-extrusion",
|
|
1382
|
+
type: "fill-extrusion",
|
|
1383
|
+
"source-layer": "default",
|
|
1384
|
+
beforeId: beforeId,
|
|
1385
|
+
minzoom: 0,
|
|
1386
|
+
maxzoom: 23,
|
|
1387
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle11 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle11.layout, {
|
|
1388
|
+
visibility
|
|
1389
|
+
}),
|
|
1390
|
+
paint: _extends({}, DEFAULT_FILL_EXTRUSION_PAINT, getLayerTempStyle == null || (_getLayerTempStyle12 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle12.paint)
|
|
1391
|
+
})];
|
|
1392
|
+
|
|
1393
|
+
case api.GeometryType.Polyline:
|
|
1394
|
+
return React__default.createElement(MapGL.Layer, {
|
|
1395
|
+
id: layer.name,
|
|
1396
|
+
type: "line",
|
|
1397
|
+
"source-layer": "default",
|
|
1398
|
+
beforeId: beforeId,
|
|
1399
|
+
layout: _extends({}, getLayerTempStyle == null || (_getLayerTempStyle13 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle13.layout, {
|
|
1400
|
+
visibility
|
|
1401
|
+
}),
|
|
1402
|
+
paint: _extends({}, DEFAULT_LINE_PAINT, getLayerTempStyle == null || (_getLayerTempStyle14 = getLayerTempStyle(layer.name, "line")) == null ? void 0 : _getLayerTempStyle14.paint)
|
|
1403
|
+
});
|
|
1404
|
+
|
|
1405
|
+
default:
|
|
1406
|
+
return null;
|
|
821
1407
|
}
|
|
1408
|
+
}, [geometryType, layer, beforeId, getLayerTempStyle, visible]);
|
|
1409
|
+
const renderClientStyle = React.useCallback(() => {
|
|
1410
|
+
return clientStyle.items.map(mockItem => {
|
|
1411
|
+
var _clientStyle$items, _getLayerTempStyle15, _getLayerTempStyle16, _currentSettings$fill, _currentSettings$fill2, _clientStyle$minzoom, _clientStyle$maxzoom, _getLayerTempStyle17, _getLayerTempStyle18;
|
|
1412
|
+
|
|
1413
|
+
const prefixSuffix = getClientStyleItemPrefixSuffix(geometryType, mockItem.type);
|
|
1414
|
+
const isExtrusionItem = mockItem.type === "fill-extrusion";
|
|
1415
|
+
const isPolygonPart = clientStyle.items.some(item => item.type === "fill-extrusion") && (mockItem.type === "fill" || mockItem.type === "line");
|
|
1416
|
+
const fillExtrusionPaint = isPolygonPart || isExtrusionItem ? _extends({}, (_clientStyle$items = clientStyle.items) == null || (_clientStyle$items = _clientStyle$items.find(item => item.type === "fill-extrusion")) == null ? void 0 : _clientStyle$items.paint, getLayerTempStyle == null || (_getLayerTempStyle15 = getLayerTempStyle(layer.name, "fill-extrusion")) == null ? void 0 : _getLayerTempStyle15.paint) : undefined;
|
|
1417
|
+
|
|
1418
|
+
const currentSettings = _extends({}, clientStyle == null ? void 0 : clientStyle.settings, getLayerTempStyle == null || (_getLayerTempStyle16 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle16.settings);
|
|
1419
|
+
|
|
1420
|
+
const processedExtrusionHeight = getActualExtrusionHeight(fillExtrusionPaint);
|
|
1421
|
+
const hasExtrusion = Boolean(processedExtrusionHeight);
|
|
1422
|
+
const visibility = visible && (isExtrusionItem && hasExtrusion || !isPolygonPart && !isExtrusionItem || isPolygonPart && (!hasExtrusion || ((_currentSettings$fill = currentSettings == null || (_currentSettings$fill2 = currentSettings.fill) == null ? void 0 : _currentSettings$fill2.showBottomSurface) != null ? _currentSettings$fill : true))) ? "visible" : "none";
|
|
1423
|
+
return React__default.createElement(MapGL.Layer, {
|
|
1424
|
+
key: "" + prefixSuffix[0] + layer.name,
|
|
1425
|
+
id: "" + layer.name + prefixSuffix[1],
|
|
1426
|
+
type: mockItem.type,
|
|
1427
|
+
"source-layer": "default",
|
|
1428
|
+
beforeId: beforeId,
|
|
1429
|
+
minzoom: (_clientStyle$minzoom = clientStyle == null ? void 0 : clientStyle.minzoom) != null ? _clientStyle$minzoom : 0,
|
|
1430
|
+
maxzoom: (_clientStyle$maxzoom = clientStyle == null ? void 0 : clientStyle.maxzoom) != null ? _clientStyle$maxzoom : 23,
|
|
1431
|
+
layout: _extends({}, mockItem.layout, getLayerTempStyle == null || (_getLayerTempStyle17 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle17.layout, {
|
|
1432
|
+
visibility
|
|
1433
|
+
}),
|
|
1434
|
+
paint: _extends({}, mockItem.paint, getLayerTempStyle == null || (_getLayerTempStyle18 = getLayerTempStyle(layer.name, mockItem.type)) == null ? void 0 : _getLayerTempStyle18.paint)
|
|
1435
|
+
});
|
|
1436
|
+
});
|
|
1437
|
+
}, [beforeId, clientStyle, geometryType, layer.name, visible, getLayerTempStyle]);
|
|
1438
|
+
React.useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
1439
|
+
|
|
1440
|
+
if (!layer) {
|
|
1441
|
+
return null;
|
|
822
1442
|
}
|
|
823
1443
|
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
1444
|
+
return React__default.createElement(MapGL.Source, {
|
|
1445
|
+
promoteId: idAttribute,
|
|
1446
|
+
id: layer.name,
|
|
1447
|
+
type: "vector",
|
|
1448
|
+
tiles: [tileUrl]
|
|
1449
|
+
}, clientStyle != null && clientStyle.items ? renderClientStyle() : renderLayerByGeometryType());
|
|
1450
|
+
};
|
|
827
1451
|
|
|
828
|
-
|
|
829
|
-
|
|
1452
|
+
const Layer = (_ref) => {
|
|
1453
|
+
let {
|
|
1454
|
+
layer,
|
|
1455
|
+
layerType,
|
|
1456
|
+
visible,
|
|
1457
|
+
beforeId,
|
|
1458
|
+
tileUrl,
|
|
1459
|
+
onMount = () => null
|
|
1460
|
+
} = _ref;
|
|
1461
|
+
React.useEffect(onMount, [layer.name]); // eslint-disable-line
|
|
830
1462
|
|
|
831
|
-
|
|
832
|
-
|
|
1463
|
+
if (!layer) {
|
|
1464
|
+
return null;
|
|
1465
|
+
}
|
|
1466
|
+
|
|
1467
|
+
if (layerType === "RasterTileLayer") {
|
|
1468
|
+
return React__default.createElement(RasterLayer, {
|
|
1469
|
+
layer: layer,
|
|
1470
|
+
tileUrl: tileUrl,
|
|
1471
|
+
visible: visible,
|
|
1472
|
+
beforeId: beforeId,
|
|
1473
|
+
onMount: onMount
|
|
1474
|
+
});
|
|
1475
|
+
}
|
|
1476
|
+
|
|
1477
|
+
return React__default.createElement(VectorLayer, {
|
|
1478
|
+
layer: layer,
|
|
1479
|
+
tileUrl: tileUrl,
|
|
1480
|
+
visible: visible,
|
|
1481
|
+
beforeId: beforeId,
|
|
1482
|
+
onMount: onMount
|
|
1483
|
+
});
|
|
1484
|
+
};
|
|
1485
|
+
|
|
1486
|
+
var _templateObject$2, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
|
|
1487
|
+
const ResizablePanelContainer = /*#__PURE__*/styled__default.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n flex-shrink: 0;\n position: relative;\n\n ", "\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n ", "\n"])), (_ref) => {
|
|
1488
|
+
let {
|
|
1489
|
+
horizontal,
|
|
1490
|
+
vertical
|
|
1491
|
+
} = _ref;
|
|
1492
|
+
return horizontal && !vertical ? styled.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n height: 100%;\n "]))) : !horizontal && vertical ? styled.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n width: 100%;\n "]))) : "";
|
|
1493
|
+
}, (_ref2) => {
|
|
1494
|
+
let {
|
|
1495
|
+
horizontal,
|
|
1496
|
+
vertical
|
|
1497
|
+
} = _ref2;
|
|
1498
|
+
return styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n will-change: ", ";\n "])), [horizontal && "width", vertical && "height"].filter(Boolean).join(","));
|
|
1499
|
+
}, (_ref3) => {
|
|
1500
|
+
let {
|
|
1501
|
+
maxHeight
|
|
1502
|
+
} = _ref3;
|
|
1503
|
+
return maxHeight && styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n max-height: ", "px;\n "])), maxHeight);
|
|
1504
|
+
}, (_ref4) => {
|
|
1505
|
+
let {
|
|
1506
|
+
minHeight
|
|
1507
|
+
} = _ref4;
|
|
1508
|
+
return minHeight && styled.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n min-height: ", "px;\n "])), minHeight);
|
|
1509
|
+
}, (_ref5) => {
|
|
1510
|
+
let {
|
|
1511
|
+
maxWidth
|
|
1512
|
+
} = _ref5;
|
|
1513
|
+
return maxWidth && styled.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n max-width: ", "px;\n "])), maxWidth);
|
|
1514
|
+
}, (_ref6) => {
|
|
1515
|
+
let {
|
|
1516
|
+
height
|
|
1517
|
+
} = _ref6;
|
|
1518
|
+
return height && styled.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n height: ", ";\n "])), height);
|
|
1519
|
+
}, (_ref7) => {
|
|
1520
|
+
let {
|
|
1521
|
+
width
|
|
1522
|
+
} = _ref7;
|
|
1523
|
+
return width && styled.css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), width);
|
|
1524
|
+
});
|
|
1525
|
+
const getHandlePositionProps = (position, palette) => {
|
|
1526
|
+
switch (position) {
|
|
1527
|
+
case exports.HorizontalPosition.Left:
|
|
1528
|
+
return styled.css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n height: 100%;\n border-left: 2px solid ", ";\n top: 0;\n left: 0;\n cursor: ew-resize;\n "])), palette.elementDeep);
|
|
1529
|
+
|
|
1530
|
+
case exports.HorizontalPosition.Right:
|
|
1531
|
+
return styled.css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n height: 100%;\n border-right: 2px solid ", ";\n top: 0;\n right: 0;\n cursor: ew-resize;\n "])), palette.elementDeep);
|
|
1532
|
+
|
|
1533
|
+
case exports.VerticalPosition.Top:
|
|
1534
|
+
return styled.css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 2px solid ", ";\n top: 0;\n left: 0;\n cursor: ns-resize;\n "])), palette.elementDeep);
|
|
1535
|
+
|
|
1536
|
+
case exports.VerticalPosition.Bottom:
|
|
1537
|
+
return styled.css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-bottom: 2px solid ", ";\n bottom: 0;\n left: 0;\n cursor: ns-resize;\n "])), palette.elementDeep);
|
|
1538
|
+
|
|
1539
|
+
default:
|
|
1540
|
+
return styled.css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 2px solid ", ";\n top: 0;\n left: 0;\n "])), palette.elementDeep);
|
|
833
1541
|
}
|
|
834
1542
|
};
|
|
1543
|
+
const PanelDragHandle = /*#__PURE__*/styled__default.div(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n box-sizing: border-box;\n z-index: 3;\n\n padding: 0.25rem;\n pointer-events: ", ";\n transition: border-color 150ms cubic-bezier(0.2, 1, 0.6, 1);\n\n &:hover {\n border-color: ", ";\n }\n\n ", "\n"])), (_ref8) => {
|
|
1544
|
+
let {
|
|
1545
|
+
disabled
|
|
1546
|
+
} = _ref8;
|
|
1547
|
+
return disabled && "none";
|
|
1548
|
+
}, (_ref9) => {
|
|
1549
|
+
let {
|
|
1550
|
+
theme: {
|
|
1551
|
+
palette
|
|
1552
|
+
}
|
|
1553
|
+
} = _ref9;
|
|
1554
|
+
return palette.primary;
|
|
1555
|
+
}, (_ref10) => {
|
|
1556
|
+
let {
|
|
1557
|
+
position,
|
|
1558
|
+
theme: {
|
|
1559
|
+
palette
|
|
1560
|
+
}
|
|
1561
|
+
} = _ref10;
|
|
1562
|
+
return getHandlePositionProps(position, palette);
|
|
1563
|
+
});
|
|
1564
|
+
|
|
1565
|
+
const _excluded$1 = ["className", "handleClassName", "width", "height", "disabled", "handleVerticalPosition", "handleHorizontalPosition", "Handle", "children"];
|
|
1566
|
+
const ResizablePanel = (_ref) => {
|
|
1567
|
+
let {
|
|
1568
|
+
className,
|
|
1569
|
+
handleClassName,
|
|
1570
|
+
width,
|
|
1571
|
+
height,
|
|
1572
|
+
disabled,
|
|
1573
|
+
handleVerticalPosition = exports.VerticalPosition.Top,
|
|
1574
|
+
handleHorizontalPosition = exports.HorizontalPosition.Left,
|
|
1575
|
+
children
|
|
1576
|
+
} = _ref,
|
|
1577
|
+
resizeProps = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
1578
|
+
|
|
1579
|
+
const resizerProps = React.useMemo(() => _extends({}, resizeProps, {
|
|
1580
|
+
handleVerticalPosition,
|
|
1581
|
+
handleHorizontalPosition
|
|
1582
|
+
}), [resizeProps, handleVerticalPosition, handleHorizontalPosition]);
|
|
1583
|
+
const {
|
|
1584
|
+
containerRef,
|
|
1585
|
+
verticalHandleRef,
|
|
1586
|
+
horizontalHandleRef,
|
|
1587
|
+
onPointerDown
|
|
1588
|
+
} = useResizer(resizerProps);
|
|
1589
|
+
const {
|
|
1590
|
+
vertical,
|
|
1591
|
+
horizontal
|
|
1592
|
+
} = resizeProps;
|
|
1593
|
+
return React__default.createElement(ResizablePanelContainer, {
|
|
1594
|
+
ref: containerRef,
|
|
1595
|
+
width: width,
|
|
1596
|
+
height: height,
|
|
1597
|
+
style: disabled ? {
|
|
1598
|
+
height: "auto"
|
|
1599
|
+
} : undefined,
|
|
1600
|
+
className: className
|
|
1601
|
+
}, vertical && React__default.createElement(PanelDragHandle, {
|
|
1602
|
+
ref: verticalHandleRef,
|
|
1603
|
+
position: handleVerticalPosition,
|
|
1604
|
+
disabled: disabled,
|
|
1605
|
+
className: handleClassName,
|
|
1606
|
+
onPointerDown: onPointerDown
|
|
1607
|
+
}), horizontal && React__default.createElement(PanelDragHandle, {
|
|
1608
|
+
ref: horizontalHandleRef,
|
|
1609
|
+
position: handleHorizontalPosition,
|
|
1610
|
+
disabled: disabled,
|
|
1611
|
+
className: handleClassName,
|
|
1612
|
+
onPointerDown: onPointerDown
|
|
1613
|
+
}), children);
|
|
1614
|
+
};
|
|
1615
|
+
|
|
1616
|
+
const ServerNotificationsProvider = (_ref) => {
|
|
1617
|
+
let {
|
|
1618
|
+
url,
|
|
1619
|
+
initialized,
|
|
1620
|
+
children
|
|
1621
|
+
} = _ref;
|
|
1622
|
+
const connection = useServerNotifications(url, initialized);
|
|
1623
|
+
const addSubscription = React.useCallback(async payload => {
|
|
1624
|
+
if (!connection || connection.state !== "Connected" || !payload) {
|
|
1625
|
+
return;
|
|
1626
|
+
}
|
|
1627
|
+
|
|
1628
|
+
try {
|
|
1629
|
+
const id = await connection.invoke("AddSubscription", payload);
|
|
1630
|
+
console.info("Подписка добавлена, id:", id);
|
|
1631
|
+
return id;
|
|
1632
|
+
} catch (err) {
|
|
1633
|
+
console.info("Ошибка добавления подписки:", err);
|
|
1634
|
+
return Promise.resolve(null);
|
|
1635
|
+
}
|
|
1636
|
+
}, [connection]);
|
|
1637
|
+
const updateSubscription = React.useCallback(async (id, payload) => {
|
|
1638
|
+
if (!connection || connection.state !== "Connected" || !id || !payload) {
|
|
1639
|
+
return;
|
|
1640
|
+
}
|
|
1641
|
+
|
|
1642
|
+
try {
|
|
1643
|
+
await connection.invoke("UpdateSubscription", id, payload);
|
|
1644
|
+
} catch (err) {
|
|
1645
|
+
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0431\u043D\u043E\u0432\u043B\u0435\u043D\u0438\u044F \u043F\u043E\u0434\u043F\u0438\u0441\u043A\u0438 " + id + ":", err);
|
|
1646
|
+
}
|
|
1647
|
+
}, [connection]);
|
|
1648
|
+
const unsubscribeById = React.useCallback(async id => {
|
|
1649
|
+
if (!connection || connection.state !== "Connected" || !id) {
|
|
1650
|
+
return;
|
|
1651
|
+
}
|
|
1652
|
+
|
|
1653
|
+
try {
|
|
1654
|
+
await connection.invoke("Unsubscribe", [id]);
|
|
1655
|
+
} catch (err) {
|
|
1656
|
+
console.info("\u041E\u0448\u0438\u0431\u043A\u0430 \u043E\u0442\u043F\u0438\u0441\u043A\u0438 \u043F\u043E " + id + ":", err);
|
|
1657
|
+
}
|
|
1658
|
+
}, [connection]);
|
|
1659
|
+
return React__default.createElement(ServerNotificationsContext.Provider, {
|
|
1660
|
+
value: {
|
|
1661
|
+
connection,
|
|
1662
|
+
addSubscription,
|
|
1663
|
+
updateSubscription,
|
|
1664
|
+
unsubscribeById
|
|
1665
|
+
}
|
|
1666
|
+
}, children);
|
|
1667
|
+
};
|
|
835
1668
|
|
|
1669
|
+
exports.BuildingsLayer = BuildingsLayer;
|
|
1670
|
+
exports.ErrorBoundary = ErrorBoundary;
|
|
1671
|
+
exports.Layer = Layer;
|
|
1672
|
+
exports.Map = Map;
|
|
1673
|
+
exports.MapContext = MapContext;
|
|
1674
|
+
exports.MapProvider = MapProvider;
|
|
836
1675
|
exports.NO_CONTENT_VALUE = NO_CONTENT_VALUE;
|
|
1676
|
+
exports.ResizablePanel = ResizablePanel;
|
|
1677
|
+
exports.ServerNotificationsContext = ServerNotificationsContext;
|
|
1678
|
+
exports.ServerNotificationsProvider = ServerNotificationsProvider;
|
|
837
1679
|
exports.convertSpToTurfFeature = convertSpToTurfFeature;
|
|
838
1680
|
exports.drawModeToGeometrySelectionType = drawModeToGeometrySelectionType;
|
|
839
1681
|
exports.findAttributeInExpression = findAttributeInExpression;
|