react-simple-maps 4.0.0-beta.5 → 4.0.0-beta.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +60 -99
- package/package.json +2 -2
- package/dist/index.es.js +0 -965
package/dist/index.js
CHANGED
|
@@ -1,32 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
var d3$1 = require('d3-selection');
|
|
8
|
-
var d3$2 = require('d3-zoom');
|
|
9
|
-
|
|
10
|
-
function _interopNamespaceDefault(e) {
|
|
11
|
-
var n = Object.create(null);
|
|
12
|
-
if (e) {
|
|
13
|
-
Object.keys(e).forEach(function (k) {
|
|
14
|
-
if (k !== 'default') {
|
|
15
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
16
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
17
|
-
enumerable: true,
|
|
18
|
-
get: function () { return e[k]; }
|
|
19
|
-
});
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
|
-
n.default = e;
|
|
24
|
-
return Object.freeze(n);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
var d3__namespace = /*#__PURE__*/_interopNamespaceDefault(d3);
|
|
28
|
-
var d3__namespace$1 = /*#__PURE__*/_interopNamespaceDefault(d3$1);
|
|
29
|
-
var d3__namespace$2 = /*#__PURE__*/_interopNamespaceDefault(d3$2);
|
|
1
|
+
import React, { createContext, useMemo, useCallback, useContext, forwardRef, useState, useEffect, memo, useRef, Fragment } from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import * as d3 from 'd3-geo';
|
|
4
|
+
import { feature, mesh } from 'topojson-client';
|
|
5
|
+
import * as d3$1 from 'd3-selection';
|
|
6
|
+
import * as d3$2 from 'd3-zoom';
|
|
30
7
|
|
|
31
8
|
function _iterableToArrayLimit(arr, i) {
|
|
32
9
|
var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
|
|
@@ -178,9 +155,9 @@ function _toPropertyKey(arg) {
|
|
|
178
155
|
}
|
|
179
156
|
|
|
180
157
|
var _excluded$a = ["width", "height", "projection", "projectionConfig"];
|
|
181
|
-
var geoPath =
|
|
182
|
-
projections = _objectWithoutProperties(
|
|
183
|
-
var MapContext =
|
|
158
|
+
var geoPath = d3.geoPath,
|
|
159
|
+
projections = _objectWithoutProperties(d3, ["geoPath"]);
|
|
160
|
+
var MapContext = createContext();
|
|
184
161
|
var makeProjection = function makeProjection(_ref) {
|
|
185
162
|
var _ref$projectionConfig = _ref.projectionConfig,
|
|
186
163
|
projectionConfig = _ref$projectionConfig === void 0 ? {} : _ref$projectionConfig,
|
|
@@ -220,7 +197,7 @@ var MapProvider = function MapProvider(_ref2) {
|
|
|
220
197
|
p1 = _ref8[0],
|
|
221
198
|
p2 = _ref8[1];
|
|
222
199
|
var s = projectionConfig.scale || null;
|
|
223
|
-
var projMemo =
|
|
200
|
+
var projMemo = useMemo(function () {
|
|
224
201
|
return makeProjection({
|
|
225
202
|
projectionConfig: {
|
|
226
203
|
center: cx || cx === 0 || cy || cy === 0 ? [cx, cy] : null,
|
|
@@ -233,8 +210,8 @@ var MapProvider = function MapProvider(_ref2) {
|
|
|
233
210
|
height: height
|
|
234
211
|
});
|
|
235
212
|
}, [width, height, projection, cx, cy, rx, ry, rz, p1, p2, s]);
|
|
236
|
-
var proj =
|
|
237
|
-
var value =
|
|
213
|
+
var proj = useCallback(projMemo, [projMemo]);
|
|
214
|
+
var value = useMemo(function () {
|
|
238
215
|
return {
|
|
239
216
|
width: width,
|
|
240
217
|
height: height,
|
|
@@ -253,11 +230,11 @@ MapProvider.propTypes = {
|
|
|
253
230
|
projectionConfig: PropTypes.object
|
|
254
231
|
};
|
|
255
232
|
var useMapContext = function useMapContext() {
|
|
256
|
-
return
|
|
233
|
+
return useContext(MapContext);
|
|
257
234
|
};
|
|
258
235
|
|
|
259
236
|
var _excluded$9 = ["width", "height", "projection", "projectionConfig", "className"];
|
|
260
|
-
var ComposableMap =
|
|
237
|
+
var ComposableMap = forwardRef(function (_ref, ref) {
|
|
261
238
|
var _ref$width = _ref.width,
|
|
262
239
|
width = _ref$width === void 0 ? 800 : _ref$width,
|
|
263
240
|
_ref$height = _ref.height,
|
|
@@ -290,7 +267,7 @@ ComposableMap.propTypes = {
|
|
|
290
267
|
};
|
|
291
268
|
|
|
292
269
|
function select(ref) {
|
|
293
|
-
return
|
|
270
|
+
return d3$1.select(ref);
|
|
294
271
|
}
|
|
295
272
|
function getCoords(w, h, t) {
|
|
296
273
|
var xOffset = (w * t.k - w) / 2;
|
|
@@ -312,16 +289,16 @@ function getFeatures(geographies, parseGeographies) {
|
|
|
312
289
|
if (!isTopojson) {
|
|
313
290
|
return parseGeographies ? parseGeographies(geographies.features || geographies) : geographies.features || geographies;
|
|
314
291
|
}
|
|
315
|
-
var feats =
|
|
292
|
+
var feats = feature(geographies, geographies.objects[Object.keys(geographies.objects)[0]]).features;
|
|
316
293
|
return parseGeographies ? parseGeographies(feats) : feats;
|
|
317
294
|
}
|
|
318
295
|
function getMesh(geographies) {
|
|
319
296
|
var isTopojson = geographies.type === "Topology";
|
|
320
297
|
if (!isTopojson) return null;
|
|
321
|
-
var outline =
|
|
298
|
+
var outline = mesh(geographies, geographies.objects[Object.keys(geographies.objects)[0]], function (a, b) {
|
|
322
299
|
return a === b;
|
|
323
300
|
});
|
|
324
|
-
var borders =
|
|
301
|
+
var borders = mesh(geographies, geographies.objects[Object.keys(geographies.objects)[0]], function (a, b) {
|
|
325
302
|
return a !== b;
|
|
326
303
|
});
|
|
327
304
|
return {
|
|
@@ -365,13 +342,13 @@ function isString(geo) {
|
|
|
365
342
|
function useGeographies(_ref) {
|
|
366
343
|
var geography = _ref.geography,
|
|
367
344
|
parseGeographies = _ref.parseGeographies;
|
|
368
|
-
var _useContext =
|
|
345
|
+
var _useContext = useContext(MapContext),
|
|
369
346
|
path = _useContext.path;
|
|
370
|
-
var _useState =
|
|
347
|
+
var _useState = useState({}),
|
|
371
348
|
_useState2 = _slicedToArray(_useState, 2),
|
|
372
349
|
output = _useState2[0],
|
|
373
350
|
setOutput = _useState2[1];
|
|
374
|
-
|
|
351
|
+
useEffect(function () {
|
|
375
352
|
if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === "undefined") return;
|
|
376
353
|
if (!geography) return;
|
|
377
354
|
if (isString(geography)) {
|
|
@@ -390,7 +367,7 @@ function useGeographies(_ref) {
|
|
|
390
367
|
});
|
|
391
368
|
}
|
|
392
369
|
}, [geography, parseGeographies]);
|
|
393
|
-
var _useMemo =
|
|
370
|
+
var _useMemo = useMemo(function () {
|
|
394
371
|
var mesh = output.mesh || {};
|
|
395
372
|
var preparedMesh = prepareMesh(mesh.outline, mesh.borders, path);
|
|
396
373
|
return {
|
|
@@ -410,14 +387,14 @@ function useGeographies(_ref) {
|
|
|
410
387
|
}
|
|
411
388
|
|
|
412
389
|
var _excluded$8 = ["geography", "children", "parseGeographies", "className"];
|
|
413
|
-
var Geographies =
|
|
390
|
+
var Geographies = forwardRef(function (_ref, ref) {
|
|
414
391
|
var geography = _ref.geography,
|
|
415
392
|
children = _ref.children,
|
|
416
393
|
parseGeographies = _ref.parseGeographies,
|
|
417
394
|
_ref$className = _ref.className,
|
|
418
395
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
419
396
|
restProps = _objectWithoutProperties(_ref, _excluded$8);
|
|
420
|
-
var _useContext =
|
|
397
|
+
var _useContext = useContext(MapContext),
|
|
421
398
|
path = _useContext.path,
|
|
422
399
|
projection = _useContext.projection;
|
|
423
400
|
var _useGeographies = useGeographies({
|
|
@@ -447,7 +424,7 @@ Geographies.propTypes = {
|
|
|
447
424
|
};
|
|
448
425
|
|
|
449
426
|
var _excluded$7 = ["geography", "onMouseEnter", "onMouseLeave", "onMouseDown", "onMouseUp", "onFocus", "onBlur", "style", "className"];
|
|
450
|
-
var Geography =
|
|
427
|
+
var Geography = forwardRef(function (_ref, ref) {
|
|
451
428
|
var geography = _ref.geography,
|
|
452
429
|
onMouseEnter = _ref.onMouseEnter,
|
|
453
430
|
onMouseLeave = _ref.onMouseLeave,
|
|
@@ -460,11 +437,11 @@ var Geography = React.forwardRef(function (_ref, ref) {
|
|
|
460
437
|
_ref$className = _ref.className,
|
|
461
438
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
462
439
|
restProps = _objectWithoutProperties(_ref, _excluded$7);
|
|
463
|
-
var _useState =
|
|
440
|
+
var _useState = useState(false),
|
|
464
441
|
_useState2 = _slicedToArray(_useState, 2),
|
|
465
442
|
isPressed = _useState2[0],
|
|
466
443
|
setPressed = _useState2[1];
|
|
467
|
-
var _useState3 =
|
|
444
|
+
var _useState3 = useState(false),
|
|
468
445
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
469
446
|
isFocused = _useState4[0],
|
|
470
447
|
setFocus = _useState4[1];
|
|
@@ -520,10 +497,10 @@ Geography.propTypes = {
|
|
|
520
497
|
style: PropTypes.object,
|
|
521
498
|
className: PropTypes.string
|
|
522
499
|
};
|
|
523
|
-
var Geography$1 =
|
|
500
|
+
var Geography$1 = memo(Geography);
|
|
524
501
|
|
|
525
502
|
var _excluded$6 = ["fill", "stroke", "step", "className"];
|
|
526
|
-
var Graticule =
|
|
503
|
+
var Graticule = forwardRef(function (_ref, ref) {
|
|
527
504
|
var _ref$fill = _ref.fill,
|
|
528
505
|
fill = _ref$fill === void 0 ? "transparent" : _ref$fill,
|
|
529
506
|
_ref$stroke = _ref.stroke,
|
|
@@ -533,11 +510,11 @@ var Graticule = React.forwardRef(function (_ref, ref) {
|
|
|
533
510
|
_ref$className = _ref.className,
|
|
534
511
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
535
512
|
restProps = _objectWithoutProperties(_ref, _excluded$6);
|
|
536
|
-
var _useContext =
|
|
513
|
+
var _useContext = useContext(MapContext),
|
|
537
514
|
path = _useContext.path;
|
|
538
515
|
return /*#__PURE__*/React.createElement("path", _extends({
|
|
539
516
|
ref: ref,
|
|
540
|
-
d: path(
|
|
517
|
+
d: path(d3.geoGraticule().step(step)()),
|
|
541
518
|
fill: fill,
|
|
542
519
|
stroke: stroke,
|
|
543
520
|
className: "rsm-graticule ".concat(className)
|
|
@@ -550,10 +527,10 @@ Graticule.propTypes = {
|
|
|
550
527
|
step: PropTypes.array,
|
|
551
528
|
className: PropTypes.string
|
|
552
529
|
};
|
|
553
|
-
var Graticule$1 =
|
|
530
|
+
var Graticule$1 = memo(Graticule);
|
|
554
531
|
|
|
555
532
|
var _excluded$5 = ["value"];
|
|
556
|
-
var ZoomPanContext =
|
|
533
|
+
var ZoomPanContext = createContext();
|
|
557
534
|
var defaultValue = {
|
|
558
535
|
x: 0,
|
|
559
536
|
y: 0,
|
|
@@ -575,7 +552,7 @@ ZoomPanProvider.propTypes = {
|
|
|
575
552
|
transformString: PropTypes.string
|
|
576
553
|
};
|
|
577
554
|
var useZoomPanContext = function useZoomPanContext() {
|
|
578
|
-
return
|
|
555
|
+
return useContext(ZoomPanContext);
|
|
579
556
|
};
|
|
580
557
|
|
|
581
558
|
function useZoomPan(_ref) {
|
|
@@ -590,14 +567,14 @@ function useZoomPan(_ref) {
|
|
|
590
567
|
scaleExtent = _ref$scaleExtent === void 0 ? [1, 8] : _ref$scaleExtent,
|
|
591
568
|
_ref$zoom = _ref.zoom,
|
|
592
569
|
zoom = _ref$zoom === void 0 ? 1 : _ref$zoom;
|
|
593
|
-
var _useContext =
|
|
570
|
+
var _useContext = useContext(MapContext),
|
|
594
571
|
width = _useContext.width,
|
|
595
572
|
height = _useContext.height,
|
|
596
573
|
projection = _useContext.projection;
|
|
597
574
|
var _center = _slicedToArray(center, 2),
|
|
598
575
|
lon = _center[0],
|
|
599
576
|
lat = _center[1];
|
|
600
|
-
var _useState =
|
|
577
|
+
var _useState = useState({
|
|
601
578
|
x: 0,
|
|
602
579
|
y: 0,
|
|
603
580
|
k: 1
|
|
@@ -605,14 +582,14 @@ function useZoomPan(_ref) {
|
|
|
605
582
|
_useState2 = _slicedToArray(_useState, 2),
|
|
606
583
|
position = _useState2[0],
|
|
607
584
|
setPosition = _useState2[1];
|
|
608
|
-
var lastPosition =
|
|
585
|
+
var lastPosition = useRef({
|
|
609
586
|
x: 0,
|
|
610
587
|
y: 0,
|
|
611
588
|
k: 1
|
|
612
589
|
});
|
|
613
|
-
var mapRef =
|
|
614
|
-
var zoomRef =
|
|
615
|
-
var bypassEvents =
|
|
590
|
+
var mapRef = useRef();
|
|
591
|
+
var zoomRef = useRef();
|
|
592
|
+
var bypassEvents = useRef(false);
|
|
616
593
|
var _translateExtent = _slicedToArray(translateExtent, 2),
|
|
617
594
|
a = _translateExtent[0],
|
|
618
595
|
b = _translateExtent[1];
|
|
@@ -625,7 +602,7 @@ function useZoomPan(_ref) {
|
|
|
625
602
|
var _scaleExtent = _slicedToArray(scaleExtent, 2),
|
|
626
603
|
minZoom = _scaleExtent[0],
|
|
627
604
|
maxZoom = _scaleExtent[1];
|
|
628
|
-
|
|
605
|
+
useEffect(function () {
|
|
629
606
|
var svg = select(mapRef.current);
|
|
630
607
|
function handleZoomStart(d3Event) {
|
|
631
608
|
if (!onMoveStart || bypassEvents.current) return;
|
|
@@ -678,18 +655,18 @@ function useZoomPan(_ref) {
|
|
|
678
655
|
}
|
|
679
656
|
return d3Event ? !d3Event.ctrlKey && !d3Event.button : false;
|
|
680
657
|
}
|
|
681
|
-
var zoom =
|
|
658
|
+
var zoom = d3$2.zoom().filter(filterFunc).scaleExtent([minZoom, maxZoom]).translateExtent([[a1, a2], [b1, b2]]).on("start", handleZoomStart).on("zoom", handleZoom).on("end", handleZoomEnd);
|
|
682
659
|
zoomRef.current = zoom;
|
|
683
660
|
svg.call(zoom);
|
|
684
661
|
}, [width, height, a1, a2, b1, b2, minZoom, maxZoom, projection, onMoveStart, onMove, onMoveEnd, filterZoomEvent]);
|
|
685
|
-
|
|
662
|
+
useEffect(function () {
|
|
686
663
|
if (lon === lastPosition.current.x && lat === lastPosition.current.y && zoom === lastPosition.current.k) return;
|
|
687
664
|
var coords = projection([lon, lat]);
|
|
688
665
|
var x = coords[0] * zoom;
|
|
689
666
|
var y = coords[1] * zoom;
|
|
690
667
|
var svg = select(mapRef.current);
|
|
691
668
|
bypassEvents.current = true;
|
|
692
|
-
svg.call(zoomRef.current.transform,
|
|
669
|
+
svg.call(zoomRef.current.transform, d3$2.zoomIdentity.translate(width / 2 - x, height / 2 - y).scale(zoom));
|
|
693
670
|
setPosition({
|
|
694
671
|
x: width / 2 - x,
|
|
695
672
|
y: height / 2 - y,
|
|
@@ -709,7 +686,7 @@ function useZoomPan(_ref) {
|
|
|
709
686
|
}
|
|
710
687
|
|
|
711
688
|
var _excluded$4 = ["center", "zoom", "minZoom", "maxZoom", "translateExtent", "filterZoomEvent", "onMoveStart", "onMove", "onMoveEnd", "className"];
|
|
712
|
-
var ZoomableGroup =
|
|
689
|
+
var ZoomableGroup = forwardRef(function (_ref, ref) {
|
|
713
690
|
var _ref$center = _ref.center,
|
|
714
691
|
center = _ref$center === void 0 ? [0, 0] : _ref$center,
|
|
715
692
|
_ref$zoom = _ref.zoom,
|
|
@@ -725,7 +702,7 @@ var ZoomableGroup = React.forwardRef(function (_ref, ref) {
|
|
|
725
702
|
onMoveEnd = _ref.onMoveEnd,
|
|
726
703
|
className = _ref.className,
|
|
727
704
|
restProps = _objectWithoutProperties(_ref, _excluded$4);
|
|
728
|
-
var _useContext =
|
|
705
|
+
var _useContext = useContext(MapContext),
|
|
729
706
|
width = _useContext.width,
|
|
730
707
|
height = _useContext.height;
|
|
731
708
|
var _useZoomPan = useZoomPan({
|
|
@@ -774,7 +751,7 @@ ZoomableGroup.propTypes = {
|
|
|
774
751
|
};
|
|
775
752
|
|
|
776
753
|
var _excluded$3 = ["id", "fill", "stroke", "strokeWidth", "className"];
|
|
777
|
-
var Sphere =
|
|
754
|
+
var Sphere = forwardRef(function (_ref, ref) {
|
|
778
755
|
var _ref$id = _ref.id,
|
|
779
756
|
id = _ref$id === void 0 ? "rsm-sphere" : _ref$id,
|
|
780
757
|
_ref$fill = _ref.fill,
|
|
@@ -786,14 +763,14 @@ var Sphere = React.forwardRef(function (_ref, ref) {
|
|
|
786
763
|
_ref$className = _ref.className,
|
|
787
764
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
788
765
|
restProps = _objectWithoutProperties(_ref, _excluded$3);
|
|
789
|
-
var _useContext =
|
|
766
|
+
var _useContext = useContext(MapContext),
|
|
790
767
|
path = _useContext.path;
|
|
791
|
-
var spherePath =
|
|
768
|
+
var spherePath = useMemo(function () {
|
|
792
769
|
return path({
|
|
793
770
|
type: "Sphere"
|
|
794
771
|
});
|
|
795
772
|
}, [path]);
|
|
796
|
-
return /*#__PURE__*/React.createElement(
|
|
773
|
+
return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
|
|
797
774
|
id: id
|
|
798
775
|
}, /*#__PURE__*/React.createElement("path", {
|
|
799
776
|
d: spherePath
|
|
@@ -817,10 +794,10 @@ Sphere.propTypes = {
|
|
|
817
794
|
strokeWidth: PropTypes.number,
|
|
818
795
|
className: PropTypes.string
|
|
819
796
|
};
|
|
820
|
-
var Sphere$1 =
|
|
797
|
+
var Sphere$1 = memo(Sphere);
|
|
821
798
|
|
|
822
799
|
var _excluded$2 = ["coordinates", "children", "onMouseEnter", "onMouseLeave", "onMouseDown", "onMouseUp", "onFocus", "onBlur", "style", "className"];
|
|
823
|
-
var Marker =
|
|
800
|
+
var Marker = forwardRef(function (_ref, ref) {
|
|
824
801
|
var coordinates = _ref.coordinates,
|
|
825
802
|
children = _ref.children,
|
|
826
803
|
onMouseEnter = _ref.onMouseEnter,
|
|
@@ -834,13 +811,13 @@ var Marker = React.forwardRef(function (_ref, ref) {
|
|
|
834
811
|
_ref$className = _ref.className,
|
|
835
812
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
836
813
|
restProps = _objectWithoutProperties(_ref, _excluded$2);
|
|
837
|
-
var _useContext =
|
|
814
|
+
var _useContext = useContext(MapContext),
|
|
838
815
|
projection = _useContext.projection;
|
|
839
|
-
var _useState =
|
|
816
|
+
var _useState = useState(false),
|
|
840
817
|
_useState2 = _slicedToArray(_useState, 2),
|
|
841
818
|
isPressed = _useState2[0],
|
|
842
819
|
setPressed = _useState2[1];
|
|
843
|
-
var _useState3 =
|
|
820
|
+
var _useState3 = useState(false),
|
|
844
821
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
845
822
|
isFocused = _useState4[0],
|
|
846
823
|
setFocus = _useState4[1];
|
|
@@ -902,7 +879,7 @@ Marker.propTypes = {
|
|
|
902
879
|
};
|
|
903
880
|
|
|
904
881
|
var _excluded$1 = ["from", "to", "coordinates", "stroke", "strokeWidth", "fill", "className"];
|
|
905
|
-
var Line =
|
|
882
|
+
var Line = forwardRef(function (_ref, ref) {
|
|
906
883
|
var _ref$from = _ref.from,
|
|
907
884
|
from = _ref$from === void 0 ? [0, 0] : _ref$from,
|
|
908
885
|
_ref$to = _ref.to,
|
|
@@ -917,7 +894,7 @@ var Line = React.forwardRef(function (_ref, ref) {
|
|
|
917
894
|
_ref$className = _ref.className,
|
|
918
895
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
919
896
|
restProps = _objectWithoutProperties(_ref, _excluded$1);
|
|
920
|
-
var _useContext =
|
|
897
|
+
var _useContext = useContext(MapContext),
|
|
921
898
|
path = _useContext.path;
|
|
922
899
|
var lineData = {
|
|
923
900
|
type: "LineString",
|
|
@@ -944,7 +921,7 @@ Line.propTypes = {
|
|
|
944
921
|
};
|
|
945
922
|
|
|
946
923
|
var _excluded = ["subject", "children", "connectorProps", "dx", "dy", "curve", "className"];
|
|
947
|
-
var Annotation =
|
|
924
|
+
var Annotation = forwardRef(function (_ref, ref) {
|
|
948
925
|
var subject = _ref.subject,
|
|
949
926
|
children = _ref.children,
|
|
950
927
|
connectorProps = _ref.connectorProps,
|
|
@@ -957,7 +934,7 @@ var Annotation = React.forwardRef(function (_ref, ref) {
|
|
|
957
934
|
_ref$className = _ref.className,
|
|
958
935
|
className = _ref$className === void 0 ? "" : _ref$className,
|
|
959
936
|
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
960
|
-
var _useContext =
|
|
937
|
+
var _useContext = useContext(MapContext),
|
|
961
938
|
projection = _useContext.projection;
|
|
962
939
|
var _projection = projection(subject),
|
|
963
940
|
_projection2 = _slicedToArray(_projection, 2),
|
|
@@ -985,20 +962,4 @@ Annotation.propTypes = {
|
|
|
985
962
|
className: PropTypes.string
|
|
986
963
|
};
|
|
987
964
|
|
|
988
|
-
|
|
989
|
-
exports.ComposableMap = ComposableMap;
|
|
990
|
-
exports.Geographies = Geographies;
|
|
991
|
-
exports.Geography = Geography$1;
|
|
992
|
-
exports.Graticule = Graticule$1;
|
|
993
|
-
exports.Line = Line;
|
|
994
|
-
exports.MapContext = MapContext;
|
|
995
|
-
exports.MapProvider = MapProvider;
|
|
996
|
-
exports.Marker = Marker;
|
|
997
|
-
exports.Sphere = Sphere$1;
|
|
998
|
-
exports.ZoomPanContext = ZoomPanContext;
|
|
999
|
-
exports.ZoomPanProvider = ZoomPanProvider;
|
|
1000
|
-
exports.ZoomableGroup = ZoomableGroup;
|
|
1001
|
-
exports.useGeographies = useGeographies;
|
|
1002
|
-
exports.useMapContext = useMapContext;
|
|
1003
|
-
exports.useZoomPan = useZoomPan;
|
|
1004
|
-
exports.useZoomPanContext = useZoomPanContext;
|
|
965
|
+
export { Annotation, ComposableMap, Geographies, Geography$1 as Geography, Graticule$1 as Graticule, Line, MapContext, MapProvider, Marker, Sphere$1 as Sphere, ZoomPanContext, ZoomPanProvider, ZoomableGroup, useGeographies, useMapContext, useZoomPan, useZoomPanContext };
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-simple-maps",
|
|
3
|
-
"version": "4.0.0-beta.
|
|
3
|
+
"version": "4.0.0-beta.6",
|
|
4
4
|
"description": "An svg map chart component built with and for React",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
|
-
"module": "dist/index.
|
|
6
|
+
"module": "dist/index.js",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"files": [
|
|
9
9
|
"dist"
|
package/dist/index.es.js
DELETED
|
@@ -1,965 +0,0 @@
|
|
|
1
|
-
import React, { createContext, useMemo, useCallback, useContext, forwardRef, useState, useEffect, memo, useRef, Fragment } from 'react';
|
|
2
|
-
import PropTypes from 'prop-types';
|
|
3
|
-
import * as d3 from 'd3-geo';
|
|
4
|
-
import { feature, mesh } from 'topojson-client';
|
|
5
|
-
import * as d3$1 from 'd3-selection';
|
|
6
|
-
import * as d3$2 from 'd3-zoom';
|
|
7
|
-
|
|
8
|
-
function _iterableToArrayLimit(arr, i) {
|
|
9
|
-
var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
|
|
10
|
-
if (null != _i) {
|
|
11
|
-
var _s,
|
|
12
|
-
_e,
|
|
13
|
-
_x,
|
|
14
|
-
_r,
|
|
15
|
-
_arr = [],
|
|
16
|
-
_n = !0,
|
|
17
|
-
_d = !1;
|
|
18
|
-
try {
|
|
19
|
-
if (_x = (_i = _i.call(arr)).next, 0 === i) {
|
|
20
|
-
if (Object(_i) !== _i) return;
|
|
21
|
-
_n = !1;
|
|
22
|
-
} else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
|
|
23
|
-
} catch (err) {
|
|
24
|
-
_d = !0, _e = err;
|
|
25
|
-
} finally {
|
|
26
|
-
try {
|
|
27
|
-
if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return;
|
|
28
|
-
} finally {
|
|
29
|
-
if (_d) throw _e;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
return _arr;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
function ownKeys(object, enumerableOnly) {
|
|
36
|
-
var keys = Object.keys(object);
|
|
37
|
-
if (Object.getOwnPropertySymbols) {
|
|
38
|
-
var symbols = Object.getOwnPropertySymbols(object);
|
|
39
|
-
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
40
|
-
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
41
|
-
})), keys.push.apply(keys, symbols);
|
|
42
|
-
}
|
|
43
|
-
return keys;
|
|
44
|
-
}
|
|
45
|
-
function _objectSpread2(target) {
|
|
46
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
47
|
-
var source = null != arguments[i] ? arguments[i] : {};
|
|
48
|
-
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
49
|
-
_defineProperty(target, key, source[key]);
|
|
50
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
51
|
-
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
52
|
-
});
|
|
53
|
-
}
|
|
54
|
-
return target;
|
|
55
|
-
}
|
|
56
|
-
function _typeof(obj) {
|
|
57
|
-
"@babel/helpers - typeof";
|
|
58
|
-
|
|
59
|
-
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
|
|
60
|
-
return typeof obj;
|
|
61
|
-
} : function (obj) {
|
|
62
|
-
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
|
63
|
-
}, _typeof(obj);
|
|
64
|
-
}
|
|
65
|
-
function _defineProperty(obj, key, value) {
|
|
66
|
-
key = _toPropertyKey(key);
|
|
67
|
-
if (key in obj) {
|
|
68
|
-
Object.defineProperty(obj, key, {
|
|
69
|
-
value: value,
|
|
70
|
-
enumerable: true,
|
|
71
|
-
configurable: true,
|
|
72
|
-
writable: true
|
|
73
|
-
});
|
|
74
|
-
} else {
|
|
75
|
-
obj[key] = value;
|
|
76
|
-
}
|
|
77
|
-
return obj;
|
|
78
|
-
}
|
|
79
|
-
function _extends() {
|
|
80
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
81
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
82
|
-
var source = arguments[i];
|
|
83
|
-
for (var key in source) {
|
|
84
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
85
|
-
target[key] = source[key];
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
return target;
|
|
90
|
-
};
|
|
91
|
-
return _extends.apply(this, arguments);
|
|
92
|
-
}
|
|
93
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
94
|
-
if (source == null) return {};
|
|
95
|
-
var target = {};
|
|
96
|
-
var sourceKeys = Object.keys(source);
|
|
97
|
-
var key, i;
|
|
98
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
99
|
-
key = sourceKeys[i];
|
|
100
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
101
|
-
target[key] = source[key];
|
|
102
|
-
}
|
|
103
|
-
return target;
|
|
104
|
-
}
|
|
105
|
-
function _objectWithoutProperties(source, excluded) {
|
|
106
|
-
if (source == null) return {};
|
|
107
|
-
var target = _objectWithoutPropertiesLoose(source, excluded);
|
|
108
|
-
var key, i;
|
|
109
|
-
if (Object.getOwnPropertySymbols) {
|
|
110
|
-
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
111
|
-
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
112
|
-
key = sourceSymbolKeys[i];
|
|
113
|
-
if (excluded.indexOf(key) >= 0) continue;
|
|
114
|
-
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
115
|
-
target[key] = source[key];
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
return target;
|
|
119
|
-
}
|
|
120
|
-
function _slicedToArray(arr, i) {
|
|
121
|
-
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
|
|
122
|
-
}
|
|
123
|
-
function _arrayWithHoles(arr) {
|
|
124
|
-
if (Array.isArray(arr)) return arr;
|
|
125
|
-
}
|
|
126
|
-
function _unsupportedIterableToArray(o, minLen) {
|
|
127
|
-
if (!o) return;
|
|
128
|
-
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
129
|
-
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
130
|
-
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
131
|
-
if (n === "Map" || n === "Set") return Array.from(o);
|
|
132
|
-
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
133
|
-
}
|
|
134
|
-
function _arrayLikeToArray(arr, len) {
|
|
135
|
-
if (len == null || len > arr.length) len = arr.length;
|
|
136
|
-
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
137
|
-
return arr2;
|
|
138
|
-
}
|
|
139
|
-
function _nonIterableRest() {
|
|
140
|
-
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
141
|
-
}
|
|
142
|
-
function _toPrimitive(input, hint) {
|
|
143
|
-
if (typeof input !== "object" || input === null) return input;
|
|
144
|
-
var prim = input[Symbol.toPrimitive];
|
|
145
|
-
if (prim !== undefined) {
|
|
146
|
-
var res = prim.call(input, hint || "default");
|
|
147
|
-
if (typeof res !== "object") return res;
|
|
148
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
149
|
-
}
|
|
150
|
-
return (hint === "string" ? String : Number)(input);
|
|
151
|
-
}
|
|
152
|
-
function _toPropertyKey(arg) {
|
|
153
|
-
var key = _toPrimitive(arg, "string");
|
|
154
|
-
return typeof key === "symbol" ? key : String(key);
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
var _excluded$a = ["width", "height", "projection", "projectionConfig"];
|
|
158
|
-
var geoPath = d3.geoPath,
|
|
159
|
-
projections = _objectWithoutProperties(d3, ["geoPath"]);
|
|
160
|
-
var MapContext = createContext();
|
|
161
|
-
var makeProjection = function makeProjection(_ref) {
|
|
162
|
-
var _ref$projectionConfig = _ref.projectionConfig,
|
|
163
|
-
projectionConfig = _ref$projectionConfig === void 0 ? {} : _ref$projectionConfig,
|
|
164
|
-
_ref$projection = _ref.projection,
|
|
165
|
-
projection = _ref$projection === void 0 ? "geoEqualEarth" : _ref$projection,
|
|
166
|
-
_ref$width = _ref.width,
|
|
167
|
-
width = _ref$width === void 0 ? 800 : _ref$width,
|
|
168
|
-
_ref$height = _ref.height,
|
|
169
|
-
height = _ref$height === void 0 ? 600 : _ref$height;
|
|
170
|
-
var isFunc = typeof projection === "function";
|
|
171
|
-
if (isFunc) return projection;
|
|
172
|
-
var proj = projections[projection]().translate([width / 2, height / 2]);
|
|
173
|
-
var supported = [proj.center ? "center" : null, proj.rotate ? "rotate" : null, proj.scale ? "scale" : null, proj.parallels ? "parallels" : null];
|
|
174
|
-
supported.forEach(function (d) {
|
|
175
|
-
if (!d) return;
|
|
176
|
-
proj = proj[d](projectionConfig[d] || proj[d]());
|
|
177
|
-
});
|
|
178
|
-
return proj;
|
|
179
|
-
};
|
|
180
|
-
var MapProvider = function MapProvider(_ref2) {
|
|
181
|
-
var width = _ref2.width,
|
|
182
|
-
height = _ref2.height,
|
|
183
|
-
projection = _ref2.projection,
|
|
184
|
-
projectionConfig = _ref2.projectionConfig,
|
|
185
|
-
restProps = _objectWithoutProperties(_ref2, _excluded$a);
|
|
186
|
-
var _ref3 = projectionConfig.center || [],
|
|
187
|
-
_ref4 = _slicedToArray(_ref3, 2),
|
|
188
|
-
cx = _ref4[0],
|
|
189
|
-
cy = _ref4[1];
|
|
190
|
-
var _ref5 = projectionConfig.rotate || [],
|
|
191
|
-
_ref6 = _slicedToArray(_ref5, 3),
|
|
192
|
-
rx = _ref6[0],
|
|
193
|
-
ry = _ref6[1],
|
|
194
|
-
rz = _ref6[2];
|
|
195
|
-
var _ref7 = projectionConfig.parallels || [],
|
|
196
|
-
_ref8 = _slicedToArray(_ref7, 2),
|
|
197
|
-
p1 = _ref8[0],
|
|
198
|
-
p2 = _ref8[1];
|
|
199
|
-
var s = projectionConfig.scale || null;
|
|
200
|
-
var projMemo = useMemo(function () {
|
|
201
|
-
return makeProjection({
|
|
202
|
-
projectionConfig: {
|
|
203
|
-
center: cx || cx === 0 || cy || cy === 0 ? [cx, cy] : null,
|
|
204
|
-
rotate: rx || rx === 0 || ry || ry === 0 ? [rx, ry, rz] : null,
|
|
205
|
-
parallels: p1 || p1 === 0 || p2 || p2 === 0 ? [p1, p2] : null,
|
|
206
|
-
scale: s
|
|
207
|
-
},
|
|
208
|
-
projection: projection,
|
|
209
|
-
width: width,
|
|
210
|
-
height: height
|
|
211
|
-
});
|
|
212
|
-
}, [width, height, projection, cx, cy, rx, ry, rz, p1, p2, s]);
|
|
213
|
-
var proj = useCallback(projMemo, [projMemo]);
|
|
214
|
-
var value = useMemo(function () {
|
|
215
|
-
return {
|
|
216
|
-
width: width,
|
|
217
|
-
height: height,
|
|
218
|
-
projection: proj,
|
|
219
|
-
path: geoPath().projection(proj)
|
|
220
|
-
};
|
|
221
|
-
}, [width, height, proj]);
|
|
222
|
-
return /*#__PURE__*/React.createElement(MapContext.Provider, _extends({
|
|
223
|
-
value: value
|
|
224
|
-
}, restProps));
|
|
225
|
-
};
|
|
226
|
-
MapProvider.propTypes = {
|
|
227
|
-
width: PropTypes.number,
|
|
228
|
-
height: PropTypes.number,
|
|
229
|
-
projection: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
|
|
230
|
-
projectionConfig: PropTypes.object
|
|
231
|
-
};
|
|
232
|
-
var useMapContext = function useMapContext() {
|
|
233
|
-
return useContext(MapContext);
|
|
234
|
-
};
|
|
235
|
-
|
|
236
|
-
var _excluded$9 = ["width", "height", "projection", "projectionConfig", "className"];
|
|
237
|
-
var ComposableMap = forwardRef(function (_ref, ref) {
|
|
238
|
-
var _ref$width = _ref.width,
|
|
239
|
-
width = _ref$width === void 0 ? 800 : _ref$width,
|
|
240
|
-
_ref$height = _ref.height,
|
|
241
|
-
height = _ref$height === void 0 ? 600 : _ref$height,
|
|
242
|
-
_ref$projection = _ref.projection,
|
|
243
|
-
projection = _ref$projection === void 0 ? "geoEqualEarth" : _ref$projection,
|
|
244
|
-
_ref$projectionConfig = _ref.projectionConfig,
|
|
245
|
-
projectionConfig = _ref$projectionConfig === void 0 ? {} : _ref$projectionConfig,
|
|
246
|
-
_ref$className = _ref.className,
|
|
247
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
248
|
-
restProps = _objectWithoutProperties(_ref, _excluded$9);
|
|
249
|
-
return /*#__PURE__*/React.createElement(MapProvider, {
|
|
250
|
-
width: width,
|
|
251
|
-
height: height,
|
|
252
|
-
projection: projection,
|
|
253
|
-
projectionConfig: projectionConfig
|
|
254
|
-
}, /*#__PURE__*/React.createElement("svg", _extends({
|
|
255
|
-
ref: ref,
|
|
256
|
-
viewBox: "0 0 ".concat(width, " ").concat(height),
|
|
257
|
-
className: "rsm-svg ".concat(className)
|
|
258
|
-
}, restProps)));
|
|
259
|
-
});
|
|
260
|
-
ComposableMap.displayName = "ComposableMap";
|
|
261
|
-
ComposableMap.propTypes = {
|
|
262
|
-
width: PropTypes.number,
|
|
263
|
-
height: PropTypes.number,
|
|
264
|
-
projection: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
|
|
265
|
-
projectionConfig: PropTypes.object,
|
|
266
|
-
className: PropTypes.string
|
|
267
|
-
};
|
|
268
|
-
|
|
269
|
-
function select(ref) {
|
|
270
|
-
return d3$1.select(ref);
|
|
271
|
-
}
|
|
272
|
-
function getCoords(w, h, t) {
|
|
273
|
-
var xOffset = (w * t.k - w) / 2;
|
|
274
|
-
var yOffset = (h * t.k - h) / 2;
|
|
275
|
-
return [w / 2 - (xOffset + t.x) / t.k, h / 2 - (yOffset + t.y) / t.k];
|
|
276
|
-
}
|
|
277
|
-
function fetchGeographies(url) {
|
|
278
|
-
return fetch(url).then(function (res) {
|
|
279
|
-
if (!res.ok) {
|
|
280
|
-
throw Error(res.statusText);
|
|
281
|
-
}
|
|
282
|
-
return res.json();
|
|
283
|
-
})["catch"](function (error) {
|
|
284
|
-
console.log("There was a problem when fetching the data: ", error);
|
|
285
|
-
});
|
|
286
|
-
}
|
|
287
|
-
function getFeatures(geographies, parseGeographies) {
|
|
288
|
-
var isTopojson = geographies.type === "Topology";
|
|
289
|
-
if (!isTopojson) {
|
|
290
|
-
return parseGeographies ? parseGeographies(geographies.features || geographies) : geographies.features || geographies;
|
|
291
|
-
}
|
|
292
|
-
var feats = feature(geographies, geographies.objects[Object.keys(geographies.objects)[0]]).features;
|
|
293
|
-
return parseGeographies ? parseGeographies(feats) : feats;
|
|
294
|
-
}
|
|
295
|
-
function getMesh(geographies) {
|
|
296
|
-
var isTopojson = geographies.type === "Topology";
|
|
297
|
-
if (!isTopojson) return null;
|
|
298
|
-
var outline = mesh(geographies, geographies.objects[Object.keys(geographies.objects)[0]], function (a, b) {
|
|
299
|
-
return a === b;
|
|
300
|
-
});
|
|
301
|
-
var borders = mesh(geographies, geographies.objects[Object.keys(geographies.objects)[0]], function (a, b) {
|
|
302
|
-
return a !== b;
|
|
303
|
-
});
|
|
304
|
-
return {
|
|
305
|
-
outline: outline,
|
|
306
|
-
borders: borders
|
|
307
|
-
};
|
|
308
|
-
}
|
|
309
|
-
function prepareMesh(outline, borders, path) {
|
|
310
|
-
return outline && borders ? {
|
|
311
|
-
outline: _objectSpread2(_objectSpread2({}, outline), {}, {
|
|
312
|
-
rsmKey: "outline",
|
|
313
|
-
svgPath: path(outline)
|
|
314
|
-
}),
|
|
315
|
-
borders: _objectSpread2(_objectSpread2({}, borders), {}, {
|
|
316
|
-
rsmKey: "borders",
|
|
317
|
-
svgPath: path(borders)
|
|
318
|
-
})
|
|
319
|
-
} : {};
|
|
320
|
-
}
|
|
321
|
-
function prepareFeatures(geographies, path) {
|
|
322
|
-
return geographies ? geographies.map(function (d, i) {
|
|
323
|
-
return _objectSpread2(_objectSpread2({}, d), {}, {
|
|
324
|
-
rsmKey: "geo-".concat(i),
|
|
325
|
-
svgPath: path(d)
|
|
326
|
-
});
|
|
327
|
-
}) : [];
|
|
328
|
-
}
|
|
329
|
-
function createConnectorPath() {
|
|
330
|
-
var dx = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 30;
|
|
331
|
-
var dy = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 30;
|
|
332
|
-
var curve = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0.5;
|
|
333
|
-
var curvature = Array.isArray(curve) ? curve : [curve, curve];
|
|
334
|
-
var curveX = dx / 2 * curvature[0];
|
|
335
|
-
var curveY = dy / 2 * curvature[1];
|
|
336
|
-
return "M".concat(0, ",", 0, " Q", -dx / 2 - curveX, ",").concat(-dy / 2 + curveY, " ").concat(-dx, ",").concat(-dy);
|
|
337
|
-
}
|
|
338
|
-
function isString(geo) {
|
|
339
|
-
return typeof geo === "string";
|
|
340
|
-
}
|
|
341
|
-
|
|
342
|
-
function useGeographies(_ref) {
|
|
343
|
-
var geography = _ref.geography,
|
|
344
|
-
parseGeographies = _ref.parseGeographies;
|
|
345
|
-
var _useContext = useContext(MapContext),
|
|
346
|
-
path = _useContext.path;
|
|
347
|
-
var _useState = useState({}),
|
|
348
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
349
|
-
output = _useState2[0],
|
|
350
|
-
setOutput = _useState2[1];
|
|
351
|
-
useEffect(function () {
|
|
352
|
-
if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === "undefined") return;
|
|
353
|
-
if (!geography) return;
|
|
354
|
-
if (isString(geography)) {
|
|
355
|
-
fetchGeographies(geography).then(function (geos) {
|
|
356
|
-
if (geos) {
|
|
357
|
-
setOutput({
|
|
358
|
-
geographies: getFeatures(geos, parseGeographies),
|
|
359
|
-
mesh: getMesh(geos)
|
|
360
|
-
});
|
|
361
|
-
}
|
|
362
|
-
});
|
|
363
|
-
} else {
|
|
364
|
-
setOutput({
|
|
365
|
-
geographies: getFeatures(geography, parseGeographies),
|
|
366
|
-
mesh: getMesh(geography)
|
|
367
|
-
});
|
|
368
|
-
}
|
|
369
|
-
}, [geography, parseGeographies]);
|
|
370
|
-
var _useMemo = useMemo(function () {
|
|
371
|
-
var mesh = output.mesh || {};
|
|
372
|
-
var preparedMesh = prepareMesh(mesh.outline, mesh.borders, path);
|
|
373
|
-
return {
|
|
374
|
-
geographies: prepareFeatures(output.geographies, path),
|
|
375
|
-
outline: preparedMesh.outline,
|
|
376
|
-
borders: preparedMesh.borders
|
|
377
|
-
};
|
|
378
|
-
}, [output, path]),
|
|
379
|
-
geographies = _useMemo.geographies,
|
|
380
|
-
outline = _useMemo.outline,
|
|
381
|
-
borders = _useMemo.borders;
|
|
382
|
-
return {
|
|
383
|
-
geographies: geographies,
|
|
384
|
-
outline: outline,
|
|
385
|
-
borders: borders
|
|
386
|
-
};
|
|
387
|
-
}
|
|
388
|
-
|
|
389
|
-
var _excluded$8 = ["geography", "children", "parseGeographies", "className"];
|
|
390
|
-
var Geographies = forwardRef(function (_ref, ref) {
|
|
391
|
-
var geography = _ref.geography,
|
|
392
|
-
children = _ref.children,
|
|
393
|
-
parseGeographies = _ref.parseGeographies,
|
|
394
|
-
_ref$className = _ref.className,
|
|
395
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
396
|
-
restProps = _objectWithoutProperties(_ref, _excluded$8);
|
|
397
|
-
var _useContext = useContext(MapContext),
|
|
398
|
-
path = _useContext.path,
|
|
399
|
-
projection = _useContext.projection;
|
|
400
|
-
var _useGeographies = useGeographies({
|
|
401
|
-
geography: geography,
|
|
402
|
-
parseGeographies: parseGeographies
|
|
403
|
-
}),
|
|
404
|
-
geographies = _useGeographies.geographies,
|
|
405
|
-
outline = _useGeographies.outline,
|
|
406
|
-
borders = _useGeographies.borders;
|
|
407
|
-
return /*#__PURE__*/React.createElement("g", _extends({
|
|
408
|
-
ref: ref,
|
|
409
|
-
className: "rsm-geographies ".concat(className)
|
|
410
|
-
}, restProps), geographies && geographies.length > 0 && children({
|
|
411
|
-
geographies: geographies,
|
|
412
|
-
outline: outline,
|
|
413
|
-
borders: borders,
|
|
414
|
-
path: path,
|
|
415
|
-
projection: projection
|
|
416
|
-
}));
|
|
417
|
-
});
|
|
418
|
-
Geographies.displayName = "Geographies";
|
|
419
|
-
Geographies.propTypes = {
|
|
420
|
-
geography: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.array]),
|
|
421
|
-
children: PropTypes.func,
|
|
422
|
-
parseGeographies: PropTypes.func,
|
|
423
|
-
className: PropTypes.string
|
|
424
|
-
};
|
|
425
|
-
|
|
426
|
-
var _excluded$7 = ["geography", "onMouseEnter", "onMouseLeave", "onMouseDown", "onMouseUp", "onFocus", "onBlur", "style", "className"];
|
|
427
|
-
var Geography = forwardRef(function (_ref, ref) {
|
|
428
|
-
var geography = _ref.geography,
|
|
429
|
-
onMouseEnter = _ref.onMouseEnter,
|
|
430
|
-
onMouseLeave = _ref.onMouseLeave,
|
|
431
|
-
onMouseDown = _ref.onMouseDown,
|
|
432
|
-
onMouseUp = _ref.onMouseUp,
|
|
433
|
-
onFocus = _ref.onFocus,
|
|
434
|
-
onBlur = _ref.onBlur,
|
|
435
|
-
_ref$style = _ref.style,
|
|
436
|
-
style = _ref$style === void 0 ? {} : _ref$style,
|
|
437
|
-
_ref$className = _ref.className,
|
|
438
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
439
|
-
restProps = _objectWithoutProperties(_ref, _excluded$7);
|
|
440
|
-
var _useState = useState(false),
|
|
441
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
442
|
-
isPressed = _useState2[0],
|
|
443
|
-
setPressed = _useState2[1];
|
|
444
|
-
var _useState3 = useState(false),
|
|
445
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
446
|
-
isFocused = _useState4[0],
|
|
447
|
-
setFocus = _useState4[1];
|
|
448
|
-
function handleMouseEnter(evt) {
|
|
449
|
-
setFocus(true);
|
|
450
|
-
if (onMouseEnter) onMouseEnter(evt);
|
|
451
|
-
}
|
|
452
|
-
function handleMouseLeave(evt) {
|
|
453
|
-
setFocus(false);
|
|
454
|
-
if (isPressed) setPressed(false);
|
|
455
|
-
if (onMouseLeave) onMouseLeave(evt);
|
|
456
|
-
}
|
|
457
|
-
function handleFocus(evt) {
|
|
458
|
-
setFocus(true);
|
|
459
|
-
if (onFocus) onFocus(evt);
|
|
460
|
-
}
|
|
461
|
-
function handleBlur(evt) {
|
|
462
|
-
setFocus(false);
|
|
463
|
-
if (isPressed) setPressed(false);
|
|
464
|
-
if (onBlur) onBlur(evt);
|
|
465
|
-
}
|
|
466
|
-
function handleMouseDown(evt) {
|
|
467
|
-
setPressed(true);
|
|
468
|
-
if (onMouseDown) onMouseDown(evt);
|
|
469
|
-
}
|
|
470
|
-
function handleMouseUp(evt) {
|
|
471
|
-
setPressed(false);
|
|
472
|
-
if (onMouseUp) onMouseUp(evt);
|
|
473
|
-
}
|
|
474
|
-
return /*#__PURE__*/React.createElement("path", _extends({
|
|
475
|
-
ref: ref,
|
|
476
|
-
tabIndex: "0",
|
|
477
|
-
className: "rsm-geography ".concat(className),
|
|
478
|
-
d: geography.svgPath,
|
|
479
|
-
onMouseEnter: handleMouseEnter,
|
|
480
|
-
onMouseLeave: handleMouseLeave,
|
|
481
|
-
onFocus: handleFocus,
|
|
482
|
-
onBlur: handleBlur,
|
|
483
|
-
onMouseDown: handleMouseDown,
|
|
484
|
-
onMouseUp: handleMouseUp,
|
|
485
|
-
style: style[isPressed || isFocused ? isPressed ? "pressed" : "hover" : "default"]
|
|
486
|
-
}, restProps));
|
|
487
|
-
});
|
|
488
|
-
Geography.displayName = "Geography";
|
|
489
|
-
Geography.propTypes = {
|
|
490
|
-
geography: PropTypes.object,
|
|
491
|
-
onMouseEnter: PropTypes.func,
|
|
492
|
-
onMouseLeave: PropTypes.func,
|
|
493
|
-
onMouseDown: PropTypes.func,
|
|
494
|
-
onMouseUp: PropTypes.func,
|
|
495
|
-
onFocus: PropTypes.func,
|
|
496
|
-
onBlur: PropTypes.func,
|
|
497
|
-
style: PropTypes.object,
|
|
498
|
-
className: PropTypes.string
|
|
499
|
-
};
|
|
500
|
-
var Geography$1 = memo(Geography);
|
|
501
|
-
|
|
502
|
-
var _excluded$6 = ["fill", "stroke", "step", "className"];
|
|
503
|
-
var Graticule = forwardRef(function (_ref, ref) {
|
|
504
|
-
var _ref$fill = _ref.fill,
|
|
505
|
-
fill = _ref$fill === void 0 ? "transparent" : _ref$fill,
|
|
506
|
-
_ref$stroke = _ref.stroke,
|
|
507
|
-
stroke = _ref$stroke === void 0 ? "currentcolor" : _ref$stroke,
|
|
508
|
-
_ref$step = _ref.step,
|
|
509
|
-
step = _ref$step === void 0 ? [10, 10] : _ref$step,
|
|
510
|
-
_ref$className = _ref.className,
|
|
511
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
512
|
-
restProps = _objectWithoutProperties(_ref, _excluded$6);
|
|
513
|
-
var _useContext = useContext(MapContext),
|
|
514
|
-
path = _useContext.path;
|
|
515
|
-
return /*#__PURE__*/React.createElement("path", _extends({
|
|
516
|
-
ref: ref,
|
|
517
|
-
d: path(d3.geoGraticule().step(step)()),
|
|
518
|
-
fill: fill,
|
|
519
|
-
stroke: stroke,
|
|
520
|
-
className: "rsm-graticule ".concat(className)
|
|
521
|
-
}, restProps));
|
|
522
|
-
});
|
|
523
|
-
Graticule.displayName = "Graticule";
|
|
524
|
-
Graticule.propTypes = {
|
|
525
|
-
fill: PropTypes.string,
|
|
526
|
-
stroke: PropTypes.string,
|
|
527
|
-
step: PropTypes.array,
|
|
528
|
-
className: PropTypes.string
|
|
529
|
-
};
|
|
530
|
-
var Graticule$1 = memo(Graticule);
|
|
531
|
-
|
|
532
|
-
var _excluded$5 = ["value"];
|
|
533
|
-
var ZoomPanContext = createContext();
|
|
534
|
-
var defaultValue = {
|
|
535
|
-
x: 0,
|
|
536
|
-
y: 0,
|
|
537
|
-
k: 1,
|
|
538
|
-
transformString: "translate(0 0) scale(1)"
|
|
539
|
-
};
|
|
540
|
-
var ZoomPanProvider = function ZoomPanProvider(_ref) {
|
|
541
|
-
var _ref$value = _ref.value,
|
|
542
|
-
value = _ref$value === void 0 ? defaultValue : _ref$value,
|
|
543
|
-
restProps = _objectWithoutProperties(_ref, _excluded$5);
|
|
544
|
-
return /*#__PURE__*/React.createElement(ZoomPanContext.Provider, _extends({
|
|
545
|
-
value: value
|
|
546
|
-
}, restProps));
|
|
547
|
-
};
|
|
548
|
-
ZoomPanProvider.propTypes = {
|
|
549
|
-
x: PropTypes.number,
|
|
550
|
-
y: PropTypes.number,
|
|
551
|
-
k: PropTypes.number,
|
|
552
|
-
transformString: PropTypes.string
|
|
553
|
-
};
|
|
554
|
-
var useZoomPanContext = function useZoomPanContext() {
|
|
555
|
-
return useContext(ZoomPanContext);
|
|
556
|
-
};
|
|
557
|
-
|
|
558
|
-
function useZoomPan(_ref) {
|
|
559
|
-
var center = _ref.center,
|
|
560
|
-
filterZoomEvent = _ref.filterZoomEvent,
|
|
561
|
-
onMoveStart = _ref.onMoveStart,
|
|
562
|
-
onMoveEnd = _ref.onMoveEnd,
|
|
563
|
-
onMove = _ref.onMove,
|
|
564
|
-
_ref$translateExtent = _ref.translateExtent,
|
|
565
|
-
translateExtent = _ref$translateExtent === void 0 ? [[-Infinity, -Infinity], [Infinity, Infinity]] : _ref$translateExtent,
|
|
566
|
-
_ref$scaleExtent = _ref.scaleExtent,
|
|
567
|
-
scaleExtent = _ref$scaleExtent === void 0 ? [1, 8] : _ref$scaleExtent,
|
|
568
|
-
_ref$zoom = _ref.zoom,
|
|
569
|
-
zoom = _ref$zoom === void 0 ? 1 : _ref$zoom;
|
|
570
|
-
var _useContext = useContext(MapContext),
|
|
571
|
-
width = _useContext.width,
|
|
572
|
-
height = _useContext.height,
|
|
573
|
-
projection = _useContext.projection;
|
|
574
|
-
var _center = _slicedToArray(center, 2),
|
|
575
|
-
lon = _center[0],
|
|
576
|
-
lat = _center[1];
|
|
577
|
-
var _useState = useState({
|
|
578
|
-
x: 0,
|
|
579
|
-
y: 0,
|
|
580
|
-
k: 1
|
|
581
|
-
}),
|
|
582
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
583
|
-
position = _useState2[0],
|
|
584
|
-
setPosition = _useState2[1];
|
|
585
|
-
var lastPosition = useRef({
|
|
586
|
-
x: 0,
|
|
587
|
-
y: 0,
|
|
588
|
-
k: 1
|
|
589
|
-
});
|
|
590
|
-
var mapRef = useRef();
|
|
591
|
-
var zoomRef = useRef();
|
|
592
|
-
var bypassEvents = useRef(false);
|
|
593
|
-
var _translateExtent = _slicedToArray(translateExtent, 2),
|
|
594
|
-
a = _translateExtent[0],
|
|
595
|
-
b = _translateExtent[1];
|
|
596
|
-
var _a = _slicedToArray(a, 2),
|
|
597
|
-
a1 = _a[0],
|
|
598
|
-
a2 = _a[1];
|
|
599
|
-
var _b = _slicedToArray(b, 2),
|
|
600
|
-
b1 = _b[0],
|
|
601
|
-
b2 = _b[1];
|
|
602
|
-
var _scaleExtent = _slicedToArray(scaleExtent, 2),
|
|
603
|
-
minZoom = _scaleExtent[0],
|
|
604
|
-
maxZoom = _scaleExtent[1];
|
|
605
|
-
useEffect(function () {
|
|
606
|
-
var svg = select(mapRef.current);
|
|
607
|
-
function handleZoomStart(d3Event) {
|
|
608
|
-
if (!onMoveStart || bypassEvents.current) return;
|
|
609
|
-
onMoveStart({
|
|
610
|
-
coordinates: projection.invert(getCoords(width, height, d3Event.transform)),
|
|
611
|
-
zoom: d3Event.transform.k
|
|
612
|
-
}, d3Event);
|
|
613
|
-
}
|
|
614
|
-
function handleZoom(d3Event) {
|
|
615
|
-
if (bypassEvents.current) return;
|
|
616
|
-
var transform = d3Event.transform,
|
|
617
|
-
sourceEvent = d3Event.sourceEvent;
|
|
618
|
-
setPosition({
|
|
619
|
-
x: transform.x,
|
|
620
|
-
y: transform.y,
|
|
621
|
-
k: transform.k,
|
|
622
|
-
dragging: sourceEvent
|
|
623
|
-
});
|
|
624
|
-
if (!onMove) return;
|
|
625
|
-
onMove({
|
|
626
|
-
x: transform.x,
|
|
627
|
-
y: transform.y,
|
|
628
|
-
zoom: transform.k,
|
|
629
|
-
dragging: sourceEvent
|
|
630
|
-
}, d3Event);
|
|
631
|
-
}
|
|
632
|
-
function handleZoomEnd(d3Event) {
|
|
633
|
-
if (bypassEvents.current) {
|
|
634
|
-
bypassEvents.current = false;
|
|
635
|
-
return;
|
|
636
|
-
}
|
|
637
|
-
var _projection$invert = projection.invert(getCoords(width, height, d3Event.transform)),
|
|
638
|
-
_projection$invert2 = _slicedToArray(_projection$invert, 2),
|
|
639
|
-
x = _projection$invert2[0],
|
|
640
|
-
y = _projection$invert2[1];
|
|
641
|
-
lastPosition.current = {
|
|
642
|
-
x: x,
|
|
643
|
-
y: y,
|
|
644
|
-
k: d3Event.transform.k
|
|
645
|
-
};
|
|
646
|
-
if (!onMoveEnd) return;
|
|
647
|
-
onMoveEnd({
|
|
648
|
-
coordinates: [x, y],
|
|
649
|
-
zoom: d3Event.transform.k
|
|
650
|
-
}, d3Event);
|
|
651
|
-
}
|
|
652
|
-
function filterFunc(d3Event) {
|
|
653
|
-
if (filterZoomEvent) {
|
|
654
|
-
return filterZoomEvent(d3Event);
|
|
655
|
-
}
|
|
656
|
-
return d3Event ? !d3Event.ctrlKey && !d3Event.button : false;
|
|
657
|
-
}
|
|
658
|
-
var zoom = d3$2.zoom().filter(filterFunc).scaleExtent([minZoom, maxZoom]).translateExtent([[a1, a2], [b1, b2]]).on("start", handleZoomStart).on("zoom", handleZoom).on("end", handleZoomEnd);
|
|
659
|
-
zoomRef.current = zoom;
|
|
660
|
-
svg.call(zoom);
|
|
661
|
-
}, [width, height, a1, a2, b1, b2, minZoom, maxZoom, projection, onMoveStart, onMove, onMoveEnd, filterZoomEvent]);
|
|
662
|
-
useEffect(function () {
|
|
663
|
-
if (lon === lastPosition.current.x && lat === lastPosition.current.y && zoom === lastPosition.current.k) return;
|
|
664
|
-
var coords = projection([lon, lat]);
|
|
665
|
-
var x = coords[0] * zoom;
|
|
666
|
-
var y = coords[1] * zoom;
|
|
667
|
-
var svg = select(mapRef.current);
|
|
668
|
-
bypassEvents.current = true;
|
|
669
|
-
svg.call(zoomRef.current.transform, d3$2.zoomIdentity.translate(width / 2 - x, height / 2 - y).scale(zoom));
|
|
670
|
-
setPosition({
|
|
671
|
-
x: width / 2 - x,
|
|
672
|
-
y: height / 2 - y,
|
|
673
|
-
k: zoom
|
|
674
|
-
});
|
|
675
|
-
lastPosition.current = {
|
|
676
|
-
x: lon,
|
|
677
|
-
y: lat,
|
|
678
|
-
k: zoom
|
|
679
|
-
};
|
|
680
|
-
}, [lon, lat, zoom, width, height, projection]);
|
|
681
|
-
return {
|
|
682
|
-
mapRef: mapRef,
|
|
683
|
-
position: position,
|
|
684
|
-
transformString: "translate(".concat(position.x, " ").concat(position.y, ") scale(").concat(position.k, ")")
|
|
685
|
-
};
|
|
686
|
-
}
|
|
687
|
-
|
|
688
|
-
var _excluded$4 = ["center", "zoom", "minZoom", "maxZoom", "translateExtent", "filterZoomEvent", "onMoveStart", "onMove", "onMoveEnd", "className"];
|
|
689
|
-
var ZoomableGroup = forwardRef(function (_ref, ref) {
|
|
690
|
-
var _ref$center = _ref.center,
|
|
691
|
-
center = _ref$center === void 0 ? [0, 0] : _ref$center,
|
|
692
|
-
_ref$zoom = _ref.zoom,
|
|
693
|
-
zoom = _ref$zoom === void 0 ? 1 : _ref$zoom,
|
|
694
|
-
_ref$minZoom = _ref.minZoom,
|
|
695
|
-
minZoom = _ref$minZoom === void 0 ? 1 : _ref$minZoom,
|
|
696
|
-
_ref$maxZoom = _ref.maxZoom,
|
|
697
|
-
maxZoom = _ref$maxZoom === void 0 ? 8 : _ref$maxZoom,
|
|
698
|
-
translateExtent = _ref.translateExtent,
|
|
699
|
-
filterZoomEvent = _ref.filterZoomEvent,
|
|
700
|
-
onMoveStart = _ref.onMoveStart,
|
|
701
|
-
onMove = _ref.onMove,
|
|
702
|
-
onMoveEnd = _ref.onMoveEnd,
|
|
703
|
-
className = _ref.className,
|
|
704
|
-
restProps = _objectWithoutProperties(_ref, _excluded$4);
|
|
705
|
-
var _useContext = useContext(MapContext),
|
|
706
|
-
width = _useContext.width,
|
|
707
|
-
height = _useContext.height;
|
|
708
|
-
var _useZoomPan = useZoomPan({
|
|
709
|
-
center: center,
|
|
710
|
-
filterZoomEvent: filterZoomEvent,
|
|
711
|
-
onMoveStart: onMoveStart,
|
|
712
|
-
onMove: onMove,
|
|
713
|
-
onMoveEnd: onMoveEnd,
|
|
714
|
-
scaleExtent: [minZoom, maxZoom],
|
|
715
|
-
translateExtent: translateExtent,
|
|
716
|
-
zoom: zoom
|
|
717
|
-
}),
|
|
718
|
-
mapRef = _useZoomPan.mapRef,
|
|
719
|
-
transformString = _useZoomPan.transformString,
|
|
720
|
-
position = _useZoomPan.position;
|
|
721
|
-
return /*#__PURE__*/React.createElement(ZoomPanProvider, {
|
|
722
|
-
value: {
|
|
723
|
-
x: position.x,
|
|
724
|
-
y: position.y,
|
|
725
|
-
k: position.k,
|
|
726
|
-
transformString: transformString
|
|
727
|
-
}
|
|
728
|
-
}, /*#__PURE__*/React.createElement("g", {
|
|
729
|
-
ref: mapRef
|
|
730
|
-
}, /*#__PURE__*/React.createElement("rect", {
|
|
731
|
-
width: width,
|
|
732
|
-
height: height,
|
|
733
|
-
fill: "transparent"
|
|
734
|
-
}), /*#__PURE__*/React.createElement("g", _extends({
|
|
735
|
-
ref: ref,
|
|
736
|
-
transform: transformString,
|
|
737
|
-
className: "rsm-zoomable-group ".concat(className)
|
|
738
|
-
}, restProps))));
|
|
739
|
-
});
|
|
740
|
-
ZoomableGroup.displayName = "ZoomableGroup";
|
|
741
|
-
ZoomableGroup.propTypes = {
|
|
742
|
-
center: PropTypes.array,
|
|
743
|
-
zoom: PropTypes.number,
|
|
744
|
-
minZoom: PropTypes.number,
|
|
745
|
-
maxZoom: PropTypes.number,
|
|
746
|
-
translateExtent: PropTypes.arrayOf(PropTypes.array),
|
|
747
|
-
onMoveStart: PropTypes.func,
|
|
748
|
-
onMove: PropTypes.func,
|
|
749
|
-
onMoveEnd: PropTypes.func,
|
|
750
|
-
className: PropTypes.string
|
|
751
|
-
};
|
|
752
|
-
|
|
753
|
-
var _excluded$3 = ["id", "fill", "stroke", "strokeWidth", "className"];
|
|
754
|
-
var Sphere = forwardRef(function (_ref, ref) {
|
|
755
|
-
var _ref$id = _ref.id,
|
|
756
|
-
id = _ref$id === void 0 ? "rsm-sphere" : _ref$id,
|
|
757
|
-
_ref$fill = _ref.fill,
|
|
758
|
-
fill = _ref$fill === void 0 ? "transparent" : _ref$fill,
|
|
759
|
-
_ref$stroke = _ref.stroke,
|
|
760
|
-
stroke = _ref$stroke === void 0 ? "currentcolor" : _ref$stroke,
|
|
761
|
-
_ref$strokeWidth = _ref.strokeWidth,
|
|
762
|
-
strokeWidth = _ref$strokeWidth === void 0 ? 0.5 : _ref$strokeWidth,
|
|
763
|
-
_ref$className = _ref.className,
|
|
764
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
765
|
-
restProps = _objectWithoutProperties(_ref, _excluded$3);
|
|
766
|
-
var _useContext = useContext(MapContext),
|
|
767
|
-
path = _useContext.path;
|
|
768
|
-
var spherePath = useMemo(function () {
|
|
769
|
-
return path({
|
|
770
|
-
type: "Sphere"
|
|
771
|
-
});
|
|
772
|
-
}, [path]);
|
|
773
|
-
return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
|
|
774
|
-
id: id
|
|
775
|
-
}, /*#__PURE__*/React.createElement("path", {
|
|
776
|
-
d: spherePath
|
|
777
|
-
}))), /*#__PURE__*/React.createElement("path", _extends({
|
|
778
|
-
ref: ref,
|
|
779
|
-
d: spherePath,
|
|
780
|
-
fill: fill,
|
|
781
|
-
stroke: stroke,
|
|
782
|
-
strokeWidth: strokeWidth,
|
|
783
|
-
style: {
|
|
784
|
-
pointerEvents: "none"
|
|
785
|
-
},
|
|
786
|
-
className: "rsm-sphere ".concat(className)
|
|
787
|
-
}, restProps)));
|
|
788
|
-
});
|
|
789
|
-
Sphere.displayName = "Sphere";
|
|
790
|
-
Sphere.propTypes = {
|
|
791
|
-
id: PropTypes.string,
|
|
792
|
-
fill: PropTypes.string,
|
|
793
|
-
stroke: PropTypes.string,
|
|
794
|
-
strokeWidth: PropTypes.number,
|
|
795
|
-
className: PropTypes.string
|
|
796
|
-
};
|
|
797
|
-
var Sphere$1 = memo(Sphere);
|
|
798
|
-
|
|
799
|
-
var _excluded$2 = ["coordinates", "children", "onMouseEnter", "onMouseLeave", "onMouseDown", "onMouseUp", "onFocus", "onBlur", "style", "className"];
|
|
800
|
-
var Marker = forwardRef(function (_ref, ref) {
|
|
801
|
-
var coordinates = _ref.coordinates,
|
|
802
|
-
children = _ref.children,
|
|
803
|
-
onMouseEnter = _ref.onMouseEnter,
|
|
804
|
-
onMouseLeave = _ref.onMouseLeave,
|
|
805
|
-
onMouseDown = _ref.onMouseDown,
|
|
806
|
-
onMouseUp = _ref.onMouseUp,
|
|
807
|
-
onFocus = _ref.onFocus,
|
|
808
|
-
onBlur = _ref.onBlur,
|
|
809
|
-
_ref$style = _ref.style,
|
|
810
|
-
style = _ref$style === void 0 ? {} : _ref$style,
|
|
811
|
-
_ref$className = _ref.className,
|
|
812
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
813
|
-
restProps = _objectWithoutProperties(_ref, _excluded$2);
|
|
814
|
-
var _useContext = useContext(MapContext),
|
|
815
|
-
projection = _useContext.projection;
|
|
816
|
-
var _useState = useState(false),
|
|
817
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
818
|
-
isPressed = _useState2[0],
|
|
819
|
-
setPressed = _useState2[1];
|
|
820
|
-
var _useState3 = useState(false),
|
|
821
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
822
|
-
isFocused = _useState4[0],
|
|
823
|
-
setFocus = _useState4[1];
|
|
824
|
-
var _projection = projection(coordinates),
|
|
825
|
-
_projection2 = _slicedToArray(_projection, 2),
|
|
826
|
-
x = _projection2[0],
|
|
827
|
-
y = _projection2[1];
|
|
828
|
-
function handleMouseEnter(evt) {
|
|
829
|
-
setFocus(true);
|
|
830
|
-
if (onMouseEnter) onMouseEnter(evt);
|
|
831
|
-
}
|
|
832
|
-
function handleMouseLeave(evt) {
|
|
833
|
-
setFocus(false);
|
|
834
|
-
if (isPressed) setPressed(false);
|
|
835
|
-
if (onMouseLeave) onMouseLeave(evt);
|
|
836
|
-
}
|
|
837
|
-
function handleFocus(evt) {
|
|
838
|
-
setFocus(true);
|
|
839
|
-
if (onFocus) onFocus(evt);
|
|
840
|
-
}
|
|
841
|
-
function handleBlur(evt) {
|
|
842
|
-
setFocus(false);
|
|
843
|
-
if (isPressed) setPressed(false);
|
|
844
|
-
if (onBlur) onBlur(evt);
|
|
845
|
-
}
|
|
846
|
-
function handleMouseDown(evt) {
|
|
847
|
-
setPressed(true);
|
|
848
|
-
if (onMouseDown) onMouseDown(evt);
|
|
849
|
-
}
|
|
850
|
-
function handleMouseUp(evt) {
|
|
851
|
-
setPressed(false);
|
|
852
|
-
if (onMouseUp) onMouseUp(evt);
|
|
853
|
-
}
|
|
854
|
-
return /*#__PURE__*/React.createElement("g", _extends({
|
|
855
|
-
ref: ref,
|
|
856
|
-
transform: "translate(".concat(x, ", ").concat(y, ")"),
|
|
857
|
-
className: "rsm-marker ".concat(className),
|
|
858
|
-
onMouseEnter: handleMouseEnter,
|
|
859
|
-
onMouseLeave: handleMouseLeave,
|
|
860
|
-
onFocus: handleFocus,
|
|
861
|
-
onBlur: handleBlur,
|
|
862
|
-
onMouseDown: handleMouseDown,
|
|
863
|
-
onMouseUp: handleMouseUp,
|
|
864
|
-
style: style[isPressed || isFocused ? isPressed ? "pressed" : "hover" : "default"]
|
|
865
|
-
}, restProps), children);
|
|
866
|
-
});
|
|
867
|
-
Marker.displayName = "Marker";
|
|
868
|
-
Marker.propTypes = {
|
|
869
|
-
coordinates: PropTypes.array,
|
|
870
|
-
children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
|
871
|
-
onMouseEnter: PropTypes.func,
|
|
872
|
-
onMouseLeave: PropTypes.func,
|
|
873
|
-
onMouseDown: PropTypes.func,
|
|
874
|
-
onMouseUp: PropTypes.func,
|
|
875
|
-
onFocus: PropTypes.func,
|
|
876
|
-
onBlur: PropTypes.func,
|
|
877
|
-
style: PropTypes.object,
|
|
878
|
-
className: PropTypes.string
|
|
879
|
-
};
|
|
880
|
-
|
|
881
|
-
var _excluded$1 = ["from", "to", "coordinates", "stroke", "strokeWidth", "fill", "className"];
|
|
882
|
-
var Line = forwardRef(function (_ref, ref) {
|
|
883
|
-
var _ref$from = _ref.from,
|
|
884
|
-
from = _ref$from === void 0 ? [0, 0] : _ref$from,
|
|
885
|
-
_ref$to = _ref.to,
|
|
886
|
-
to = _ref$to === void 0 ? [0, 0] : _ref$to,
|
|
887
|
-
coordinates = _ref.coordinates,
|
|
888
|
-
_ref$stroke = _ref.stroke,
|
|
889
|
-
stroke = _ref$stroke === void 0 ? "currentcolor" : _ref$stroke,
|
|
890
|
-
_ref$strokeWidth = _ref.strokeWidth,
|
|
891
|
-
strokeWidth = _ref$strokeWidth === void 0 ? 3 : _ref$strokeWidth,
|
|
892
|
-
_ref$fill = _ref.fill,
|
|
893
|
-
fill = _ref$fill === void 0 ? "transparent" : _ref$fill,
|
|
894
|
-
_ref$className = _ref.className,
|
|
895
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
896
|
-
restProps = _objectWithoutProperties(_ref, _excluded$1);
|
|
897
|
-
var _useContext = useContext(MapContext),
|
|
898
|
-
path = _useContext.path;
|
|
899
|
-
var lineData = {
|
|
900
|
-
type: "LineString",
|
|
901
|
-
coordinates: coordinates || [from, to]
|
|
902
|
-
};
|
|
903
|
-
return /*#__PURE__*/React.createElement("path", _extends({
|
|
904
|
-
ref: ref,
|
|
905
|
-
d: path(lineData),
|
|
906
|
-
className: "rsm-line ".concat(className),
|
|
907
|
-
stroke: stroke,
|
|
908
|
-
strokeWidth: strokeWidth,
|
|
909
|
-
fill: fill
|
|
910
|
-
}, restProps));
|
|
911
|
-
});
|
|
912
|
-
Line.displayName = "Line";
|
|
913
|
-
Line.propTypes = {
|
|
914
|
-
from: PropTypes.array,
|
|
915
|
-
to: PropTypes.array,
|
|
916
|
-
coordinates: PropTypes.array,
|
|
917
|
-
stroke: PropTypes.string,
|
|
918
|
-
strokeWidth: PropTypes.number,
|
|
919
|
-
fill: PropTypes.string,
|
|
920
|
-
className: PropTypes.string
|
|
921
|
-
};
|
|
922
|
-
|
|
923
|
-
var _excluded = ["subject", "children", "connectorProps", "dx", "dy", "curve", "className"];
|
|
924
|
-
var Annotation = forwardRef(function (_ref, ref) {
|
|
925
|
-
var subject = _ref.subject,
|
|
926
|
-
children = _ref.children,
|
|
927
|
-
connectorProps = _ref.connectorProps,
|
|
928
|
-
_ref$dx = _ref.dx,
|
|
929
|
-
dx = _ref$dx === void 0 ? 30 : _ref$dx,
|
|
930
|
-
_ref$dy = _ref.dy,
|
|
931
|
-
dy = _ref$dy === void 0 ? 30 : _ref$dy,
|
|
932
|
-
_ref$curve = _ref.curve,
|
|
933
|
-
curve = _ref$curve === void 0 ? 0 : _ref$curve,
|
|
934
|
-
_ref$className = _ref.className,
|
|
935
|
-
className = _ref$className === void 0 ? "" : _ref$className,
|
|
936
|
-
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
937
|
-
var _useContext = useContext(MapContext),
|
|
938
|
-
projection = _useContext.projection;
|
|
939
|
-
var _projection = projection(subject),
|
|
940
|
-
_projection2 = _slicedToArray(_projection, 2),
|
|
941
|
-
x = _projection2[0],
|
|
942
|
-
y = _projection2[1];
|
|
943
|
-
var connectorPath = createConnectorPath(dx, dy, curve);
|
|
944
|
-
return /*#__PURE__*/React.createElement("g", _extends({
|
|
945
|
-
ref: ref,
|
|
946
|
-
transform: "translate(".concat(x + dx, ", ").concat(y + dy, ")"),
|
|
947
|
-
className: "rsm-annotation ".concat(className)
|
|
948
|
-
}, restProps), /*#__PURE__*/React.createElement("path", _extends({
|
|
949
|
-
d: connectorPath,
|
|
950
|
-
fill: "transparent",
|
|
951
|
-
stroke: "#000"
|
|
952
|
-
}, connectorProps)), children);
|
|
953
|
-
});
|
|
954
|
-
Annotation.displayName = "Annotation";
|
|
955
|
-
Annotation.propTypes = {
|
|
956
|
-
subject: PropTypes.array,
|
|
957
|
-
children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
|
|
958
|
-
dx: PropTypes.number,
|
|
959
|
-
dy: PropTypes.number,
|
|
960
|
-
curve: PropTypes.number,
|
|
961
|
-
connectorProps: PropTypes.object,
|
|
962
|
-
className: PropTypes.string
|
|
963
|
-
};
|
|
964
|
-
|
|
965
|
-
export { Annotation, ComposableMap, Geographies, Geography$1 as Geography, Graticule$1 as Graticule, Line, MapContext, MapProvider, Marker, Sphere$1 as Sphere, ZoomPanContext, ZoomPanProvider, ZoomableGroup, useGeographies, useMapContext, useZoomPan, useZoomPanContext };
|