@evergis/react 3.0.21 → 3.0.22
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 +178 -170
- 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 +179 -171
- 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, { useContext, createContext, useRef, useCallback, useEffect, useState, useMemo, memo, Fragment } 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,6 +19,8 @@ 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';
|
|
22
24
|
import { Poly } from '@evergis/sgis/es/features/Poly';
|
|
23
25
|
import { PointSymbol } from '@evergis/sgis/es/symbols/point/Point';
|
|
24
26
|
import { PointFeature } from '@evergis/sgis/es/features/PointFeature';
|
|
@@ -28,7 +30,6 @@ import { DynamicRender } from '@evergis/sgis/es/renders/Render';
|
|
|
28
30
|
import { SvgRender } from '@evergis/sgis/es/painters/DomPainter/SvgRender';
|
|
29
31
|
import { listenDomEvent } from '@evergis/sgis/es/utils/domEvent';
|
|
30
32
|
import { MouseEventFlags, mouseEvents } from '@evergis/sgis/es/EventHandler';
|
|
31
|
-
import { geo, plain } from '@evergis/sgis/es/Crs';
|
|
32
33
|
import { StaticImageSymbol } from '@evergis/sgis/es/symbols/point/StaticImageSymbol';
|
|
33
34
|
import { SquareSymbol } from '@evergis/sgis/es/symbols/point/Square';
|
|
34
35
|
import { MaskedImage } from '@evergis/sgis/es/symbols/point/MaskedImage';
|
|
@@ -38,7 +39,6 @@ import { Polygon } from '@evergis/sgis/es/features/Polygon';
|
|
|
38
39
|
import { Polyline } from '@evergis/sgis/es/features/Polyline';
|
|
39
40
|
import { H3Feature } from '@evergis/sgis/es/features/H3Feature';
|
|
40
41
|
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,6 +59,9 @@ 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
|
+
});
|
|
62
65
|
return Constructor;
|
|
63
66
|
}
|
|
64
67
|
|
|
@@ -92,6 +95,9 @@ function _inherits(subClass, superClass) {
|
|
|
92
95
|
configurable: true
|
|
93
96
|
}
|
|
94
97
|
});
|
|
98
|
+
Object.defineProperty(subClass, "prototype", {
|
|
99
|
+
writable: false
|
|
100
|
+
});
|
|
95
101
|
if (superClass) _setPrototypeOf(subClass, superClass);
|
|
96
102
|
}
|
|
97
103
|
|
|
@@ -150,6 +156,8 @@ function _assertThisInitialized(self) {
|
|
|
150
156
|
function _possibleConstructorReturn(self, call) {
|
|
151
157
|
if (call && (typeof call === "object" || typeof call === "function")) {
|
|
152
158
|
return call;
|
|
159
|
+
} else if (call !== void 0) {
|
|
160
|
+
throw new TypeError("Derived constructors may only return object or undefined");
|
|
153
161
|
}
|
|
154
162
|
|
|
155
163
|
return _assertThisInitialized(self);
|
|
@@ -183,7 +191,7 @@ function _superPropBase(object, property) {
|
|
|
183
191
|
return object;
|
|
184
192
|
}
|
|
185
193
|
|
|
186
|
-
function _get(
|
|
194
|
+
function _get() {
|
|
187
195
|
if (typeof Reflect !== "undefined" && Reflect.get) {
|
|
188
196
|
_get = Reflect.get;
|
|
189
197
|
} else {
|
|
@@ -194,14 +202,14 @@ function _get(target, property, receiver) {
|
|
|
194
202
|
var desc = Object.getOwnPropertyDescriptor(base, property);
|
|
195
203
|
|
|
196
204
|
if (desc.get) {
|
|
197
|
-
return desc.get.call(receiver);
|
|
205
|
+
return desc.get.call(arguments.length < 3 ? target : receiver);
|
|
198
206
|
}
|
|
199
207
|
|
|
200
208
|
return desc.value;
|
|
201
209
|
};
|
|
202
210
|
}
|
|
203
211
|
|
|
204
|
-
return _get(
|
|
212
|
+
return _get.apply(this, arguments);
|
|
205
213
|
}
|
|
206
214
|
|
|
207
215
|
function _taggedTemplateLiteralLoose(strings, raw) {
|
|
@@ -225,7 +233,7 @@ const isParameterType = (types, parameter) => {
|
|
|
225
233
|
|
|
226
234
|
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;
|
|
227
235
|
const MapLegendDescription = /*#__PURE__*/styled.div(_templateObject || (_templateObject = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: 0.75rem;\n"])));
|
|
228
|
-
const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: calc(100% - 2rem);\n font: ", ";\n"])),
|
|
236
|
+
const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n max-width: calc(100% - 2rem);\n font: ", ";\n"])), _ref => {
|
|
229
237
|
let {
|
|
230
238
|
theme: {
|
|
231
239
|
fonts
|
|
@@ -235,28 +243,28 @@ const ItemText = /*#__PURE__*/styled.div(_templateObject2 || (_templateObject2 =
|
|
|
235
243
|
});
|
|
236
244
|
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"])));
|
|
237
245
|
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"])));
|
|
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"])),
|
|
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 => {
|
|
239
247
|
let {
|
|
240
248
|
isClusterFillColor
|
|
241
249
|
} = _ref2;
|
|
242
250
|
return isClusterFillColor ? 'default' : 'pointer';
|
|
243
|
-
},
|
|
251
|
+
}, _ref3 => {
|
|
244
252
|
let {
|
|
245
253
|
isClusterFillColor
|
|
246
254
|
} = _ref3;
|
|
247
255
|
return isClusterFillColor ? 'none' : 'auto';
|
|
248
|
-
}, ItemText, SymbolContainer, ItemText,
|
|
256
|
+
}, ItemText, SymbolContainer, ItemText, _ref4 => {
|
|
249
257
|
let {
|
|
250
258
|
isHidden
|
|
251
259
|
} = _ref4;
|
|
252
260
|
return isHidden ? 0.28 : 0.65;
|
|
253
|
-
}, SymbolContainer,
|
|
261
|
+
}, SymbolContainer, _ref5 => {
|
|
254
262
|
let {
|
|
255
263
|
isHidden
|
|
256
264
|
} = _ref5;
|
|
257
265
|
return isHidden ? 0.28 : 1;
|
|
258
266
|
}, ItemText, SymbolContainer, IconButton);
|
|
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"])),
|
|
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 => {
|
|
260
268
|
let {
|
|
261
269
|
theme: {
|
|
262
270
|
palette
|
|
@@ -264,7 +272,7 @@ const SymbolButtonWithClick = /*#__PURE__*/css(_templateObject6 || (_templateObj
|
|
|
264
272
|
} = _ref6;
|
|
265
273
|
return palette.elementDeep;
|
|
266
274
|
});
|
|
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"])),
|
|
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 => {
|
|
268
276
|
let {
|
|
269
277
|
onClick
|
|
270
278
|
} = _ref7;
|
|
@@ -273,21 +281,21 @@ const SymbolButton = /*#__PURE__*/styled.span(_templateObject7 || (_templateObje
|
|
|
273
281
|
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"])));
|
|
274
282
|
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"])));
|
|
275
283
|
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"])));
|
|
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"])),
|
|
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 => {
|
|
277
285
|
let {
|
|
278
286
|
theme: {
|
|
279
287
|
borderRadius
|
|
280
288
|
}
|
|
281
289
|
} = _ref8;
|
|
282
290
|
return borderRadius.xSmall;
|
|
283
|
-
},
|
|
291
|
+
}, _ref9 => {
|
|
284
292
|
let {
|
|
285
293
|
theme: {
|
|
286
294
|
palette
|
|
287
295
|
}
|
|
288
296
|
} = _ref9;
|
|
289
297
|
return palette.element;
|
|
290
|
-
},
|
|
298
|
+
}, _ref10 => {
|
|
291
299
|
let {
|
|
292
300
|
theme: {
|
|
293
301
|
palette
|
|
@@ -295,17 +303,17 @@ const MapLegendBadge = /*#__PURE__*/styled.span(_templateObject11 || (_templateO
|
|
|
295
303
|
} = _ref10;
|
|
296
304
|
return palette.textPrimary;
|
|
297
305
|
});
|
|
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"])),
|
|
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 => {
|
|
299
307
|
let {
|
|
300
308
|
isShown
|
|
301
309
|
} = _ref11;
|
|
302
310
|
return isShown ? 'relative' : 'absolute';
|
|
303
|
-
},
|
|
311
|
+
}, _ref12 => {
|
|
304
312
|
let {
|
|
305
313
|
isShown
|
|
306
314
|
} = _ref12;
|
|
307
315
|
return isShown ? 1 : 0;
|
|
308
|
-
},
|
|
316
|
+
}, _ref13 => {
|
|
309
317
|
let {
|
|
310
318
|
isShown
|
|
311
319
|
} = _ref13;
|
|
@@ -313,7 +321,7 @@ const MaximizedLegendContainer = /*#__PURE__*/styled.div(_templateObject12 || (_
|
|
|
313
321
|
});
|
|
314
322
|
const MinimizedLegendContainer = /*#__PURE__*/styled(MaximizedLegendContainer)(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: calc(100% - 1.5rem);\n padding-right: 1.5rem;\n"])));
|
|
315
323
|
const LegendHeaderButton = /*#__PURE__*/styled.span(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
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,
|
|
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 => {
|
|
317
325
|
let {
|
|
318
326
|
theme: {
|
|
319
327
|
palette
|
|
@@ -321,14 +329,14 @@ const MapLegendSectionContainer = /*#__PURE__*/styled.div(_templateObject15 || (
|
|
|
321
329
|
} = _ref14;
|
|
322
330
|
return palette.elementDeep;
|
|
323
331
|
}, LegendHeaderButton);
|
|
324
|
-
const MapLegendSectionItems = /*#__PURE__*/styled.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n height: ", "px;\n overflow: ", ";\n transition: height 0.5s;\n"])),
|
|
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 => {
|
|
325
333
|
let {
|
|
326
334
|
minHeight,
|
|
327
335
|
maxHeight,
|
|
328
336
|
isExpanded
|
|
329
337
|
} = _ref15;
|
|
330
338
|
return isExpanded ? (maxHeight || 0) + 4 : minHeight;
|
|
331
|
-
},
|
|
339
|
+
}, _ref16 => {
|
|
332
340
|
let {
|
|
333
341
|
isExpanded
|
|
334
342
|
} = _ref16;
|
|
@@ -353,28 +361,28 @@ const StrokeWidthLegendItemMixin = function StrokeWidthLegendItemMixin(value) {
|
|
|
353
361
|
};
|
|
354
362
|
|
|
355
363
|
const StrokeColorLegendItemMixin = /*#__PURE__*/css(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-right: 0.5rem;\n width: 1.5rem;\n"])));
|
|
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"])),
|
|
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 => {
|
|
357
365
|
let {
|
|
358
366
|
parameter
|
|
359
367
|
} = _ref17;
|
|
360
368
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) ? 0.25 : 1;
|
|
361
|
-
},
|
|
369
|
+
}, _ref18 => {
|
|
362
370
|
let {
|
|
363
371
|
value
|
|
364
372
|
} = _ref18;
|
|
365
373
|
return typeof value === 'number' ? 'none' : value;
|
|
366
|
-
},
|
|
374
|
+
}, _ref19 => {
|
|
367
375
|
let {
|
|
368
376
|
isHidden
|
|
369
377
|
} = _ref19;
|
|
370
378
|
return isHidden ? 0.28 : 1;
|
|
371
|
-
},
|
|
379
|
+
}, _ref20 => {
|
|
372
380
|
let {
|
|
373
381
|
value,
|
|
374
382
|
parameter
|
|
375
383
|
} = _ref20;
|
|
376
384
|
return isParameterType('size', parameter) && SizeLegendItemMixin(value);
|
|
377
|
-
},
|
|
385
|
+
}, _ref21 => {
|
|
378
386
|
let {
|
|
379
387
|
value,
|
|
380
388
|
parameter
|
|
@@ -390,28 +398,28 @@ const SizeMinimizedLegendLabel = /*#__PURE__*/styled.div(_templateObject27 || (_
|
|
|
390
398
|
const SizeMinimizedLegendDown = /*#__PURE__*/styled.div(_templateObject28 || (_templateObject28 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: rgba(48, 69, 79, 0.65);\n"])));
|
|
391
399
|
const SizeMinimizedLegendUp = /*#__PURE__*/styled(SizeMinimizedLegendDown)(_templateObject29 || (_templateObject29 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
392
400
|
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);
|
|
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"])),
|
|
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 => {
|
|
394
402
|
let {
|
|
395
403
|
isSize
|
|
396
404
|
} = _ref22;
|
|
397
405
|
return isSize && SingleSizeLegendItemsMixin;
|
|
398
|
-
}, MapLegendItem,
|
|
406
|
+
}, MapLegendItem, _ref23 => {
|
|
399
407
|
let {
|
|
400
408
|
parameter
|
|
401
409
|
} = _ref23;
|
|
402
410
|
return isParameterType(['strokeColor', 'stroke.color'], parameter) && StrokeColorLegendItemMixin;
|
|
403
411
|
});
|
|
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"])),
|
|
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 => {
|
|
405
413
|
let {
|
|
406
414
|
isSize
|
|
407
415
|
} = _ref24;
|
|
408
416
|
return isSize && SizeLegendItemsMixin;
|
|
409
|
-
},
|
|
417
|
+
}, _ref25 => {
|
|
410
418
|
let {
|
|
411
419
|
isStrokeWidth
|
|
412
420
|
} = _ref25;
|
|
413
421
|
return isStrokeWidth && StrokeWidthLegendItemsMixin;
|
|
414
|
-
},
|
|
422
|
+
}, _ref26 => {
|
|
415
423
|
let {
|
|
416
424
|
isSingle
|
|
417
425
|
} = _ref26;
|
|
@@ -586,7 +594,7 @@ const formatStringAttribute = value => {
|
|
|
586
594
|
|
|
587
595
|
const attributeValues = value.split(/[\s|]/).map(convertStringAttribute);
|
|
588
596
|
|
|
589
|
-
if (attributeValues.every(
|
|
597
|
+
if (attributeValues.every(_ref => {
|
|
590
598
|
let {
|
|
591
599
|
type
|
|
592
600
|
} = _ref;
|
|
@@ -594,7 +602,7 @@ const formatStringAttribute = value => {
|
|
|
594
602
|
}
|
|
595
603
|
/* String */
|
|
596
604
|
)) {
|
|
597
|
-
return [stringAttribute(attributeValues.map(
|
|
605
|
+
return [stringAttribute(attributeValues.map(_ref2 => {
|
|
598
606
|
let {
|
|
599
607
|
value
|
|
600
608
|
} = _ref2;
|
|
@@ -1195,7 +1203,7 @@ function evaluateCondition(condition, attributes) {
|
|
|
1195
1203
|
}
|
|
1196
1204
|
|
|
1197
1205
|
function getAttributeValue(attributes, attributeName) {
|
|
1198
|
-
const attributeMeta = attributes.find(
|
|
1206
|
+
const attributeMeta = attributes.find(_ref => {
|
|
1199
1207
|
let {
|
|
1200
1208
|
name
|
|
1201
1209
|
} = _ref;
|
|
@@ -1209,7 +1217,7 @@ const getAttributeNameFromClassified = values => values.length > 0 ? getAttribut
|
|
|
1209
1217
|
|
|
1210
1218
|
function findFeatureValue(parameterValues, _ref2) {
|
|
1211
1219
|
let [name, value] = _ref2;
|
|
1212
|
-
return value !== null ? parameterValues.find(
|
|
1220
|
+
return value !== null ? parameterValues.find(_ref3 => {
|
|
1213
1221
|
let {
|
|
1214
1222
|
condition
|
|
1215
1223
|
} = _ref3;
|
|
@@ -1249,7 +1257,7 @@ function evaluateFeatureSymbol(attributes) {
|
|
|
1249
1257
|
}
|
|
1250
1258
|
|
|
1251
1259
|
function findChildFeatureStyle(childStyles, attributes) {
|
|
1252
|
-
return (childStyles || []).find(
|
|
1260
|
+
return (childStyles || []).find(_ref5 => {
|
|
1253
1261
|
let {
|
|
1254
1262
|
condition
|
|
1255
1263
|
} = _ref5;
|
|
@@ -1435,7 +1443,7 @@ const createSvgGradient = (svg, values) => svg.gradient('linear', add => {
|
|
|
1435
1443
|
});
|
|
1436
1444
|
}).from(0, 0).to(1, 1); // eslint-disable-next-line max-lines-per-function
|
|
1437
1445
|
|
|
1438
|
-
const manipulateSvgSymbol =
|
|
1446
|
+
const manipulateSvgSymbol = _ref2 => {
|
|
1439
1447
|
var _$exec2;
|
|
1440
1448
|
|
|
1441
1449
|
let {
|
|
@@ -1847,7 +1855,7 @@ const checkLayerHasLegend = layerInfo => {
|
|
|
1847
1855
|
return (paramValue == null ? void 0 : paramValue.type) === 'byAttribute';
|
|
1848
1856
|
})) || false;
|
|
1849
1857
|
};
|
|
1850
|
-
const getTitleFromCondition =
|
|
1858
|
+
const getTitleFromCondition = _ref2 => {
|
|
1851
1859
|
let {
|
|
1852
1860
|
condition,
|
|
1853
1861
|
attribute,
|
|
@@ -2619,7 +2627,7 @@ let SGisPolygonSymbol = /*#__PURE__*/function (_sPolygonSymbol) {
|
|
|
2619
2627
|
const adaptMiterRings = (rings, resolution, fromCrs, toCrs) => {
|
|
2620
2628
|
const projected = projectRings(rings, fromCrs, toCrs);
|
|
2621
2629
|
return simplifyCoordinates(projected.map(ring => // @ts-ignore
|
|
2622
|
-
ring.map(
|
|
2630
|
+
ring.map(_ref => {
|
|
2623
2631
|
let [x, y] = _ref;
|
|
2624
2632
|
return [x / resolution, y / -resolution];
|
|
2625
2633
|
})), 1);
|
|
@@ -2711,6 +2719,111 @@ let ArrowLineMiterRender = /*#__PURE__*/function (_LineMiterRender) {
|
|
|
2711
2719
|
return ArrowLineMiterRender;
|
|
2712
2720
|
}(LineMiterRender);
|
|
2713
2721
|
|
|
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
|
+
|
|
2714
2827
|
let CircleLineMiterRender = /*#__PURE__*/function (_LineMiterRender) {
|
|
2715
2828
|
_inherits(CircleLineMiterRender, _LineMiterRender);
|
|
2716
2829
|
|
|
@@ -3300,21 +3413,6 @@ const selectedPolygon = /*#__PURE__*/new SelectedPolySymbol({
|
|
|
3300
3413
|
selectedStrokeColor: '#ff5722'
|
|
3301
3414
|
});
|
|
3302
3415
|
|
|
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
|
-
|
|
3318
3416
|
const defaultPathStyles = {
|
|
3319
3417
|
strokeWidth: 2,
|
|
3320
3418
|
strokeColor: 'rgb(0, 163, 245)',
|
|
@@ -3815,7 +3913,7 @@ const useSvgSymbol = (symbol, skipOffset, isClassified) => {
|
|
|
3815
3913
|
SVGContainer.addTo(SVGWrapperRefElement.current);
|
|
3816
3914
|
}, [SVGContainer]);
|
|
3817
3915
|
const getSvgData = useCallback(() => SVGContainer.svg(), [SVGContainer]);
|
|
3818
|
-
const manipulateSvg = useCallback(
|
|
3916
|
+
const manipulateSvg = useCallback(_ref => {
|
|
3819
3917
|
let {
|
|
3820
3918
|
svg,
|
|
3821
3919
|
bg,
|
|
@@ -3885,38 +3983,38 @@ const useSvgSymbol = (symbol, skipOffset, isClassified) => {
|
|
|
3885
3983
|
|
|
3886
3984
|
var _templateObject$1, _templateObject2$1;
|
|
3887
3985
|
const SvgSymbolContainer = /*#__PURE__*/styled.div(_templateObject$1 || (_templateObject$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
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"])),
|
|
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 => {
|
|
3889
3987
|
let {
|
|
3890
3988
|
fontSettings
|
|
3891
3989
|
} = _ref;
|
|
3892
3990
|
return !!(fontSettings != null && fontSettings.fontFamily) && "font-family: " + fontSettings.fontFamily;
|
|
3893
|
-
},
|
|
3991
|
+
}, _ref2 => {
|
|
3894
3992
|
let {
|
|
3895
3993
|
fontSettings
|
|
3896
3994
|
} = _ref2;
|
|
3897
3995
|
return !!(fontSettings != null && fontSettings.fontWeight) && "font-weight: " + fontSettings.fontWeight;
|
|
3898
|
-
},
|
|
3996
|
+
}, _ref3 => {
|
|
3899
3997
|
let {
|
|
3900
3998
|
fontSettings
|
|
3901
3999
|
} = _ref3;
|
|
3902
4000
|
return !!(fontSettings != null && fontSettings.fontStyle) && "font-style: " + fontSettings.fontStyle;
|
|
3903
|
-
},
|
|
4001
|
+
}, _ref4 => {
|
|
3904
4002
|
let {
|
|
3905
4003
|
fontSettings
|
|
3906
4004
|
} = _ref4;
|
|
3907
4005
|
return !!(fontSettings != null && fontSettings.fontColor) && "color: " + fontSettings.fontColor;
|
|
3908
|
-
},
|
|
4006
|
+
}, _ref5 => {
|
|
3909
4007
|
let {
|
|
3910
4008
|
fontSettings
|
|
3911
4009
|
} = _ref5;
|
|
3912
4010
|
return !!(fontSettings != null && fontSettings.fontSize) && "font-size: " + (typeof fontSettings.fontSize === 'string' ? fontSettings.fontSize : fontSettings.fontSize + "px");
|
|
3913
|
-
},
|
|
4011
|
+
}, _ref6 => {
|
|
3914
4012
|
let {
|
|
3915
4013
|
fontSettings
|
|
3916
4014
|
} = _ref6;
|
|
3917
4015
|
return !!(fontSettings != null && fontSettings.haloColor) && !!(fontSettings != null && fontSettings.haloWidth) && "-webkit-text-stroke: " + fontSettings.haloWidth + "px " + fontSettings.haloColor + ";";
|
|
3918
4016
|
});
|
|
3919
|
-
const SvgSymbol = /*#__PURE__*/memo(
|
|
4017
|
+
const SvgSymbol = /*#__PURE__*/memo(_ref7 => {
|
|
3920
4018
|
let {
|
|
3921
4019
|
svg,
|
|
3922
4020
|
bg,
|
|
@@ -3967,7 +4065,7 @@ const SvgSymbol = /*#__PURE__*/memo((_ref7) => {
|
|
|
3967
4065
|
}, text)) : renderSymbol;
|
|
3968
4066
|
});
|
|
3969
4067
|
|
|
3970
|
-
const ClusterSymbolPreview =
|
|
4068
|
+
const ClusterSymbolPreview = _ref => {
|
|
3971
4069
|
var _symbol$fillColor$val, _symbol$labelSymbol;
|
|
3972
4070
|
|
|
3973
4071
|
let {
|
|
@@ -4004,7 +4102,7 @@ const ClusterSymbolPreview = (_ref) => {
|
|
|
4004
4102
|
});
|
|
4005
4103
|
};
|
|
4006
4104
|
|
|
4007
|
-
const SymbolByType =
|
|
4105
|
+
const SymbolByType = _ref => {
|
|
4008
4106
|
let {
|
|
4009
4107
|
type,
|
|
4010
4108
|
symbol,
|
|
@@ -4031,7 +4129,7 @@ const SymbolByType = (_ref) => {
|
|
|
4031
4129
|
}
|
|
4032
4130
|
};
|
|
4033
4131
|
|
|
4034
|
-
const LegendSymbolRenderer = /*#__PURE__*/memo(
|
|
4132
|
+
const LegendSymbolRenderer = /*#__PURE__*/memo(_ref => {
|
|
4035
4133
|
let {
|
|
4036
4134
|
symbol,
|
|
4037
4135
|
index
|
|
@@ -4053,7 +4151,7 @@ const LegendSymbolRenderer = /*#__PURE__*/memo((_ref) => {
|
|
|
4053
4151
|
});
|
|
4054
4152
|
});
|
|
4055
4153
|
|
|
4056
|
-
const LegendHeaderButtons =
|
|
4154
|
+
const LegendHeaderButtons = _ref => {
|
|
4057
4155
|
let {
|
|
4058
4156
|
layerName,
|
|
4059
4157
|
hasHiddenLegends,
|
|
@@ -4072,7 +4170,7 @@ const LegendHeaderButtons = (_ref) => {
|
|
|
4072
4170
|
const getConditionAttribute = (attributes, condition) => {
|
|
4073
4171
|
if (!condition) return null;
|
|
4074
4172
|
const attributeName = getAttributeNameFromCondition(condition);
|
|
4075
|
-
let attribute = attributes.find(
|
|
4173
|
+
let attribute = attributes.find(_ref => {
|
|
4076
4174
|
let {
|
|
4077
4175
|
name
|
|
4078
4176
|
} = _ref;
|
|
@@ -4105,7 +4203,7 @@ const renderColumn = (column, index) => {
|
|
|
4105
4203
|
}, dateTime[0], React.createElement(MapLegendDescription, null, dateTime[1])), index === 0 && React.createElement(ItemSeparator, null));
|
|
4106
4204
|
};
|
|
4107
4205
|
|
|
4108
|
-
const getLegendText =
|
|
4206
|
+
const getLegendText = _ref => {
|
|
4109
4207
|
let {
|
|
4110
4208
|
title,
|
|
4111
4209
|
index,
|
|
@@ -4138,7 +4236,7 @@ const getLegendText = (_ref) => {
|
|
|
4138
4236
|
|
|
4139
4237
|
const getLayerAttributes = layerDefinition => {
|
|
4140
4238
|
const attributes = layerDefinition && layerDefinition.attributes || {};
|
|
4141
|
-
return Object.entries(attributes).map(
|
|
4239
|
+
return Object.entries(attributes).map(_ref => {
|
|
4142
4240
|
let [name, definition] = _ref;
|
|
4143
4241
|
return _extends({
|
|
4144
4242
|
name
|
|
@@ -4146,7 +4244,7 @@ const getLayerAttributes = layerDefinition => {
|
|
|
4146
4244
|
});
|
|
4147
4245
|
};
|
|
4148
4246
|
|
|
4149
|
-
const LegendChildren =
|
|
4247
|
+
const LegendChildren = _ref => {
|
|
4150
4248
|
var _layerInfo$style, _layerInfo$style$chil;
|
|
4151
4249
|
|
|
4152
4250
|
let {
|
|
@@ -4186,7 +4284,7 @@ const LegendChildren = (_ref) => {
|
|
|
4186
4284
|
}));
|
|
4187
4285
|
};
|
|
4188
4286
|
|
|
4189
|
-
const LegendParameterDescription =
|
|
4287
|
+
const LegendParameterDescription = _ref => {
|
|
4190
4288
|
let {
|
|
4191
4289
|
parameter,
|
|
4192
4290
|
index
|
|
@@ -4214,7 +4312,7 @@ const getValueFromLegendTitle = (title, minOrMax) => {
|
|
|
4214
4312
|
return title.split(" ").find(isNumeric) || title || "";
|
|
4215
4313
|
};
|
|
4216
4314
|
|
|
4217
|
-
const MinimizedLegend =
|
|
4315
|
+
const MinimizedLegend = _ref => {
|
|
4218
4316
|
var _currentValues$, _currentValues, _currentValues$2, _currentValues2;
|
|
4219
4317
|
|
|
4220
4318
|
let {
|
|
@@ -4285,7 +4383,7 @@ const MinimizedLegend = (_ref) => {
|
|
|
4285
4383
|
})), 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, "-")));
|
|
4286
4384
|
};
|
|
4287
4385
|
|
|
4288
|
-
const MaximizedLegend =
|
|
4386
|
+
const MaximizedLegend = _ref => {
|
|
4289
4387
|
let {
|
|
4290
4388
|
innerRef,
|
|
4291
4389
|
isShown,
|
|
@@ -4345,70 +4443,7 @@ const MaximizedLegend = (_ref) => {
|
|
|
4345
4443
|
}, values.map(renderLegend));
|
|
4346
4444
|
};
|
|
4347
4445
|
|
|
4348
|
-
|
|
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) => {
|
|
4446
|
+
const LegendSection = _ref => {
|
|
4412
4447
|
var _hiddenLegends$layerN, _hiddenLegends$layerN2;
|
|
4413
4448
|
|
|
4414
4449
|
let {
|
|
@@ -4473,7 +4508,7 @@ const LegendSection = (_ref) => {
|
|
|
4473
4508
|
};
|
|
4474
4509
|
|
|
4475
4510
|
const _excluded$1 = ["layerInfo", "formatValue", "hiddenLegends", "toggleHiddenLegend", "clearHiddenLegends", "goToClassification"];
|
|
4476
|
-
const Legend = /*#__PURE__*/memo(
|
|
4511
|
+
const Legend = /*#__PURE__*/memo(_ref => {
|
|
4477
4512
|
var _layerInfo$style, _layerInfo$style$chil;
|
|
4478
4513
|
|
|
4479
4514
|
let {
|
|
@@ -4554,7 +4589,7 @@ const Legend = /*#__PURE__*/memo((_ref) => {
|
|
|
4554
4589
|
return React.createElement(MapLegendContainer, null, renderItems);
|
|
4555
4590
|
});
|
|
4556
4591
|
|
|
4557
|
-
const Symbol =
|
|
4592
|
+
const Symbol = _ref => {
|
|
4558
4593
|
let {
|
|
4559
4594
|
symbol,
|
|
4560
4595
|
size,
|
|
@@ -4575,19 +4610,19 @@ const Symbol = (_ref) => {
|
|
|
4575
4610
|
};
|
|
4576
4611
|
|
|
4577
4612
|
var _templateObject$2, _templateObject2$2;
|
|
4578
|
-
const CompoundIcon = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n height: 32px;\n width: 32px;\n"])),
|
|
4613
|
+
const CompoundIcon = /*#__PURE__*/styled.div(_templateObject$2 || (_templateObject$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: ", ";\n height: 32px;\n width: 32px;\n"])), _ref => {
|
|
4579
4614
|
let {
|
|
4580
4615
|
geometryType,
|
|
4581
4616
|
icons
|
|
4582
4617
|
} = _ref;
|
|
4583
4618
|
return "url(" + icons[geometryType] + ") center center / " + (geometryType === GeometryType.Polyline ? '2rem 1.3rem' : 'auto 1rem') + " no-repeat";
|
|
4584
4619
|
});
|
|
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"])),
|
|
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 => {
|
|
4586
4621
|
let {
|
|
4587
4622
|
color
|
|
4588
4623
|
} = _ref2;
|
|
4589
4624
|
return color;
|
|
4590
|
-
},
|
|
4625
|
+
}, _ref3 => {
|
|
4591
4626
|
let {
|
|
4592
4627
|
color
|
|
4593
4628
|
} = _ref3;
|
|
@@ -4595,7 +4630,7 @@ const ClusterSymbol = /*#__PURE__*/styled.div(_templateObject2$2 || (_templateOb
|
|
|
4595
4630
|
});
|
|
4596
4631
|
|
|
4597
4632
|
const MAX_SIZE = 32;
|
|
4598
|
-
const StyleSymbol =
|
|
4633
|
+
const StyleSymbol = _ref => {
|
|
4599
4634
|
let {
|
|
4600
4635
|
symbol,
|
|
4601
4636
|
size = MAX_SIZE,
|
|
@@ -4634,32 +4669,5 @@ const StyleSymbol = (_ref) => {
|
|
|
4634
4669
|
});
|
|
4635
4670
|
};
|
|
4636
4671
|
|
|
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
|
-
|
|
4664
4672
|
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 };
|
|
4665
4673
|
//# sourceMappingURL=react.esm.js.map
|