@react-google-maps/marker-clusterer 2.11.0 → 2.11.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/cjs.js +98 -141
  2. package/dist/cjs.js.map +1 -1
  3. package/dist/cjs.min.js +1 -1
  4. package/dist/cjs.min.js.map +1 -1
  5. package/dist/esm.js +98 -141
  6. package/dist/esm.js.map +1 -1
  7. package/dist/esm.min.js +1 -1
  8. package/dist/esm.min.js.map +1 -1
  9. package/dist/index.d.ts +5 -5
  10. package/dist/umd.js +98 -141
  11. package/dist/umd.js.map +1 -1
  12. package/dist/umd.min.js +1 -1
  13. package/dist/umd.min.js.map +1 -1
  14. package/package.json +2 -2
  15. package/src/Cluster.tsx +6 -10
  16. package/src/ClusterIcon.tsx +44 -37
  17. package/src/Clusterer.tsx +22 -25
package/dist/cjs.js CHANGED
@@ -2,68 +2,34 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- /******************************************************************************
6
- Copyright (c) Microsoft Corporation.
7
-
8
- Permission to use, copy, modify, and/or distribute this software for any
9
- purpose with or without fee is hereby granted.
10
-
11
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
12
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
13
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
14
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
15
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
16
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
17
- PERFORMANCE OF THIS SOFTWARE.
18
- ***************************************************************************** */
19
- /* global Reflect, Promise */
20
-
21
- var extendStatics = function(d, b) {
22
- extendStatics = Object.setPrototypeOf ||
23
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
24
- function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
25
- return extendStatics(d, b);
26
- };
27
-
28
- function __extends(d, b) {
29
- if (typeof b !== "function" && b !== null)
30
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
31
- extendStatics(d, b);
32
- function __() { this.constructor = d; }
33
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
34
- }
35
-
36
- var ClusterIcon = /** @class */ (function (_super) {
37
- __extends(ClusterIcon, _super);
5
+ var ClusterIcon = /** @class */ (function () {
38
6
  function ClusterIcon(cluster, styles) {
39
- var _this = _super.call(this) || this;
40
7
  cluster.getClusterer().extend(ClusterIcon, google.maps.OverlayView);
41
- _this.cluster = cluster;
42
- _this.clusterClassName = _this.cluster.getClusterer().getClusterClass();
43
- _this.className = _this.clusterClassName;
44
- _this.styles = styles;
45
- _this.center = undefined;
46
- _this.div = null;
47
- _this.sums = null;
48
- _this.visible = false;
49
- _this.boundsChangedListener = null;
50
- _this.url = '';
51
- _this.height = 0;
52
- _this.width = 0;
53
- _this.anchorText = [0, 0];
54
- _this.anchorIcon = [0, 0];
55
- _this.textColor = 'black';
56
- _this.textSize = 11;
57
- _this.textDecoration = 'none';
58
- _this.fontWeight = 'bold';
59
- _this.fontStyle = 'normal';
60
- _this.fontFamily = 'Arial,sans-serif';
61
- _this.backgroundPosition = '0 0';
62
- _this.cMouseDownInCluster = null;
63
- _this.cDraggingMapByCluster = null;
64
- _this.timeOut = null;
65
- _this.setMap(cluster.getMap()); // Note: this causes onAdd to be called
66
- return _this;
8
+ this.cluster = cluster;
9
+ this.clusterClassName = this.cluster.getClusterer().getClusterClass();
10
+ this.className = this.clusterClassName;
11
+ this.styles = styles;
12
+ this.center = undefined;
13
+ this.div = null;
14
+ this.sums = null;
15
+ this.visible = false;
16
+ this.boundsChangedListener = null;
17
+ this.url = '';
18
+ this.height = 0;
19
+ this.width = 0;
20
+ this.anchorText = [0, 0];
21
+ this.anchorIcon = [0, 0];
22
+ this.textColor = 'black';
23
+ this.textSize = 11;
24
+ this.textDecoration = 'none';
25
+ this.fontWeight = 'bold';
26
+ this.fontStyle = 'normal';
27
+ this.fontFamily = 'Arial,sans-serif';
28
+ this.backgroundPosition = '0 0';
29
+ this.cMouseDownInCluster = null;
30
+ this.cDraggingMapByCluster = null;
31
+ this.timeOut = null;
32
+ this.setMap(cluster.getMap()); // Note: this causes onAdd to be called
67
33
  }
68
34
  ClusterIcon.prototype.onBoundsChanged = function () {
69
35
  this.cDraggingMapByCluster = this.cMouseDownInCluster;
@@ -90,22 +56,23 @@ var ClusterIcon = /** @class */ (function (_super) {
90
56
  // Zoom into the cluster.
91
57
  var maxZoom_1 = markerClusterer_1.getMaxZoom();
92
58
  var bounds_1 = this.cluster.getBounds();
93
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
94
- // @ts-ignore
95
- markerClusterer_1.getMap().fitBounds(bounds_1);
59
+ var map = markerClusterer_1.getMap();
60
+ if (map !== null && 'fitBounds' in map) {
61
+ map.fitBounds(bounds_1);
62
+ }
96
63
  // There is a fix for Issue 170 here:
97
64
  this.timeOut = window.setTimeout(function () {
98
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
99
- // @ts-ignore
100
- markerClusterer_1.getMap().fitBounds(bounds_1);
101
- // Don't zoom beyond the max zoom level
102
- if (maxZoom_1 !== null &&
103
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
104
- // @ts-ignore
105
- markerClusterer_1.getMap().getZoom() > maxZoom_1) {
106
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
107
- // @ts-ignore
108
- markerClusterer_1.getMap().setZoom(maxZoom_1 + 1);
65
+ var map = markerClusterer_1.getMap();
66
+ if (map !== null) {
67
+ if ('fitBounds' in map) {
68
+ map.fitBounds(bounds_1);
69
+ }
70
+ var zoom = map.getZoom() || 0;
71
+ // Don't zoom beyond the max zoom level
72
+ if (maxZoom_1 !== null &&
73
+ zoom > maxZoom_1) {
74
+ map.setZoom(maxZoom_1 + 1);
75
+ }
109
76
  }
110
77
  }, 100);
111
78
  }
@@ -135,23 +102,22 @@ var ClusterIcon = /** @class */ (function (_super) {
135
102
  google.maps.event.trigger(this.cluster.getClusterer(), 'mouseout', this.cluster);
136
103
  };
137
104
  ClusterIcon.prototype.onAdd = function () {
105
+ var _a;
138
106
  this.div = document.createElement('div');
139
107
  this.div.className = this.className;
140
108
  if (this.visible) {
141
109
  this.show();
142
110
  }
143
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
144
- // @ts-ignore
145
- this.getPanes().overlayMouseTarget.appendChild(this.div);
146
- // Fix for Issue 157
147
- this.boundsChangedListener = google.maps.event.addListener(
148
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
149
- // @ts-ignore
150
- this.getMap(), 'bounds_changed', this.onBoundsChanged);
151
- this.div.addEventListener('mousedown', this.onMouseDown);
152
- this.div.addEventListener('click', this.onClick);
153
- this.div.addEventListener('mouseover', this.onMouseOver);
154
- this.div.addEventListener('mouseout', this.onMouseOut);
111
+ (_a = this.getPanes()) === null || _a === void 0 ? void 0 : _a.overlayMouseTarget.appendChild(this.div);
112
+ var map = this.getMap();
113
+ if (map !== null) {
114
+ // Fix for Issue 157
115
+ this.boundsChangedListener = google.maps.event.addListener(map, 'bounds_changed', this.onBoundsChanged);
116
+ this.div.addEventListener('mousedown', this.onMouseDown);
117
+ this.div.addEventListener('click', this.onClick);
118
+ this.div.addEventListener('mouseover', this.onMouseOver);
119
+ this.div.addEventListener('mouseout', this.onMouseOut);
120
+ }
155
121
  };
156
122
  ClusterIcon.prototype.onRemove = function () {
157
123
  if (this.div && this.div.parentNode) {
@@ -269,13 +235,11 @@ var ClusterIcon = /** @class */ (function (_super) {
269
235
  return pos;
270
236
  };
271
237
  return ClusterIcon;
272
- }(google.maps.OverlayView));
238
+ }());
273
239
 
274
240
  var Cluster = /** @class */ (function () {
275
241
  function Cluster(markerClusterer) {
276
242
  this.markerClusterer = markerClusterer;
277
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
278
- // @ts-ignore
279
243
  this.map = this.markerClusterer.getMap();
280
244
  this.gridSize = this.markerClusterer.getGridSize();
281
245
  this.minClusterSize = this.markerClusterer.getMinimumClusterSize();
@@ -312,8 +276,6 @@ var Cluster = /** @class */ (function () {
312
276
  return bounds;
313
277
  };
314
278
  Cluster.prototype.remove = function () {
315
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
316
- // @ts-ignore
317
279
  this.clusterIcon.setMap(null);
318
280
  this.markers = [];
319
281
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -321,6 +283,7 @@ var Cluster = /** @class */ (function () {
321
283
  delete this.markers;
322
284
  };
323
285
  Cluster.prototype.addMarker = function (marker) {
286
+ var _a;
324
287
  if (this.isMarkerAlreadyAdded(marker)) {
325
288
  return false;
326
289
  }
@@ -345,7 +308,7 @@ var Cluster = /** @class */ (function () {
345
308
  this.markers.push(marker);
346
309
  var mCount = this.markers.length;
347
310
  var maxZoom = this.markerClusterer.getMaxZoom();
348
- var zoom = this.map.getZoom();
311
+ var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
349
312
  if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
350
313
  // Zoomed in past max zoom, so show the marker.
351
314
  if (marker.getMap() !== this.map) {
@@ -382,9 +345,10 @@ var Cluster = /** @class */ (function () {
382
345
  this.bounds = this.markerClusterer.getExtendedBounds(new google.maps.LatLngBounds(this.center, this.center));
383
346
  };
384
347
  Cluster.prototype.updateIcon = function () {
348
+ var _a;
385
349
  var mCount = this.markers.length;
386
350
  var maxZoom = this.markerClusterer.getMaxZoom();
387
- var zoom = this.map.getZoom();
351
+ var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
388
352
  if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
389
353
  this.clusterIcon.hide();
390
354
  return;
@@ -414,6 +378,7 @@ var Cluster = /** @class */ (function () {
414
378
  return Cluster;
415
379
  }());
416
380
 
381
+ /* global google */
417
382
  /**
418
383
  * Supports up to 9007199254740991 (Number.MAX_SAFE_INTEGER) markers
419
384
  * which is not a problem as max array length is 4294967296 (2**32)
@@ -434,57 +399,52 @@ var IMAGE_PATH = 'https://developers.google.com/maps/documentation/javascript/ex
434
399
  var IMAGE_EXTENSION = 'png';
435
400
  var IMAGE_SIZES = [53, 56, 66, 78, 90];
436
401
  var CLUSTERER_CLASS = 'cluster';
437
- var Clusterer = /** @class */ (function (_super) {
438
- __extends(Clusterer, _super);
402
+ var Clusterer = /** @class */ (function () {
439
403
  function Clusterer(map, optMarkers, optOptions) {
440
404
  if (optMarkers === void 0) { optMarkers = []; }
441
405
  if (optOptions === void 0) { optOptions = {}; }
442
- var _this = _super.call(this) || this;
443
- _this.extend(Clusterer, google.maps.OverlayView);
444
- _this.markers = [];
445
- _this.clusters = [];
446
- _this.listeners = [];
447
- _this.activeMap = null;
448
- _this.ready = false;
449
- _this.gridSize = optOptions.gridSize || 60;
450
- _this.minClusterSize = optOptions.minimumClusterSize || 2;
451
- _this.maxZoom = optOptions.maxZoom || null;
452
- _this.styles = optOptions.styles || [];
453
- _this.title = optOptions.title || '';
454
- _this.zoomOnClick = true;
406
+ this.extend(Clusterer, google.maps.OverlayView);
407
+ this.markers = [];
408
+ this.clusters = [];
409
+ this.listeners = [];
410
+ this.activeMap = null;
411
+ this.ready = false;
412
+ this.gridSize = optOptions.gridSize || 60;
413
+ this.minClusterSize = optOptions.minimumClusterSize || 2;
414
+ this.maxZoom = optOptions.maxZoom || null;
415
+ this.styles = optOptions.styles || [];
416
+ this.title = optOptions.title || '';
417
+ this.zoomOnClick = true;
455
418
  if (optOptions.zoomOnClick !== undefined) {
456
- _this.zoomOnClick = optOptions.zoomOnClick;
419
+ this.zoomOnClick = optOptions.zoomOnClick;
457
420
  }
458
- _this.averageCenter = false;
421
+ this.averageCenter = false;
459
422
  if (optOptions.averageCenter !== undefined) {
460
- _this.averageCenter = optOptions.averageCenter;
423
+ this.averageCenter = optOptions.averageCenter;
461
424
  }
462
- _this.ignoreHidden = false;
425
+ this.ignoreHidden = false;
463
426
  if (optOptions.ignoreHidden !== undefined) {
464
- _this.ignoreHidden = optOptions.ignoreHidden;
427
+ this.ignoreHidden = optOptions.ignoreHidden;
465
428
  }
466
- _this.enableRetinaIcons = false;
429
+ this.enableRetinaIcons = false;
467
430
  if (optOptions.enableRetinaIcons !== undefined) {
468
- _this.enableRetinaIcons = optOptions.enableRetinaIcons;
469
- }
470
- _this.imagePath = optOptions.imagePath || IMAGE_PATH;
471
- _this.imageExtension = optOptions.imageExtension || IMAGE_EXTENSION;
472
- _this.imageSizes = optOptions.imageSizes || IMAGE_SIZES;
473
- _this.calculator = optOptions.calculator || CALCULATOR;
474
- _this.batchSize = optOptions.batchSize || BATCH_SIZE;
475
- _this.batchSizeIE = optOptions.batchSizeIE || BATCH_SIZE_IE;
476
- _this.clusterClass = optOptions.clusterClass || CLUSTERER_CLASS;
431
+ this.enableRetinaIcons = optOptions.enableRetinaIcons;
432
+ }
433
+ this.imagePath = optOptions.imagePath || IMAGE_PATH;
434
+ this.imageExtension = optOptions.imageExtension || IMAGE_EXTENSION;
435
+ this.imageSizes = optOptions.imageSizes || IMAGE_SIZES;
436
+ this.calculator = optOptions.calculator || CALCULATOR;
437
+ this.batchSize = optOptions.batchSize || BATCH_SIZE;
438
+ this.batchSizeIE = optOptions.batchSizeIE || BATCH_SIZE_IE;
439
+ this.clusterClass = optOptions.clusterClass || CLUSTERER_CLASS;
477
440
  if (navigator.userAgent.toLowerCase().indexOf('msie') !== -1) {
478
441
  // Try to avoid IE timeout when processing a huge number of markers:
479
- _this.batchSize = _this.batchSizeIE;
442
+ this.batchSize = this.batchSizeIE;
480
443
  }
481
- _this.timerRefStatic = null;
482
- _this.setupStyles();
483
- _this.addMarkers(optMarkers, true);
484
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
485
- // @ts-ignore
486
- _this.setMap(map); // Note: this causes onAdd to be called
487
- return _this;
444
+ this.timerRefStatic = null;
445
+ this.setupStyles();
446
+ this.addMarkers(optMarkers, true);
447
+ this.setMap(map); // Note: this causes onAdd to be called
488
448
  }
489
449
  Clusterer.prototype.onZoomChanged = function () {
490
450
  var _a, _b;
@@ -558,9 +518,10 @@ var Clusterer = /** @class */ (function (_super) {
558
518
  bounds.extend(position);
559
519
  }
560
520
  }
561
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
562
- // @ts-ignore
563
- this.getMap().fitBounds(bounds);
521
+ var map = this.getMap();
522
+ if (map !== null && 'fitBounds' in map) {
523
+ map.fitBounds(bounds);
524
+ }
564
525
  };
565
526
  Clusterer.prototype.getGridSize = function () {
566
527
  return this.gridSize;
@@ -750,8 +711,6 @@ var Clusterer = /** @class */ (function (_super) {
750
711
  }, 0);
751
712
  };
752
713
  Clusterer.prototype.getExtendedBounds = function (bounds) {
753
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
754
- // @ts-ignore
755
714
  var projection = this.getProjection();
756
715
  // Convert the points to pixels and the extend out by the grid size.
757
716
  var trPix = projection.fromLatLngToDivPixel(
@@ -871,14 +830,12 @@ var Clusterer = /** @class */ (function (_super) {
871
830
  }
872
831
  var map = this.getMap();
873
832
  var bounds = map !== null && 'getBounds' in map ? map.getBounds() : null;
833
+ var zoom = (map === null || map === void 0 ? void 0 : map.getZoom()) || 0;
874
834
  // Get our current map view bounds.
875
835
  // Create a new bounds object so we don't affect the map.
876
836
  //
877
837
  // See Comments 9 & 11 on Issue 3651 relating to this workaround for a Google Maps bug:
878
- var mapBounds =
879
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
880
- // @ts-ignore
881
- map.getZoom() > 3
838
+ var mapBounds = zoom > 3
882
839
  ? new google.maps.LatLngBounds(bounds === null || bounds === void 0 ? void 0 : bounds.getSouthWest(), bounds === null || bounds === void 0 ? void 0 : bounds.getNorthEast())
883
840
  : new google.maps.LatLngBounds(new google.maps.LatLng(85.02070771743472, -178.48388434375), new google.maps.LatLng(-85.08136444384544, 178.00048865625));
884
841
  var extendedMapBounds = this.getExtendedBounds(mapBounds);
@@ -918,7 +875,7 @@ var Clusterer = /** @class */ (function (_super) {
918
875
  }.apply(obj1, [obj2]);
919
876
  };
920
877
  return Clusterer;
921
- }(google.maps.OverlayView));
878
+ }());
922
879
 
923
880
  exports.Cluster = Cluster;
924
881
  exports.ClusterIcon = ClusterIcon;