@evergis/react 3.0.22 → 3.0.23
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/LICENSE +20 -20
- package/README.md +31 -31
- package/dist/contexts/LegendContext.d.ts +1 -1
- package/dist/core/feature/getFeatureSymbol.d.ts +1 -1
- package/dist/core/style/EvergisStyle.d.ts +1 -1
- package/dist/react.cjs.development.js +170 -178
- 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 +171 -179
- package/dist/react.esm.js.map +1 -1
- package/dist/utils/legend.d.ts +3 -3
- package/package.json +5 -5
package/dist/react.esm.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useRef, useMemo, useCallback, memo, useEffect, Fragment, useState, useContext, createContext } from 'react';
|
|
2
2
|
import styled, { css } from 'styled-components';
|
|
3
3
|
import { IconButton, EverCloudClassificationIcon, EverCloudRefreshIcon } from '@evergis/icons';
|
|
4
4
|
import { SVG } from '@svgdotjs/svg.js';
|
|
@@ -19,8 +19,6 @@ import { PolylineSymbol } from '@evergis/sgis/es/symbols/PolylineSymbol';
|
|
|
19
19
|
import { PolyRender, FillStyle } from '@evergis/sgis/es/renders/Poly';
|
|
20
20
|
import { projectRings, distance } from '@evergis/sgis/es/geotools';
|
|
21
21
|
import { simplifyCoordinates } from '@evergis/sgis/es/utils/math';
|
|
22
|
-
import { Canvas } from '@evergis/sgis/es/painters/DomPainter/Canvas';
|
|
23
|
-
import { geo, plain } from '@evergis/sgis/es/Crs';
|
|
24
22
|
import { Poly } from '@evergis/sgis/es/features/Poly';
|
|
25
23
|
import { PointSymbol } from '@evergis/sgis/es/symbols/point/Point';
|
|
26
24
|
import { PointFeature } from '@evergis/sgis/es/features/PointFeature';
|
|
@@ -30,6 +28,7 @@ import { DynamicRender } from '@evergis/sgis/es/renders/Render';
|
|
|
30
28
|
import { SvgRender } from '@evergis/sgis/es/painters/DomPainter/SvgRender';
|
|
31
29
|
import { listenDomEvent } from '@evergis/sgis/es/utils/domEvent';
|
|
32
30
|
import { MouseEventFlags, mouseEvents } from '@evergis/sgis/es/EventHandler';
|
|
31
|
+
import { geo, plain } from '@evergis/sgis/es/Crs';
|
|
33
32
|
import { StaticImageSymbol } from '@evergis/sgis/es/symbols/point/StaticImageSymbol';
|
|
34
33
|
import { SquareSymbol } from '@evergis/sgis/es/symbols/point/Square';
|
|
35
34
|
import { MaskedImage } from '@evergis/sgis/es/symbols/point/MaskedImage';
|
|
@@ -39,6 +38,7 @@ import { Polygon } from '@evergis/sgis/es/features/Polygon';
|
|
|
39
38
|
import { Polyline } from '@evergis/sgis/es/features/Polyline';
|
|
40
39
|
import { H3Feature } from '@evergis/sgis/es/features/H3Feature';
|
|
41
40
|
import { CombinedPolyline } from '@evergis/sgis/es/features/CombinedPolyline';
|
|
41
|
+
import { Canvas } from '@evergis/sgis/es/painters/DomPainter/Canvas';
|
|
42
42
|
|
|
43
43
|
function _classCallCheck(instance, Constructor) {
|
|
44
44
|
if (!(instance instanceof Constructor)) {
|
|
@@ -59,9 +59,6 @@ function _defineProperties(target, props) {
|
|
|
59
59
|
function _createClass(Constructor, protoProps, staticProps) {
|
|
60
60
|
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
61
61
|
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
62
|
-
Object.defineProperty(Constructor, "prototype", {
|
|
63
|
-
writable: false
|
|
64
|
-
});
|
|
65
62
|
return Constructor;
|
|
66
63
|
}
|
|
67
64
|
|
|
@@ -95,9 +92,6 @@ function _inherits(subClass, superClass) {
|
|
|
95
92
|
configurable: true
|
|
96
93
|
}
|
|
97
94
|
});
|
|
98
|
-
Object.defineProperty(subClass, "prototype", {
|
|
99
|
-
writable: false
|
|
100
|
-
});
|
|
101
95
|
if (superClass) _setPrototypeOf(subClass, superClass);
|
|
102
96
|
}
|
|
103
97
|
|
|
@@ -156,8 +150,6 @@ function _assertThisInitialized(self) {
|
|
|
156
150
|
function _possibleConstructorReturn(self, call) {
|
|
157
151
|
if (call && (typeof call === "object" || typeof call === "function")) {
|
|
158
152
|
return call;
|
|
159
|
-
} else if (call !== void 0) {
|
|
160
|
-
throw new TypeError("Derived constructors may only return object or undefined");
|
|
161
153
|
}
|
|
162
154
|
|
|
163
155
|
return _assertThisInitialized(self);
|
|
@@ -191,7 +183,7 @@ function _superPropBase(object, property) {
|
|
|
191
183
|
return object;
|
|
192
184
|
}
|
|
193
185
|
|
|
194
|
-
function _get() {
|
|
186
|
+
function _get(target, property, receiver) {
|
|
195
187
|
if (typeof Reflect !== "undefined" && Reflect.get) {
|
|
196
188
|
_get = Reflect.get;
|
|
197
189
|
} else {
|
|
@@ -202,14 +194,14 @@ function _get() {
|
|
|
202
194
|
var desc = Object.getOwnPropertyDescriptor(base, property);
|
|
203
195
|
|
|
204
196
|
if (desc.get) {
|
|
205
|
-
return desc.get.call(
|
|
197
|
+
return desc.get.call(receiver);
|
|
206
198
|
}
|
|
207
199
|
|
|
208
200
|
return desc.value;
|
|
209
201
|
};
|
|
210
202
|
}
|
|
211
203
|
|
|
212
|
-
return _get
|
|
204
|
+
return _get(target, property, receiver || target);
|
|
213
205
|
}
|
|
214
206
|
|
|
215
207
|
function _taggedTemplateLiteralLoose(strings, raw) {
|
|
@@ -233,7 +225,7 @@ const isParameterType = (types, parameter) => {
|
|
|
233
225
|
|
|
234
226
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38;
|
|
235
227
|
const MapLegendDescription = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: 0.75rem;\n"])));
|
|
236
|
-
const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: calc(100% - 2rem);\n font: ", ";\n"])), _ref => {
|
|
228
|
+
const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: calc(100% - 2rem);\n font: ", ";\n"])), (_ref) => {
|
|
237
229
|
let {
|
|
238
230
|
theme: {
|
|
239
231
|
fonts
|
|
@@ -243,28 +235,28 @@ const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 =
|
|
|
243
235
|
});
|
|
244
236
|
const ItemSeparator = /*#__PURE__*/styled.div(_templateObject3 || (_templateObject3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n :after {\n content: '-';\n margin: 0 0.5rem;\n font-size: 0.75rem;\n }\n"])));
|
|
245
237
|
const SymbolContainer = /*#__PURE__*/styled('span')(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n min-width: 1.5rem;\n margin-right: 0.5rem;\n"])));
|
|
246
|
-
const ClassifiedItem = /*#__PURE__*/styled.div(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n cursor: ", ";\n pointer-events: ", ";\n\n :not(:last-of-type) {\n margin-bottom: 0.25rem;\n }\n\n ", ", ", " {\n transition: opacity 150ms;\n }\n\n ", " {\n opacity: ", ";\n }\n\n ", " {\n opacity: ", ";\n }\n\n :hover {\n ", ", ", " {\n opacity: 1;\n }\n }\n\n ", " {\n margin-left: 0.5rem;\n }\n"])), _ref2 => {
|
|
238
|
+
const ClassifiedItem = /*#__PURE__*/styled.div(_templateObject5 || (_templateObject5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n cursor: ", ";\n pointer-events: ", ";\n\n :not(:last-of-type) {\n margin-bottom: 0.25rem;\n }\n\n ", ", ", " {\n transition: opacity 150ms;\n }\n\n ", " {\n opacity: ", ";\n }\n\n ", " {\n opacity: ", ";\n }\n\n :hover {\n ", ", ", " {\n opacity: 1;\n }\n }\n\n ", " {\n margin-left: 0.5rem;\n }\n"])), (_ref2) => {
|
|
247
239
|
let {
|
|
248
240
|
isClusterFillColor
|
|
249
241
|
} = _ref2;
|
|
250
242
|
return isClusterFillColor ? 'default' : 'pointer';
|
|
251
|
-
}, _ref3 => {
|
|
243
|
+
}, (_ref3) => {
|
|
252
244
|
let {
|
|
253
245
|
isClusterFillColor
|
|
254
246
|
} = _ref3;
|
|
255
247
|
return isClusterFillColor ? 'none' : 'auto';
|
|
256
|
-
}, ItemText, SymbolContainer, ItemText, _ref4 => {
|
|
248
|
+
}, ItemText, SymbolContainer, ItemText, (_ref4) => {
|
|
257
249
|
let {
|
|
258
250
|
isHidden
|
|
259
251
|
} = _ref4;
|
|
260
252
|
return isHidden ? 0.28 : 0.65;
|
|
261
|
-
}, SymbolContainer, _ref5 => {
|
|
253
|
+
}, SymbolContainer, (_ref5) => {
|
|
262
254
|
let {
|
|
263
255
|
isHidden
|
|
264
256
|
} = _ref5;
|
|
265
257
|
return isHidden ? 0.28 : 1;
|
|
266
258
|
}, ItemText, SymbolContainer, IconButton);
|
|
267
|
-
const SymbolButtonWithClick = /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 3.875rem;\n height: 3.875rem;\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n"])), _ref6 => {
|
|
259
|
+
const SymbolButtonWithClick = /*#__PURE__*/css(_templateObject6 || (_templateObject6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 3.875rem;\n height: 3.875rem;\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n }\n"])), (_ref6) => {
|
|
268
260
|
let {
|
|
269
261
|
theme: {
|
|
270
262
|
palette
|
|
@@ -272,7 +264,7 @@ const SymbolButtonWithClick = /*#__PURE__*/css(_templateObject6 || (_templateObj
|
|
|
272
264
|
} = _ref6;
|
|
273
265
|
return palette.elementDeep;
|
|
274
266
|
});
|
|
275
|
-
const SymbolButton = /*#__PURE__*/styled.span(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background-color 150ms;\n ", ";\n\n svg {\n max-width: 4rem;\n max-height: 4rem;\n }\n"])), _ref7 => {
|
|
267
|
+
const SymbolButton = /*#__PURE__*/styled.span(_templateObject7 || (_templateObject7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background-color 150ms;\n ", ";\n\n svg {\n max-width: 4rem;\n max-height: 4rem;\n }\n"])), (_ref7) => {
|
|
276
268
|
let {
|
|
277
269
|
onClick
|
|
278
270
|
} = _ref7;
|
|
@@ -281,21 +273,21 @@ const SymbolButton = /*#__PURE__*/styled.span(_templateObject7 || (_templateObje
|
|
|
281
273
|
const MapLegendContainer = /*#__PURE__*/styled.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n width: 100%;\n padding-bottom: 1rem;\n box-sizing: border-box;\n\n canvas {\n height: 1.625rem;\n width: 1.625rem;\n }\n"])));
|
|
282
274
|
const MapLegendHeader = /*#__PURE__*/styled.div(_templateObject9 || (_templateObject9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: 15rem;\n margin-bottom: 0.25rem;\n font-size: 0.75rem;\n font-weight: bold;\n"])));
|
|
283
275
|
const MapLegendDescriptionContainer = /*#__PURE__*/styled.div(_templateObject10 || (_templateObject10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 0.5rem;\n font-weight: 400;\n font-size: 0.625rem;\n color: rgba(48, 69, 79, 0.65);\n"])));
|
|
284
|
-
const MapLegendBadge = /*#__PURE__*/styled.span(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n min-width: 0.5rem;\n height: 0.75rem;\n display: inline-block;\n margin-left: 0.25rem;\n padding: 0.125rem 0.25rem;\n border-radius: ", ";\n background-color: ", ";\n color: ", ";\n text-align: center;\n"])), _ref8 => {
|
|
276
|
+
const MapLegendBadge = /*#__PURE__*/styled.span(_templateObject11 || (_templateObject11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n min-width: 0.5rem;\n height: 0.75rem;\n display: inline-block;\n margin-left: 0.25rem;\n padding: 0.125rem 0.25rem;\n border-radius: ", ";\n background-color: ", ";\n color: ", ";\n text-align: center;\n"])), (_ref8) => {
|
|
285
277
|
let {
|
|
286
278
|
theme: {
|
|
287
279
|
borderRadius
|
|
288
280
|
}
|
|
289
281
|
} = _ref8;
|
|
290
282
|
return borderRadius.xSmall;
|
|
291
|
-
}, _ref9 => {
|
|
283
|
+
}, (_ref9) => {
|
|
292
284
|
let {
|
|
293
285
|
theme: {
|
|
294
286
|
palette
|
|
295
287
|
}
|
|
296
288
|
} = _ref9;
|
|
297
289
|
return palette.element;
|
|
298
|
-
}, _ref10 => {
|
|
290
|
+
}, (_ref10) => {
|
|
299
291
|
let {
|
|
300
292
|
theme: {
|
|
301
293
|
palette
|
|
@@ -303,17 +295,17 @@ const MapLegendBadge = /*#__PURE__*/styled.span(_templateObject11 || (_templateO
|
|
|
303
295
|
} = _ref10;
|
|
304
296
|
return palette.textPrimary;
|
|
305
297
|
});
|
|
306
|
-
const MaximizedLegendContainer = /*#__PURE__*/styled.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: 0;\n opacity: ", ";\n visibility: ", ";\n overflow: hidden;\n transition: opacity 0.5s, visibility 0.5s;\n"])), _ref11 => {
|
|
298
|
+
const MaximizedLegendContainer = /*#__PURE__*/styled.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: ", ";\n top: 0;\n opacity: ", ";\n visibility: ", ";\n overflow: hidden;\n transition: opacity 0.5s, visibility 0.5s;\n"])), (_ref11) => {
|
|
307
299
|
let {
|
|
308
300
|
isShown
|
|
309
301
|
} = _ref11;
|
|
310
302
|
return isShown ? 'relative' : 'absolute';
|
|
311
|
-
}, _ref12 => {
|
|
303
|
+
}, (_ref12) => {
|
|
312
304
|
let {
|
|
313
305
|
isShown
|
|
314
306
|
} = _ref12;
|
|
315
307
|
return isShown ? 1 : 0;
|
|
316
|
-
}, _ref13 => {
|
|
308
|
+
}, (_ref13) => {
|
|
317
309
|
let {
|
|
318
310
|
isShown
|
|
319
311
|
} = _ref13;
|
|
@@ -321,7 +313,7 @@ const MaximizedLegendContainer = /*#__PURE__*/styled.div(_templateObject12 || (_
|
|
|
321
313
|
});
|
|
322
314
|
const MinimizedLegendContainer = /*#__PURE__*/styled(MaximizedLegendContainer)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: calc(100% - 1.5rem);\n padding-right: 1.5rem;\n"])));
|
|
323
315
|
const LegendHeaderButton = /*#__PURE__*/styled.span(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
324
|
-
const MapLegendSectionContainer = /*#__PURE__*/styled.div(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n\n :not(:last-child) {\n margin-bottom: 1rem;\n }\n\n ", " {\n padding-left: 0.75rem;\n visibility: hidden;\n\n :first-child {\n padding-left: 1rem;\n }\n\n :last-child {\n margin-left: 0.75rem;\n border-left: 1px ", " solid;\n }\n }\n \n :hover {\n ", " {\n visibility: visible;\n }\n }\n"])), LegendHeaderButton, _ref14 => {
|
|
316
|
+
const MapLegendSectionContainer = /*#__PURE__*/styled.div(_templateObject15 || (_templateObject15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n\n :not(:last-child) {\n margin-bottom: 1rem;\n }\n\n ", " {\n padding-left: 0.75rem;\n visibility: hidden;\n\n :first-child {\n padding-left: 1rem;\n }\n\n :last-child {\n margin-left: 0.75rem;\n border-left: 1px ", " solid;\n }\n }\n \n :hover {\n ", " {\n visibility: visible;\n }\n }\n"])), LegendHeaderButton, (_ref14) => {
|
|
325
317
|
let {
|
|
326
318
|
theme: {
|
|
327
319
|
palette
|
|
@@ -329,14 +321,14 @@ const MapLegendSectionContainer = /*#__PURE__*/styled.div(_templateObject15 || (
|
|
|
329
321
|
} = _ref14;
|
|
330
322
|
return palette.elementDeep;
|
|
331
323
|
}, LegendHeaderButton);
|
|
332
|
-
const MapLegendSectionItems = /*#__PURE__*/styled.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: ", "px;\n overflow: ", ";\n transition: height 0.5s;\n"])), _ref15 => {
|
|
324
|
+
const MapLegendSectionItems = /*#__PURE__*/styled.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: ", "px;\n overflow: ", ";\n transition: height 0.5s;\n"])), (_ref15) => {
|
|
333
325
|
let {
|
|
334
326
|
minHeight,
|
|
335
327
|
maxHeight,
|
|
336
328
|
isExpanded
|
|
337
329
|
} = _ref15;
|
|
338
330
|
return isExpanded ? (maxHeight || 0) + 4 : minHeight;
|
|
339
|
-
}, _ref16 => {
|
|
331
|
+
}, (_ref16) => {
|
|
340
332
|
let {
|
|
341
333
|
isExpanded
|
|
342
334
|
} = _ref16;
|
|
@@ -361,28 +353,28 @@ const StrokeWidthLegendItemMixin = function StrokeWidthLegendItemMixin(value) {
|
|
|
361
353
|
};
|
|
362
354
|
|
|
363
355
|
const StrokeColorLegendItemMixin = /*#__PURE__*/css(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 0.5rem;\n width: 1.5rem;\n"])));
|
|
364
|
-
const MapLegendItem = /*#__PURE__*/styled.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: ", "rem;\n background: ", ";\n border: 1px rgba(48, 69, 79, 0.1) solid;\n margin-right: -1px;\n color: rgba(48, 69, 79, 0.65);\n opacity: ", ";\n\n ", "\n\n ", "\n"])), _ref17 => {
|
|
356
|
+
const MapLegendItem = /*#__PURE__*/styled.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: ", "rem;\n background: ", ";\n border: 1px rgba(48, 69, 79, 0.1) solid;\n margin-right: -1px;\n color: rgba(48, 69, 79, 0.65);\n opacity: ", ";\n\n ", "\n\n ", "\n"])), (_ref17) => {
|
|
365
357
|
let {
|
|
366
358
|
parameter
|
|
367
359
|
} = _ref17;
|
|
368
360
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) ? 0.25 : 1;
|
|
369
|
-
}, _ref18 => {
|
|
361
|
+
}, (_ref18) => {
|
|
370
362
|
let {
|
|
371
363
|
value
|
|
372
364
|
} = _ref18;
|
|
373
365
|
return typeof value === 'number' ? 'none' : value;
|
|
374
|
-
}, _ref19 => {
|
|
366
|
+
}, (_ref19) => {
|
|
375
367
|
let {
|
|
376
368
|
isHidden
|
|
377
369
|
} = _ref19;
|
|
378
370
|
return isHidden ? 0.28 : 1;
|
|
379
|
-
}, _ref20 => {
|
|
371
|
+
}, (_ref20) => {
|
|
380
372
|
let {
|
|
381
373
|
value,
|
|
382
374
|
parameter
|
|
383
375
|
} = _ref20;
|
|
384
376
|
return isParameterType('size', parameter) && SizeLegendItemMixin(value);
|
|
385
|
-
}, _ref21 => {
|
|
377
|
+
}, (_ref21) => {
|
|
386
378
|
let {
|
|
387
379
|
value,
|
|
388
380
|
parameter
|
|
@@ -398,28 +390,28 @@ const SizeMinimizedLegendLabel = /*#__PURE__*/styled.div(_templateObject27 || (_
|
|
|
398
390
|
const SizeMinimizedLegendDown = /*#__PURE__*/styled.div(_templateObject28 || (_templateObject28 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: rgba(48, 69, 79, 0.65);\n"])));
|
|
399
391
|
const SizeMinimizedLegendUp = /*#__PURE__*/styled(SizeMinimizedLegendDown)(_templateObject29 || (_templateObject29 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
400
392
|
const SingleSizeLegendItemsMixin = /*#__PURE__*/css(_templateObject30 || (_templateObject30 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 4rem;\n margin-right: 0.75rem;\n\n ", ":after {\n margin: 0 auto;\n }\n"])), MapLegendItem);
|
|
401
|
-
const SingleLegendItemsMixin = /*#__PURE__*/css(_templateObject31 || (_templateObject31 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n width: 2rem;\n height: auto;\n margin: 0;\n ", "\n\n ", " {\n position: relative;\n top: 0;\n left: 0;\n display: flex;\n align-content: center;\n justify-content: center;\n margin: 0;\n height: auto;\n width: auto;\n\n ", "\n }\n"])), _ref22 => {
|
|
393
|
+
const SingleLegendItemsMixin = /*#__PURE__*/css(_templateObject31 || (_templateObject31 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n justify-content: center;\n width: 2rem;\n height: auto;\n margin: 0;\n ", "\n\n ", " {\n position: relative;\n top: 0;\n left: 0;\n display: flex;\n align-content: center;\n justify-content: center;\n margin: 0;\n height: auto;\n width: auto;\n\n ", "\n }\n"])), (_ref22) => {
|
|
402
394
|
let {
|
|
403
395
|
isSize
|
|
404
396
|
} = _ref22;
|
|
405
397
|
return isSize && SingleSizeLegendItemsMixin;
|
|
406
|
-
}, MapLegendItem, _ref23 => {
|
|
398
|
+
}, MapLegendItem, (_ref23) => {
|
|
407
399
|
let {
|
|
408
400
|
parameter
|
|
409
401
|
} = _ref23;
|
|
410
402
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) && StrokeColorLegendItemMixin;
|
|
411
403
|
});
|
|
412
|
-
const MapLegendItems = /*#__PURE__*/styled.div(_templateObject32 || (_templateObject32 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: 100%;\n border-radius: 0.125rem;\n\n ", ";\n ", ";\n ", ";\n"])), _ref24 => {
|
|
404
|
+
const MapLegendItems = /*#__PURE__*/styled.div(_templateObject32 || (_templateObject32 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n width: 100%;\n border-radius: 0.125rem;\n\n ", ";\n ", ";\n ", ";\n"])), (_ref24) => {
|
|
413
405
|
let {
|
|
414
406
|
isSize
|
|
415
407
|
} = _ref24;
|
|
416
408
|
return isSize && SizeLegendItemsMixin;
|
|
417
|
-
}, _ref25 => {
|
|
409
|
+
}, (_ref25) => {
|
|
418
410
|
let {
|
|
419
411
|
isStrokeWidth
|
|
420
412
|
} = _ref25;
|
|
421
413
|
return isStrokeWidth && StrokeWidthLegendItemsMixin;
|
|
422
|
-
}, _ref26 => {
|
|
414
|
+
}, (_ref26) => {
|
|
423
415
|
let {
|
|
424
416
|
isSingle
|
|
425
417
|
} = _ref26;
|
|
@@ -594,7 +586,7 @@ const formatStringAttribute = value => {
|
|
|
594
586
|
|
|
595
587
|
const attributeValues = value.split(/[\s|]/).map(convertStringAttribute);
|
|
596
588
|
|
|
597
|
-
if (attributeValues.every(_ref => {
|
|
589
|
+
if (attributeValues.every((_ref) => {
|
|
598
590
|
let {
|
|
599
591
|
type
|
|
600
592
|
} = _ref;
|
|
@@ -602,7 +594,7 @@ const formatStringAttribute = value => {
|
|
|
602
594
|
}
|
|
603
595
|
/* String */
|
|
604
596
|
)) {
|
|
605
|
-
return [stringAttribute(attributeValues.map(_ref2 => {
|
|
597
|
+
return [stringAttribute(attributeValues.map((_ref2) => {
|
|
606
598
|
let {
|
|
607
599
|
value
|
|
608
600
|
} = _ref2;
|
|
@@ -1203,7 +1195,7 @@ function evaluateCondition(condition, attributes) {
|
|
|
1203
1195
|
}
|
|
1204
1196
|
|
|
1205
1197
|
function getAttributeValue(attributes, attributeName) {
|
|
1206
|
-
const attributeMeta = attributes.find(_ref => {
|
|
1198
|
+
const attributeMeta = attributes.find((_ref) => {
|
|
1207
1199
|
let {
|
|
1208
1200
|
name
|
|
1209
1201
|
} = _ref;
|
|
@@ -1217,7 +1209,7 @@ const getAttributeNameFromClassified = values => values.length > 0 ? getAttribut
|
|
|
1217
1209
|
|
|
1218
1210
|
function findFeatureValue(parameterValues, _ref2) {
|
|
1219
1211
|
let [name, value] = _ref2;
|
|
1220
|
-
return value !== null ? parameterValues.find(_ref3 => {
|
|
1212
|
+
return value !== null ? parameterValues.find((_ref3) => {
|
|
1221
1213
|
let {
|
|
1222
1214
|
condition
|
|
1223
1215
|
} = _ref3;
|
|
@@ -1257,7 +1249,7 @@ function evaluateFeatureSymbol(attributes) {
|
|
|
1257
1249
|
}
|
|
1258
1250
|
|
|
1259
1251
|
function findChildFeatureStyle(childStyles, attributes) {
|
|
1260
|
-
return (childStyles || []).find(_ref5 => {
|
|
1252
|
+
return (childStyles || []).find((_ref5) => {
|
|
1261
1253
|
let {
|
|
1262
1254
|
condition
|
|
1263
1255
|
} = _ref5;
|
|
@@ -1443,7 +1435,7 @@ const createSvgGradient = (svg, values) => svg.gradient('linear', add => {
|
|
|
1443
1435
|
});
|
|
1444
1436
|
}).from(0, 0).to(1, 1); // eslint-disable-next-line max-lines-per-function
|
|
1445
1437
|
|
|
1446
|
-
const manipulateSvgSymbol = _ref2 => {
|
|
1438
|
+
const manipulateSvgSymbol = (_ref2) => {
|
|
1447
1439
|
var _$exec2;
|
|
1448
1440
|
|
|
1449
1441
|
let {
|
|
@@ -1855,7 +1847,7 @@ const checkLayerHasLegend = layerInfo => {
|
|
|
1855
1847
|
return (paramValue == null ? void 0 : paramValue.type) === 'byAttribute';
|
|
1856
1848
|
})) || false;
|
|
1857
1849
|
};
|
|
1858
|
-
const getTitleFromCondition = _ref2 => {
|
|
1850
|
+
const getTitleFromCondition = (_ref2) => {
|
|
1859
1851
|
let {
|
|
1860
1852
|
condition,
|
|
1861
1853
|
attribute,
|
|
@@ -2627,7 +2619,7 @@ let SGisPolygonSymbol = /*#__PURE__*/function (_sPolygonSymbol) {
|
|
|
2627
2619
|
const adaptMiterRings = (rings, resolution, fromCrs, toCrs) => {
|
|
2628
2620
|
const projected = projectRings(rings, fromCrs, toCrs);
|
|
2629
2621
|
return simplifyCoordinates(projected.map(ring => // @ts-ignore
|
|
2630
|
-
ring.map(_ref => {
|
|
2622
|
+
ring.map((_ref) => {
|
|
2631
2623
|
let [x, y] = _ref;
|
|
2632
2624
|
return [x / resolution, y / -resolution];
|
|
2633
2625
|
})), 1);
|
|
@@ -2719,111 +2711,6 @@ let ArrowLineMiterRender = /*#__PURE__*/function (_LineMiterRender) {
|
|
|
2719
2711
|
return ArrowLineMiterRender;
|
|
2720
2712
|
}(LineMiterRender);
|
|
2721
2713
|
|
|
2722
|
-
const LegendContext = /*#__PURE__*/createContext(null);
|
|
2723
|
-
const LegendProvider = _ref => {
|
|
2724
|
-
let {
|
|
2725
|
-
symbol,
|
|
2726
|
-
children
|
|
2727
|
-
} = _ref;
|
|
2728
|
-
return React.createElement(LegendContext.Provider, {
|
|
2729
|
-
value: symbol || null
|
|
2730
|
-
}, children);
|
|
2731
|
-
};
|
|
2732
|
-
const useLegendContext = () => useContext(LegendContext);
|
|
2733
|
-
|
|
2734
|
-
function useCanvas() {
|
|
2735
|
-
const canvas = useRef(null);
|
|
2736
|
-
const ref = useCallback(node => {
|
|
2737
|
-
if (node !== null) {
|
|
2738
|
-
canvas.current = new Canvas(node);
|
|
2739
|
-
} else {
|
|
2740
|
-
canvas.current = null;
|
|
2741
|
-
}
|
|
2742
|
-
}, []);
|
|
2743
|
-
return {
|
|
2744
|
-
canvas,
|
|
2745
|
-
ref
|
|
2746
|
-
};
|
|
2747
|
-
}
|
|
2748
|
-
|
|
2749
|
-
function useMount(_ref) {
|
|
2750
|
-
let {
|
|
2751
|
-
onMount,
|
|
2752
|
-
onUnmount
|
|
2753
|
-
} = _ref;
|
|
2754
|
-
useEffect(() => {
|
|
2755
|
-
onMount && onMount();
|
|
2756
|
-
return onUnmount; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2757
|
-
}, []);
|
|
2758
|
-
}
|
|
2759
|
-
|
|
2760
|
-
function useNode() {
|
|
2761
|
-
const [node, onSetNode] = useState(null);
|
|
2762
|
-
const ref = useCallback(onSetNode, [onSetNode]);
|
|
2763
|
-
return [ref, node];
|
|
2764
|
-
}
|
|
2765
|
-
|
|
2766
|
-
const DEFAULT_SYMBOL_SIZE$1 = 26;
|
|
2767
|
-
function useSymbol(_ref, canvasRef) {
|
|
2768
|
-
let {
|
|
2769
|
-
symbol,
|
|
2770
|
-
size = DEFAULT_SYMBOL_SIZE$1,
|
|
2771
|
-
render = getSymbolRenders,
|
|
2772
|
-
maxWidth
|
|
2773
|
-
} = _ref;
|
|
2774
|
-
useEffect(() => {
|
|
2775
|
-
if (canvasRef.current !== null && symbol !== undefined) {
|
|
2776
|
-
const canvas = canvasRef.current;
|
|
2777
|
-
setCanvasSize(canvas, size, maxWidth);
|
|
2778
|
-
render(symbol, size).then(renders => {
|
|
2779
|
-
renderSymbolToCanvas(renders, canvas);
|
|
2780
|
-
});
|
|
2781
|
-
} // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
2782
|
-
|
|
2783
|
-
}, [symbol, size, maxWidth]);
|
|
2784
|
-
}
|
|
2785
|
-
|
|
2786
|
-
function setCanvasSize(canvas, size, maxWidth) {
|
|
2787
|
-
canvas.node.height = size;
|
|
2788
|
-
canvas.node.width = maxWidth ? Math.min(size, maxWidth) : size;
|
|
2789
|
-
}
|
|
2790
|
-
|
|
2791
|
-
const useToggle = initial => {
|
|
2792
|
-
const [state, setState] = useState(initial !== undefined ? initial : false);
|
|
2793
|
-
const toggle = useCallback(() => setState(!state), [state]);
|
|
2794
|
-
return [state, toggle, setState];
|
|
2795
|
-
};
|
|
2796
|
-
|
|
2797
|
-
const metersToPixels = (meters, _ref) => {
|
|
2798
|
-
let {
|
|
2799
|
-
painter,
|
|
2800
|
-
crs = geo
|
|
2801
|
-
} = _ref;
|
|
2802
|
-
const {
|
|
2803
|
-
width
|
|
2804
|
-
} = painter;
|
|
2805
|
-
const zeroPoint = painter.getPointFromPxPosition(0, 0).projectTo(crs);
|
|
2806
|
-
const maxWidthPoint = painter.getPointFromPxPosition(width, 0).projectTo(crs);
|
|
2807
|
-
const widthDistance = distance(zeroPoint, maxWidthPoint);
|
|
2808
|
-
const pxK = width / (widthDistance || 1);
|
|
2809
|
-
return Math.round(meters * pxK);
|
|
2810
|
-
};
|
|
2811
|
-
|
|
2812
|
-
const polygonCircleFromPoint = (center, diameter) => {
|
|
2813
|
-
const coordinates = [];
|
|
2814
|
-
const radius = diameter / 2;
|
|
2815
|
-
const endAngle = Math.PI * 2;
|
|
2816
|
-
const step = Math.max(Math.PI / 2 / radius, endAngle / 128);
|
|
2817
|
-
let start = 0;
|
|
2818
|
-
let end = endAngle;
|
|
2819
|
-
|
|
2820
|
-
for (let ang = start; ang < end; ang += step) {
|
|
2821
|
-
coordinates.push([Math.cos(ang) * radius + center[0], Math.sin(ang) * radius + center[1]]);
|
|
2822
|
-
}
|
|
2823
|
-
|
|
2824
|
-
return [coordinates];
|
|
2825
|
-
};
|
|
2826
|
-
|
|
2827
2714
|
let CircleLineMiterRender = /*#__PURE__*/function (_LineMiterRender) {
|
|
2828
2715
|
_inherits(CircleLineMiterRender, _LineMiterRender);
|
|
2829
2716
|
|
|
@@ -3413,6 +3300,21 @@ const selectedPolygon = /*#__PURE__*/new SelectedPolySymbol({
|
|
|
3413
3300
|
selectedStrokeColor: '#ff5722'
|
|
3414
3301
|
});
|
|
3415
3302
|
|
|
3303
|
+
const metersToPixels = (meters, _ref) => {
|
|
3304
|
+
let {
|
|
3305
|
+
painter,
|
|
3306
|
+
crs = geo
|
|
3307
|
+
} = _ref;
|
|
3308
|
+
const {
|
|
3309
|
+
width
|
|
3310
|
+
} = painter;
|
|
3311
|
+
const zeroPoint = painter.getPointFromPxPosition(0, 0).projectTo(crs);
|
|
3312
|
+
const maxWidthPoint = painter.getPointFromPxPosition(width, 0).projectTo(crs);
|
|
3313
|
+
const widthDistance = distance(zeroPoint, maxWidthPoint);
|
|
3314
|
+
const pxK = width / (widthDistance || 1);
|
|
3315
|
+
return Math.round(meters * pxK);
|
|
3316
|
+
};
|
|
3317
|
+
|
|
3416
3318
|
const defaultPathStyles = {
|
|
3417
3319
|
strokeWidth: 2,
|
|
3418
3320
|
strokeColor: 'rgb(0, 163, 245)',
|
|
@@ -3913,7 +3815,7 @@ const useSvgSymbol = (symbol, skipOffset, isClassified) => {
|
|
|
3913
3815
|
SVGContainer.addTo(SVGWrapperRefElement.current);
|
|
3914
3816
|
}, [SVGContainer]);
|
|
3915
3817
|
const getSvgData = useCallback(() => SVGContainer.svg(), [SVGContainer]);
|
|
3916
|
-
const manipulateSvg = useCallback(_ref => {
|
|
3818
|
+
const manipulateSvg = useCallback((_ref) => {
|
|
3917
3819
|
let {
|
|
3918
3820
|
svg,
|
|
3919
3821
|
bg,
|
|
@@ -3983,38 +3885,38 @@ const useSvgSymbol = (symbol, skipOffset, isClassified) => {
|
|
|
3983
3885
|
|
|
3984
3886
|
var _templateObject$1, _templateObject2$1;
|
|
3985
3887
|
const SvgSymbolContainer = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
3986
|
-
const SvgSymbolLabel = /*#__PURE__*/styled.div(_templateObject2$1 || (_templateObject2$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n color: #fff;\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n line-height: 0;\n"])), _ref => {
|
|
3888
|
+
const SvgSymbolLabel = /*#__PURE__*/styled.div(_templateObject2$1 || (_templateObject2$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n color: #fff;\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n ", ";\n line-height: 0;\n"])), (_ref) => {
|
|
3987
3889
|
let {
|
|
3988
3890
|
fontSettings
|
|
3989
3891
|
} = _ref;
|
|
3990
3892
|
return !!(fontSettings != null && fontSettings.fontFamily) && "font-family: " + fontSettings.fontFamily;
|
|
3991
|
-
}, _ref2 => {
|
|
3893
|
+
}, (_ref2) => {
|
|
3992
3894
|
let {
|
|
3993
3895
|
fontSettings
|
|
3994
3896
|
} = _ref2;
|
|
3995
3897
|
return !!(fontSettings != null && fontSettings.fontWeight) && "font-weight: " + fontSettings.fontWeight;
|
|
3996
|
-
}, _ref3 => {
|
|
3898
|
+
}, (_ref3) => {
|
|
3997
3899
|
let {
|
|
3998
3900
|
fontSettings
|
|
3999
3901
|
} = _ref3;
|
|
4000
3902
|
return !!(fontSettings != null && fontSettings.fontStyle) && "font-style: " + fontSettings.fontStyle;
|
|
4001
|
-
}, _ref4 => {
|
|
3903
|
+
}, (_ref4) => {
|
|
4002
3904
|
let {
|
|
4003
3905
|
fontSettings
|
|
4004
3906
|
} = _ref4;
|
|
4005
3907
|
return !!(fontSettings != null && fontSettings.fontColor) && "color: " + fontSettings.fontColor;
|
|
4006
|
-
}, _ref5 => {
|
|
3908
|
+
}, (_ref5) => {
|
|
4007
3909
|
let {
|
|
4008
3910
|
fontSettings
|
|
4009
3911
|
} = _ref5;
|
|
4010
3912
|
return !!(fontSettings != null && fontSettings.fontSize) && "font-size: " + (typeof fontSettings.fontSize === 'string' ? fontSettings.fontSize : fontSettings.fontSize + "px");
|
|
4011
|
-
}, _ref6 => {
|
|
3913
|
+
}, (_ref6) => {
|
|
4012
3914
|
let {
|
|
4013
3915
|
fontSettings
|
|
4014
3916
|
} = _ref6;
|
|
4015
3917
|
return !!(fontSettings != null && fontSettings.haloColor) && !!(fontSettings != null && fontSettings.haloWidth) && "-webkit-text-stroke: " + fontSettings.haloWidth + "px " + fontSettings.haloColor + ";";
|
|
4016
3918
|
});
|
|
4017
|
-
const SvgSymbol = /*#__PURE__*/memo(_ref7 => {
|
|
3919
|
+
const SvgSymbol = /*#__PURE__*/memo((_ref7) => {
|
|
4018
3920
|
let {
|
|
4019
3921
|
svg,
|
|
4020
3922
|
bg,
|
|
@@ -4065,7 +3967,7 @@ const SvgSymbol = /*#__PURE__*/memo(_ref7 => {
|
|
|
4065
3967
|
}, text)) : renderSymbol;
|
|
4066
3968
|
});
|
|
4067
3969
|
|
|
4068
|
-
const ClusterSymbolPreview = _ref => {
|
|
3970
|
+
const ClusterSymbolPreview = (_ref) => {
|
|
4069
3971
|
var _symbol$fillColor$val, _symbol$labelSymbol;
|
|
4070
3972
|
|
|
4071
3973
|
let {
|
|
@@ -4102,7 +4004,7 @@ const ClusterSymbolPreview = _ref => {
|
|
|
4102
4004
|
});
|
|
4103
4005
|
};
|
|
4104
4006
|
|
|
4105
|
-
const SymbolByType = _ref => {
|
|
4007
|
+
const SymbolByType = (_ref) => {
|
|
4106
4008
|
let {
|
|
4107
4009
|
type,
|
|
4108
4010
|
symbol,
|
|
@@ -4129,7 +4031,7 @@ const SymbolByType = _ref => {
|
|
|
4129
4031
|
}
|
|
4130
4032
|
};
|
|
4131
4033
|
|
|
4132
|
-
const LegendSymbolRenderer = /*#__PURE__*/memo(_ref => {
|
|
4034
|
+
const LegendSymbolRenderer = /*#__PURE__*/memo((_ref) => {
|
|
4133
4035
|
let {
|
|
4134
4036
|
symbol,
|
|
4135
4037
|
index
|
|
@@ -4151,7 +4053,7 @@ const LegendSymbolRenderer = /*#__PURE__*/memo(_ref => {
|
|
|
4151
4053
|
});
|
|
4152
4054
|
});
|
|
4153
4055
|
|
|
4154
|
-
const LegendHeaderButtons = _ref => {
|
|
4056
|
+
const LegendHeaderButtons = (_ref) => {
|
|
4155
4057
|
let {
|
|
4156
4058
|
layerName,
|
|
4157
4059
|
hasHiddenLegends,
|
|
@@ -4170,7 +4072,7 @@ const LegendHeaderButtons = _ref => {
|
|
|
4170
4072
|
const getConditionAttribute = (attributes, condition) => {
|
|
4171
4073
|
if (!condition) return null;
|
|
4172
4074
|
const attributeName = getAttributeNameFromCondition(condition);
|
|
4173
|
-
let attribute = attributes.find(_ref => {
|
|
4075
|
+
let attribute = attributes.find((_ref) => {
|
|
4174
4076
|
let {
|
|
4175
4077
|
name
|
|
4176
4078
|
} = _ref;
|
|
@@ -4203,7 +4105,7 @@ const renderColumn = (column, index) => {
|
|
|
4203
4105
|
}, dateTime[0], React.createElement(MapLegendDescription, null, dateTime[1])), index === 0 && React.createElement(ItemSeparator, null));
|
|
4204
4106
|
};
|
|
4205
4107
|
|
|
4206
|
-
const getLegendText = _ref => {
|
|
4108
|
+
const getLegendText = (_ref) => {
|
|
4207
4109
|
let {
|
|
4208
4110
|
title,
|
|
4209
4111
|
index,
|
|
@@ -4236,7 +4138,7 @@ const getLegendText = _ref => {
|
|
|
4236
4138
|
|
|
4237
4139
|
const getLayerAttributes = layerDefinition => {
|
|
4238
4140
|
const attributes = layerDefinition && layerDefinition.attributes || {};
|
|
4239
|
-
return Object.entries(attributes).map(_ref => {
|
|
4141
|
+
return Object.entries(attributes).map((_ref) => {
|
|
4240
4142
|
let [name, definition] = _ref;
|
|
4241
4143
|
return _extends({
|
|
4242
4144
|
name
|
|
@@ -4244,7 +4146,7 @@ const getLayerAttributes = layerDefinition => {
|
|
|
4244
4146
|
});
|
|
4245
4147
|
};
|
|
4246
4148
|
|
|
4247
|
-
const LegendChildren = _ref => {
|
|
4149
|
+
const LegendChildren = (_ref) => {
|
|
4248
4150
|
var _layerInfo$style, _layerInfo$style$chil;
|
|
4249
4151
|
|
|
4250
4152
|
let {
|
|
@@ -4284,7 +4186,7 @@ const LegendChildren = _ref => {
|
|
|
4284
4186
|
}));
|
|
4285
4187
|
};
|
|
4286
4188
|
|
|
4287
|
-
const LegendParameterDescription = _ref => {
|
|
4189
|
+
const LegendParameterDescription = (_ref) => {
|
|
4288
4190
|
let {
|
|
4289
4191
|
parameter,
|
|
4290
4192
|
index
|
|
@@ -4312,7 +4214,7 @@ const getValueFromLegendTitle = (title, minOrMax) => {
|
|
|
4312
4214
|
return title.split(" ").find(isNumeric) || title || "";
|
|
4313
4215
|
};
|
|
4314
4216
|
|
|
4315
|
-
const MinimizedLegend = _ref => {
|
|
4217
|
+
const MinimizedLegend = (_ref) => {
|
|
4316
4218
|
var _currentValues$, _currentValues, _currentValues$2, _currentValues2;
|
|
4317
4219
|
|
|
4318
4220
|
let {
|
|
@@ -4383,7 +4285,7 @@ const MinimizedLegend = _ref => {
|
|
|
4383
4285
|
})), typeof (other == null ? void 0 : other.parameterValue) === "string" && (titleMax || titleMin) && React.createElement(MapLegendValues, null, React.createElement(MapLegendValuesRange, null, React.createElement("div", null, titleMax), React.createElement("div", null, titleMin)), React.createElement(MapLegendValuesOther, null, "-")));
|
|
4384
4286
|
};
|
|
4385
4287
|
|
|
4386
|
-
const MaximizedLegend = _ref => {
|
|
4288
|
+
const MaximizedLegend = (_ref) => {
|
|
4387
4289
|
let {
|
|
4388
4290
|
innerRef,
|
|
4389
4291
|
isShown,
|
|
@@ -4443,7 +4345,70 @@ const MaximizedLegend = _ref => {
|
|
|
4443
4345
|
}, values.map(renderLegend));
|
|
4444
4346
|
};
|
|
4445
4347
|
|
|
4446
|
-
|
|
4348
|
+
function useCanvas() {
|
|
4349
|
+
const canvas = useRef(null);
|
|
4350
|
+
const ref = useCallback(node => {
|
|
4351
|
+
if (node !== null) {
|
|
4352
|
+
canvas.current = new Canvas(node);
|
|
4353
|
+
} else {
|
|
4354
|
+
canvas.current = null;
|
|
4355
|
+
}
|
|
4356
|
+
}, []);
|
|
4357
|
+
return {
|
|
4358
|
+
canvas,
|
|
4359
|
+
ref
|
|
4360
|
+
};
|
|
4361
|
+
}
|
|
4362
|
+
|
|
4363
|
+
function useMount(_ref) {
|
|
4364
|
+
let {
|
|
4365
|
+
onMount,
|
|
4366
|
+
onUnmount
|
|
4367
|
+
} = _ref;
|
|
4368
|
+
useEffect(() => {
|
|
4369
|
+
onMount && onMount();
|
|
4370
|
+
return onUnmount; // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4371
|
+
}, []);
|
|
4372
|
+
}
|
|
4373
|
+
|
|
4374
|
+
function useNode() {
|
|
4375
|
+
const [node, onSetNode] = useState(null);
|
|
4376
|
+
const ref = useCallback(onSetNode, [onSetNode]);
|
|
4377
|
+
return [ref, node];
|
|
4378
|
+
}
|
|
4379
|
+
|
|
4380
|
+
const DEFAULT_SYMBOL_SIZE$1 = 26;
|
|
4381
|
+
function useSymbol(_ref, canvasRef) {
|
|
4382
|
+
let {
|
|
4383
|
+
symbol,
|
|
4384
|
+
size = DEFAULT_SYMBOL_SIZE$1,
|
|
4385
|
+
render = getSymbolRenders,
|
|
4386
|
+
maxWidth
|
|
4387
|
+
} = _ref;
|
|
4388
|
+
useEffect(() => {
|
|
4389
|
+
if (canvasRef.current !== null && symbol !== undefined) {
|
|
4390
|
+
const canvas = canvasRef.current;
|
|
4391
|
+
setCanvasSize(canvas, size, maxWidth);
|
|
4392
|
+
render(symbol, size).then(renders => {
|
|
4393
|
+
renderSymbolToCanvas(renders, canvas);
|
|
4394
|
+
});
|
|
4395
|
+
} // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4396
|
+
|
|
4397
|
+
}, [symbol, size, maxWidth]);
|
|
4398
|
+
}
|
|
4399
|
+
|
|
4400
|
+
function setCanvasSize(canvas, size, maxWidth) {
|
|
4401
|
+
canvas.node.height = size;
|
|
4402
|
+
canvas.node.width = maxWidth ? Math.min(size, maxWidth) : size;
|
|
4403
|
+
}
|
|
4404
|
+
|
|
4405
|
+
const useToggle = initial => {
|
|
4406
|
+
const [state, setState] = useState(initial !== undefined ? initial : false);
|
|
4407
|
+
const toggle = useCallback(() => setState(!state), [state]);
|
|
4408
|
+
return [state, toggle, setState];
|
|
4409
|
+
};
|
|
4410
|
+
|
|
4411
|
+
const LegendSection = (_ref) => {
|
|
4447
4412
|
var _hiddenLegends$layerN, _hiddenLegends$layerN2;
|
|
4448
4413
|
|
|
4449
4414
|
let {
|
|
@@ -4508,7 +4473,7 @@ const LegendSection = _ref => {
|
|
|
4508
4473
|
};
|
|
4509
4474
|
|
|
4510
4475
|
const _excluded$1 = ["layerInfo", "formatValue", "hiddenLegends", "toggleHiddenLegend", "clearHiddenLegends", "goToClassification"];
|
|
4511
|
-
const Legend = /*#__PURE__*/memo(_ref => {
|
|
4476
|
+
const Legend = /*#__PURE__*/memo((_ref) => {
|
|
4512
4477
|
var _layerInfo$style, _layerInfo$style$chil;
|
|
4513
4478
|
|
|
4514
4479
|
let {
|
|
@@ -4589,7 +4554,7 @@ const Legend = /*#__PURE__*/memo(_ref => {
|
|
|
4589
4554
|
return React.createElement(MapLegendContainer, null, renderItems);
|
|
4590
4555
|
});
|
|
4591
4556
|
|
|
4592
|
-
const Symbol = _ref => {
|
|
4557
|
+
const Symbol = (_ref) => {
|
|
4593
4558
|
let {
|
|
4594
4559
|
symbol,
|
|
4595
4560
|
size,
|
|
@@ -4610,19 +4575,19 @@ const Symbol = _ref => {
|
|
|
4610
4575
|
};
|
|
4611
4576
|
|
|
4612
4577
|
var _templateObject$2, _templateObject2$2;
|
|
4613
|
-
const CompoundIcon = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n height: 32px;\n width: 32px;\n"])), _ref => {
|
|
4578
|
+
const CompoundIcon = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n height: 32px;\n width: 32px;\n"])), (_ref) => {
|
|
4614
4579
|
let {
|
|
4615
4580
|
geometryType,
|
|
4616
4581
|
icons
|
|
4617
4582
|
} = _ref;
|
|
4618
4583
|
return "url(" + icons[geometryType] + ") center center / " + (geometryType === GeometryType.Polyline ? '2rem 1.3rem' : 'auto 1rem') + " no-repeat";
|
|
4619
4584
|
});
|
|
4620
|
-
const ClusterSymbol = /*#__PURE__*/styled.div(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 32px;\n height: 32px;\n\n :before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: inherit;\n height: inherit;\n background-color: ", ";\n border-radius: 50%;\n opacity: 0.28;\n }\n \n :after {\n content: \"99\";\n position: absolute;\n top: 4px;\n left: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border-radius: 50%;\n color: white;\n font-size: 0.75rem;\n line-height: 1;\n }\n"])), _ref2 => {
|
|
4585
|
+
const ClusterSymbol = /*#__PURE__*/styled.div(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: 32px;\n height: 32px;\n\n :before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n width: inherit;\n height: inherit;\n background-color: ", ";\n border-radius: 50%;\n opacity: 0.28;\n }\n \n :after {\n content: \"99\";\n position: absolute;\n top: 4px;\n left: 4px;\n display: flex;\n justify-content: center;\n align-items: center;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border-radius: 50%;\n color: white;\n font-size: 0.75rem;\n line-height: 1;\n }\n"])), (_ref2) => {
|
|
4621
4586
|
let {
|
|
4622
4587
|
color
|
|
4623
4588
|
} = _ref2;
|
|
4624
4589
|
return color;
|
|
4625
|
-
}, _ref3 => {
|
|
4590
|
+
}, (_ref3) => {
|
|
4626
4591
|
let {
|
|
4627
4592
|
color
|
|
4628
4593
|
} = _ref3;
|
|
@@ -4630,7 +4595,7 @@ const ClusterSymbol = /*#__PURE__*/styled.div(_templateObject2$2 || (_templateOb
|
|
|
4630
4595
|
});
|
|
4631
4596
|
|
|
4632
4597
|
const MAX_SIZE = 32;
|
|
4633
|
-
const StyleSymbol = _ref => {
|
|
4598
|
+
const StyleSymbol = (_ref) => {
|
|
4634
4599
|
let {
|
|
4635
4600
|
symbol,
|
|
4636
4601
|
size = MAX_SIZE,
|
|
@@ -4669,5 +4634,32 @@ const StyleSymbol = _ref => {
|
|
|
4669
4634
|
});
|
|
4670
4635
|
};
|
|
4671
4636
|
|
|
4637
|
+
const LegendContext = /*#__PURE__*/createContext(null);
|
|
4638
|
+
const LegendProvider = (_ref) => {
|
|
4639
|
+
let {
|
|
4640
|
+
symbol,
|
|
4641
|
+
children
|
|
4642
|
+
} = _ref;
|
|
4643
|
+
return React.createElement(LegendContext.Provider, {
|
|
4644
|
+
value: symbol || null
|
|
4645
|
+
}, children);
|
|
4646
|
+
};
|
|
4647
|
+
const useLegendContext = () => useContext(LegendContext);
|
|
4648
|
+
|
|
4649
|
+
const polygonCircleFromPoint = (center, diameter) => {
|
|
4650
|
+
const coordinates = [];
|
|
4651
|
+
const radius = diameter / 2;
|
|
4652
|
+
const endAngle = Math.PI * 2;
|
|
4653
|
+
const step = Math.max(Math.PI / 2 / radius, endAngle / 128);
|
|
4654
|
+
let start = 0;
|
|
4655
|
+
let end = endAngle;
|
|
4656
|
+
|
|
4657
|
+
for (let ang = start; ang < end; ang += step) {
|
|
4658
|
+
coordinates.push([Math.cos(ang) * radius + center[0], Math.sin(ang) * radius + center[1]]);
|
|
4659
|
+
}
|
|
4660
|
+
|
|
4661
|
+
return [coordinates];
|
|
4662
|
+
};
|
|
4663
|
+
|
|
4672
4664
|
export { ArrowLineMiterRender, BASE_OPERATORS, BETWEEN_OPERATORS, CONTAINS_OPERATORS, CircleLineMiterRender, ClassificationCondition, ClassificationManager, ClassifiedItem, ClusterLegendContainer, ClusterSymbol, ClusterSymbolPreview, ComparisonOperator, CompoundIcon, DEFAULT_CLUSTER_SVG, DEFAULT_ID_ATTRIBUTE_NAME, DEFAULT_LEGEND_SIZES, DEFAULT_LEGEND_STYLES, DEFAULT_LEGEND_SYMBOL_SIZE, DEFAULT_PARAMETER_INFO, DEFAULT_SYMBOL_FILL_COLOR, DEFAULT_SYMBOL_OFFSET, DEFAULT_SYMBOL_SIZE, DEFAULT_SYMBOL_STROKE_COLOR, DEFAULT_SYMBOL_WITH_BG_SIZE, DateFormat, ENDS_WITH_OPERATORS, EXTRA_BORDER_SIZE, EvergisStyle, FILLED_OPERATORS, FilterConditionOperation, GEOMETRY_ATTRIBUTE, ItemSeparator, ItemText, Legend, LegendChildren, LegendHeaderButton, LegendParameterDescription, LegendProvider, LegendSection, LegendSymbolRenderer, LineMiterRender, MapLegendBadge, MapLegendContainer, MapLegendDescription, MapLegendDescriptionContainer, MapLegendExpandButton, MapLegendHeader, MapLegendItem, MapLegendItems, MapLegendItemsContainer, MapLegendOther, MapLegendSectionContainer, MapLegendSectionItems, MapLegendValueDescr, MapLegendValues, MapLegendValuesOther, MapLegendValuesRange, MaximizedLegend, MaximizedLegendContainer, MinimizedLegend, MinimizedLegendContainer, NO_CONTENT_VALUE, OPERATOR_CONDITION_REMAP, PARAMETER_INFOS, PREVIEW_LIMITS, RANGE_OPERATORS, SGisBrushFill, SGisImageFill, SGisPolygonSymbol, SGisPolylineSymbol, SOLID_INTERVALS, STARTS_WITH_OPERATORS, SVGPoly, SYMBOL_CLASSIFICATION, SYMBOL_LIMITS, SYMBOL_SIZE_PARAMETERS, SelectedPointSymbol, SelectedPolySymbol, ShadowedPointSymbol, ShadowedPolySymbol, SizeMinimizedLegend, SizeMinimizedLegendDown, SizeMinimizedLegendLabel, SizeMinimizedLegendSymbol, SizeMinimizedLegendUp, SquareLineMiterRender, StyleSymbol, SvgSymbol, SvgSymbolBg, Symbol, SymbolButton, SymbolByType, SymbolContainer, adjustSymbol, applyParameterValue, checkLayerHasLegend, clamp, classifyParamsReduce, convertSvgToBase64, copyRings, createCompositeSymbol, createHiddenCondition, createLegendSymbol, createOtherHiddenCondition, createPointRender, createShadowRender, createSvgGradient, createValueTitle, createValueTitleFromCondition, dateComparisonOperators, defineStrokeStylePreset, deserializeSymbol, extractStyle, extractSymbol, findChildFeatureStyle, findChildFeatureSymbol, formatAttributeValue, formatDate, formatRangeClassValue, formatUniqueClassValue, getAttributeFromCondition, getAttributeNameFromClassified, getAttributeNameFromCondition, getChildSymbols, getClassificationValue, getClassified, getDashStylePreset, getDate, getDimensions, getExprFromCondition, getExtractedSymbol, getFeatureSymbol, getHexColor, getLegendSymbolRenders, getLegendSymbolSize, getLineDash, getMapLegendSymbolRenders, getMaximizedLegendValues, getMinimizedLegendValues, getOffsetParameterValue, getParameterFromSymbol, getParameterValue, getRangeValues$1 as getRangeValues, getServiceConfiguration, getSignFromConditionPart, getSimplifiedPolygonCoordinates, getSymbolParameterInfo, getSymbolRenders, getSymbolStrokeWidth, getTitleFromCondition, getValueFromConditionPart, isArrowLineMiter, isCalculatedParameter, isCircleLineMiter, isClusterFillColor, isClusterSymbol, isCombinedPolylineSymbol, isCompositeSymbol, isDashedBrush, isFilledLineMitter, isH3GridSymbol, isHatchBrush, isImageSymbol, isLabelSymbol, isLayerService, isMaskedImageSymbol, isMiterExist, isNumeric, isObject, isParameterByAttribute, isParameterType, isParameterValueSimple, isParameterValueSymbol, isPatternBrush, isPointLabelSymbol, isPointSymbol, isPolygonHasHatchBrush, isPolygonHasPatternBrush, isPolygonLabelSymbol, isPolygonSymbol, isPolylineLabelSymbol, isPolylineSymbols, isRangeClass, isRangeCondition, isRasterSymbol, isRequisiteNumbers, isSGisClusterSymbol, isSGisCombinedPolylineSymbol, isSGisH3Symbol, isSGisImageSymbol, isSGisPointSymbol, isSGisPolygonSymbol, isSGisPolylineSymbol, isScalablePolylineSymbol, isSimpleOffset, isSimplePolylineSymbol, isSimpleSymbol, isSizableSymbol, isSizeClassification, isSolidBrush, isSquareLineMiter, isSquareSymbol, isStaticImageSymbol, isStringAsInn, isStringAsKpp, isStringAsMail, isStringAsOgrn, isStringAsPhone, isStringAsUrl, isStringContainsDate, isStringParameterValue, isStrokeStyledSymbol, isStyle, isSvgPointSymbol, isSymbolWithOffset, isTwoDimensionalSymbol, isUniqueClass, isValidParameter, isValidUrl, mailHref, manipulateSvgSymbol, matchPhone, measureAreaSymbol, measureLengthSymbol, measurePolygonSnapSymbol, metersToPixels, numberComparisonOperators, numberWithSpaces, packStyle, phoneHref, polygonCircleFromPoint, printRangeClass, renderSymbolToCanvas, selectedPoint, selectedPolygon, selectedPolyline, serializeSvgPointSymbol, setDefaultParameterValue, setParameterValue, solidStrokeStylePreset, strokeStylePresets, symbolParameterWalker, symbolTypeGuard, textComparisonOperators, toIntervals, toLineDash, unClassify, updateSymbolParameter, urlHref, useCanvas, useLegendContext, useMount, useNode, useSvgSymbol, useSymbol, useToggle };
|
|
4673
4665
|
//# sourceMappingURL=react.esm.js.map
|