@react-google-maps/marker-clusterer 2.10.0 → 2.11.1

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 +262 -223
  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 +262 -223
  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 +16 -6
  10. package/dist/umd.js +262 -223
  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 +7 -7
  15. package/src/Cluster.tsx +4 -8
  16. package/src/ClusterIcon.tsx +183 -114
  17. package/src/Clusterer.tsx +92 -82
package/dist/umd.js CHANGED
@@ -4,111 +4,156 @@
4
4
  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.markerClusterer = {}));
5
5
  })(this, (function (exports) { 'use strict';
6
6
 
7
- var ClusterIcon = /** @class */ (function () {
7
+ /******************************************************************************
8
+ Copyright (c) Microsoft Corporation.
9
+
10
+ Permission to use, copy, modify, and/or distribute this software for any
11
+ purpose with or without fee is hereby granted.
12
+
13
+ THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
14
+ REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
15
+ AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
16
+ INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
17
+ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
18
+ OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
19
+ PERFORMANCE OF THIS SOFTWARE.
20
+ ***************************************************************************** */
21
+ /* global Reflect, Promise */
22
+
23
+ var extendStatics = function(d, b) {
24
+ extendStatics = Object.setPrototypeOf ||
25
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
26
+ function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
27
+ return extendStatics(d, b);
28
+ };
29
+
30
+ function __extends(d, b) {
31
+ if (typeof b !== "function" && b !== null)
32
+ throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
33
+ extendStatics(d, b);
34
+ function __() { this.constructor = d; }
35
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
36
+ }
37
+
38
+ var ClusterIcon = /** @class */ (function (_super) {
39
+ __extends(ClusterIcon, _super);
8
40
  function ClusterIcon(cluster, styles) {
41
+ var _this = _super.call(this) || this;
9
42
  cluster.getClusterer().extend(ClusterIcon, google.maps.OverlayView);
10
- this.cluster = cluster;
11
- this.clusterClassName = this.cluster.getClusterer().getClusterClass();
12
- this.className = this.clusterClassName;
13
- this.styles = styles;
14
- this.center = undefined;
15
- this.div = null;
16
- this.sums = null;
17
- this.visible = false;
18
- this.boundsChangedListener = null;
19
- this.url = '';
20
- this.height = 0;
21
- this.width = 0;
22
- this.anchorText = [0, 0];
23
- this.anchorIcon = [0, 0];
24
- this.textColor = 'black';
25
- this.textSize = 11;
26
- this.textDecoration = 'none';
27
- this.fontWeight = 'bold';
28
- this.fontStyle = 'normal';
29
- this.fontFamily = 'Arial,sans-serif';
30
- this.backgroundPosition = '0 0';
31
- // @ts-ignore
32
- this.setMap(cluster.getMap()); // Note: this causes onAdd to be called
43
+ _this.cluster = cluster;
44
+ _this.clusterClassName = _this.cluster.getClusterer().getClusterClass();
45
+ _this.className = _this.clusterClassName;
46
+ _this.styles = styles;
47
+ _this.center = undefined;
48
+ _this.div = null;
49
+ _this.sums = null;
50
+ _this.visible = false;
51
+ _this.boundsChangedListener = null;
52
+ _this.url = '';
53
+ _this.height = 0;
54
+ _this.width = 0;
55
+ _this.anchorText = [0, 0];
56
+ _this.anchorIcon = [0, 0];
57
+ _this.textColor = 'black';
58
+ _this.textSize = 11;
59
+ _this.textDecoration = 'none';
60
+ _this.fontWeight = 'bold';
61
+ _this.fontStyle = 'normal';
62
+ _this.fontFamily = 'Arial,sans-serif';
63
+ _this.backgroundPosition = '0 0';
64
+ _this.cMouseDownInCluster = null;
65
+ _this.cDraggingMapByCluster = null;
66
+ _this.timeOut = null;
67
+ _this.setMap(cluster.getMap()); // Note: this causes onAdd to be called
68
+ return _this;
33
69
  }
70
+ ClusterIcon.prototype.onBoundsChanged = function () {
71
+ this.cDraggingMapByCluster = this.cMouseDownInCluster;
72
+ };
73
+ ClusterIcon.prototype.onMouseDown = function () {
74
+ this.cMouseDownInCluster = true;
75
+ this.cDraggingMapByCluster = false;
76
+ };
77
+ ClusterIcon.prototype.onClick = function (event) {
78
+ this.cMouseDownInCluster = false;
79
+ if (!this.cDraggingMapByCluster) {
80
+ var markerClusterer_1 = this.cluster.getClusterer();
81
+ /**
82
+ * This event is fired when a cluster marker is clicked.
83
+ * @name MarkerClusterer#click
84
+ * @param {Cluster} c The cluster that was clicked.
85
+ * @event
86
+ */
87
+ google.maps.event.trigger(markerClusterer_1, 'click', this.cluster);
88
+ google.maps.event.trigger(markerClusterer_1, 'clusterclick', this.cluster); // deprecated name
89
+ // The default click handler follows. Disable it by setting
90
+ // the zoomOnClick property to false.
91
+ if (markerClusterer_1.getZoomOnClick()) {
92
+ // Zoom into the cluster.
93
+ var maxZoom_1 = markerClusterer_1.getMaxZoom();
94
+ var bounds_1 = this.cluster.getBounds();
95
+ var map = markerClusterer_1.getMap();
96
+ if (map !== null && 'fitBounds' in map) {
97
+ map.fitBounds(bounds_1);
98
+ }
99
+ // There is a fix for Issue 170 here:
100
+ this.timeOut = window.setTimeout(function () {
101
+ var map = markerClusterer_1.getMap();
102
+ if (map !== null) {
103
+ if ('fitBounds' in map) {
104
+ map.fitBounds(bounds_1);
105
+ }
106
+ var zoom = map.getZoom() || 0;
107
+ // Don't zoom beyond the max zoom level
108
+ if (maxZoom_1 !== null &&
109
+ zoom > maxZoom_1) {
110
+ map.setZoom(maxZoom_1 + 1);
111
+ }
112
+ }
113
+ }, 100);
114
+ }
115
+ // Prevent event propagation to the map:
116
+ event.cancelBubble = true;
117
+ if (event.stopPropagation) {
118
+ event.stopPropagation();
119
+ }
120
+ }
121
+ };
122
+ ClusterIcon.prototype.onMouseOver = function () {
123
+ /**
124
+ * This event is fired when the mouse moves over a cluster marker.
125
+ * @name MarkerClusterer#mouseover
126
+ * @param {Cluster} c The cluster that the mouse moved over.
127
+ * @event
128
+ */
129
+ google.maps.event.trigger(this.cluster.getClusterer(), 'mouseover', this.cluster);
130
+ };
131
+ ClusterIcon.prototype.onMouseOut = function () {
132
+ /**
133
+ * This event is fired when the mouse moves out of a cluster marker.
134
+ * @name MarkerClusterer#mouseout
135
+ * @param {Cluster} c The cluster that the mouse moved out of.
136
+ * @event
137
+ */
138
+ google.maps.event.trigger(this.cluster.getClusterer(), 'mouseout', this.cluster);
139
+ };
34
140
  ClusterIcon.prototype.onAdd = function () {
35
- var _this = this;
36
- var cMouseDownInCluster;
37
- var cDraggingMapByCluster;
141
+ var _a;
38
142
  this.div = document.createElement('div');
39
143
  this.div.className = this.className;
40
144
  if (this.visible) {
41
145
  this.show();
42
146
  }
43
- // @ts-ignore
44
- this.getPanes().overlayMouseTarget.appendChild(this.div);
45
- // Fix for Issue 157
46
- this.boundsChangedListener = google.maps.event.addListener(
47
- // @ts-ignore
48
- this.getMap(), 'boundschanged', function boundsChanged() {
49
- cDraggingMapByCluster = cMouseDownInCluster;
50
- });
51
- google.maps.event.addListener(this.div, 'mousedown', function onMouseDown() {
52
- cMouseDownInCluster = true;
53
- cDraggingMapByCluster = false;
54
- });
55
- google.maps.event.addListener(this.div, 'click', function (event) {
56
- cMouseDownInCluster = false;
57
- if (!cDraggingMapByCluster) {
58
- var markerClusterer_1 = _this.cluster.getClusterer();
59
- /**
60
- * This event is fired when a cluster marker is clicked.
61
- * @name MarkerClusterer#click
62
- * @param {Cluster} c The cluster that was clicked.
63
- * @event
64
- */
65
- google.maps.event.trigger(markerClusterer_1, 'click', _this.cluster);
66
- google.maps.event.trigger(markerClusterer_1, 'clusterclick', _this.cluster); // deprecated name
67
- // The default click handler follows. Disable it by setting
68
- // the zoomOnClick property to false.
69
- if (markerClusterer_1.getZoomOnClick()) {
70
- // Zoom into the cluster.
71
- var maxZoom_1 = markerClusterer_1.getMaxZoom();
72
- var bounds_1 = _this.cluster.getBounds();
73
- // @ts-ignore
74
- markerClusterer_1.getMap().fitBounds(bounds_1);
75
- // There is a fix for Issue 170 here:
76
- setTimeout(function timeout() {
77
- // @ts-ignore
78
- markerClusterer_1.getMap().fitBounds(bounds_1);
79
- // Don't zoom beyond the max zoom level
80
- // @ts-ignore
81
- if (maxZoom_1 !== null && markerClusterer_1.getMap().getZoom() > maxZoom_1) {
82
- // @ts-ignore
83
- markerClusterer_1.getMap().setZoom(maxZoom_1 + 1);
84
- }
85
- }, 100);
86
- }
87
- // Prevent event propagation to the map:
88
- event.cancelBubble = true;
89
- if (event.stopPropagation) {
90
- event.stopPropagation();
91
- }
92
- }
93
- });
94
- google.maps.event.addListener(this.div, 'mouseover', function () {
95
- /**
96
- * This event is fired when the mouse moves over a cluster marker.
97
- * @name MarkerClusterer#mouseover
98
- * @param {Cluster} c The cluster that the mouse moved over.
99
- * @event
100
- */
101
- google.maps.event.trigger(_this.cluster.getClusterer(), 'mouseover', _this.cluster);
102
- });
103
- google.maps.event.addListener(this.div, 'mouseout', function () {
104
- /**
105
- * This event is fired when the mouse moves out of a cluster marker.
106
- * @name MarkerClusterer#mouseout
107
- * @param {Cluster} c The cluster that the mouse moved out of.
108
- * @event
109
- */
110
- google.maps.event.trigger(_this.cluster.getClusterer(), 'mouseout', _this.cluster);
111
- });
147
+ (_a = this.getPanes()) === null || _a === void 0 ? void 0 : _a.overlayMouseTarget.appendChild(this.div);
148
+ var map = this.getMap();
149
+ if (map !== null) {
150
+ // Fix for Issue 157
151
+ this.boundsChangedListener = google.maps.event.addListener(map, 'bounds_changed', this.onBoundsChanged);
152
+ this.div.addEventListener('mousedown', this.onMouseDown);
153
+ this.div.addEventListener('click', this.onClick);
154
+ this.div.addEventListener('mouseover', this.onMouseOver);
155
+ this.div.addEventListener('mouseout', this.onMouseOut);
156
+ }
112
157
  };
113
158
  ClusterIcon.prototype.onRemove = function () {
114
159
  if (this.div && this.div.parentNode) {
@@ -116,16 +161,23 @@
116
161
  if (this.boundsChangedListener !== null) {
117
162
  google.maps.event.removeListener(this.boundsChangedListener);
118
163
  }
119
- google.maps.event.clearInstanceListeners(this.div);
164
+ this.div.removeEventListener('mousedown', this.onMouseDown);
165
+ this.div.removeEventListener('click', this.onClick);
166
+ this.div.removeEventListener('mouseover', this.onMouseOver);
167
+ this.div.removeEventListener('mouseout', this.onMouseOut);
120
168
  this.div.parentNode.removeChild(this.div);
169
+ if (this.timeOut !== null) {
170
+ window.clearTimeout(this.timeOut);
171
+ this.timeOut = null;
172
+ }
121
173
  this.div = null;
122
174
  }
123
175
  };
124
176
  ClusterIcon.prototype.draw = function () {
125
177
  if (this.visible && this.div !== null && this.center) {
126
- var _a = this.getPosFromLatLng(this.center), x = _a.x, y = _a.y;
127
- this.div.style.top = y + 'px';
128
- this.div.style.left = x + 'px';
178
+ var pos = this.getPosFromLatLng(this.center);
179
+ this.div.style.top = pos !== null ? "".concat(pos.y, "px") : '0';
180
+ this.div.style.left = pos !== null ? "".concat(pos.x, "px") : '0';
129
181
  }
130
182
  };
131
183
  ClusterIcon.prototype.hide = function () {
@@ -143,7 +195,9 @@
143
195
  var spriteH = parseInt(bp[0].replace(/^\s+|\s+$/g, ''), 10);
144
196
  var spriteV = parseInt(bp[1].replace(/^\s+|\s+$/g, ''), 10);
145
197
  var pos = this.getPosFromLatLng(this.center);
146
- if (this.sums === null || typeof this.sums.title === 'undefined' || this.sums.title === '') {
198
+ if (this.sums === null ||
199
+ typeof this.sums.title === 'undefined' ||
200
+ this.sums.title === '') {
147
201
  divTitle = this.cluster.getClusterer().getTitle();
148
202
  }
149
203
  else {
@@ -151,8 +205,8 @@
151
205
  }
152
206
  this.div.style.cursor = 'pointer';
153
207
  this.div.style.position = 'absolute';
154
- this.div.style.top = "".concat(pos.y, "px");
155
- this.div.style.left = "".concat(pos.x, "px");
208
+ this.div.style.top = pos !== null ? "".concat(pos.y, "px") : '0';
209
+ this.div.style.left = pos !== null ? "".concat(pos.x, "px") : '0';
156
210
  this.div.style.width = "".concat(this.width, "px");
157
211
  this.div.style.height = "".concat(this.height, "px");
158
212
  var img = document.createElement('img');
@@ -209,22 +263,19 @@
209
263
  this.center = center;
210
264
  };
211
265
  ClusterIcon.prototype.getPosFromLatLng = function (latlng) {
212
- // @ts-ignore
213
266
  var pos = this.getProjection().fromLatLngToDivPixel(latlng);
214
- pos.x -= this.anchorIcon[1];
215
- pos.y -= this.anchorIcon[0];
216
- // pos.x = pos.x
217
- // pos.y = pos.y
267
+ if (pos !== null) {
268
+ pos.x -= this.anchorIcon[1];
269
+ pos.y -= this.anchorIcon[0];
270
+ }
218
271
  return pos;
219
272
  };
220
273
  return ClusterIcon;
221
- }());
274
+ }(google.maps.OverlayView));
222
275
 
223
276
  var Cluster = /** @class */ (function () {
224
277
  function Cluster(markerClusterer) {
225
278
  this.markerClusterer = markerClusterer;
226
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
227
- // @ts-ignore
228
279
  this.map = this.markerClusterer.getMap();
229
280
  this.gridSize = this.markerClusterer.getGridSize();
230
281
  this.minClusterSize = this.markerClusterer.getMinimumClusterSize();
@@ -261,8 +312,6 @@
261
312
  return bounds;
262
313
  };
263
314
  Cluster.prototype.remove = function () {
264
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
265
- // @ts-ignore
266
315
  this.clusterIcon.setMap(null);
267
316
  this.markers = [];
268
317
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -270,6 +319,7 @@
270
319
  delete this.markers;
271
320
  };
272
321
  Cluster.prototype.addMarker = function (marker) {
322
+ var _a;
273
323
  if (this.isMarkerAlreadyAdded(marker)) {
274
324
  return false;
275
325
  }
@@ -294,7 +344,7 @@
294
344
  this.markers.push(marker);
295
345
  var mCount = this.markers.length;
296
346
  var maxZoom = this.markerClusterer.getMaxZoom();
297
- var zoom = this.map.getZoom();
347
+ var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
298
348
  if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
299
349
  // Zoomed in past max zoom, so show the marker.
300
350
  if (marker.getMap() !== this.map) {
@@ -331,9 +381,10 @@
331
381
  this.bounds = this.markerClusterer.getExtendedBounds(new google.maps.LatLngBounds(this.center, this.center));
332
382
  };
333
383
  Cluster.prototype.updateIcon = function () {
384
+ var _a;
334
385
  var mCount = this.markers.length;
335
386
  var maxZoom = this.markerClusterer.getMaxZoom();
336
- var zoom = this.map.getZoom();
387
+ var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
337
388
  if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
338
389
  this.clusterIcon.hide();
339
390
  return;
@@ -363,7 +414,6 @@
363
414
  return Cluster;
364
415
  }());
365
416
 
366
- /* global google */
367
417
  /**
368
418
  * Supports up to 9007199254740991 (Number.MAX_SAFE_INTEGER) markers
369
419
  * which is not a problem as max array length is 4294967296 (2**32)
@@ -384,91 +434,84 @@
384
434
  var IMAGE_EXTENSION = 'png';
385
435
  var IMAGE_SIZES = [53, 56, 66, 78, 90];
386
436
  var CLUSTERER_CLASS = 'cluster';
387
- var Clusterer = /** @class */ (function () {
437
+ var Clusterer = /** @class */ (function (_super) {
438
+ __extends(Clusterer, _super);
388
439
  function Clusterer(map, optMarkers, optOptions) {
389
440
  if (optMarkers === void 0) { optMarkers = []; }
390
441
  if (optOptions === void 0) { optOptions = {}; }
391
- this.extend(Clusterer, google.maps.OverlayView);
392
- this.markers = [];
393
- this.clusters = [];
394
- this.listeners = [];
395
- this.activeMap = null;
396
- this.ready = false;
397
- this.gridSize = optOptions.gridSize || 60;
398
- this.minClusterSize = optOptions.minimumClusterSize || 2;
399
- this.maxZoom = optOptions.maxZoom || null;
400
- this.styles = optOptions.styles || [];
401
- this.title = optOptions.title || '';
402
- this.zoomOnClick = true;
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;
403
455
  if (optOptions.zoomOnClick !== undefined) {
404
- this.zoomOnClick = optOptions.zoomOnClick;
456
+ _this.zoomOnClick = optOptions.zoomOnClick;
405
457
  }
406
- this.averageCenter = false;
458
+ _this.averageCenter = false;
407
459
  if (optOptions.averageCenter !== undefined) {
408
- this.averageCenter = optOptions.averageCenter;
460
+ _this.averageCenter = optOptions.averageCenter;
409
461
  }
410
- this.ignoreHidden = false;
462
+ _this.ignoreHidden = false;
411
463
  if (optOptions.ignoreHidden !== undefined) {
412
- this.ignoreHidden = optOptions.ignoreHidden;
464
+ _this.ignoreHidden = optOptions.ignoreHidden;
413
465
  }
414
- this.enableRetinaIcons = false;
466
+ _this.enableRetinaIcons = false;
415
467
  if (optOptions.enableRetinaIcons !== undefined) {
416
- this.enableRetinaIcons = optOptions.enableRetinaIcons;
417
- }
418
- this.imagePath = optOptions.imagePath || IMAGE_PATH;
419
- this.imageExtension = optOptions.imageExtension || IMAGE_EXTENSION;
420
- this.imageSizes = optOptions.imageSizes || IMAGE_SIZES;
421
- this.calculator = optOptions.calculator || CALCULATOR;
422
- this.batchSize = optOptions.batchSize || BATCH_SIZE;
423
- this.batchSizeIE = optOptions.batchSizeIE || BATCH_SIZE_IE;
424
- this.clusterClass = optOptions.clusterClass || CLUSTERER_CLASS;
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;
425
477
  if (navigator.userAgent.toLowerCase().indexOf('msie') !== -1) {
426
478
  // Try to avoid IE timeout when processing a huge number of markers:
427
- this.batchSize = this.batchSizeIE;
479
+ _this.batchSize = _this.batchSizeIE;
428
480
  }
429
- this.timerRefStatic = null;
430
- this.setupStyles();
431
- this.addMarkers(optMarkers, true);
432
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
433
- // @ts-ignore
434
- this.setMap(map); // Note: this causes onAdd to be called
481
+ _this.timerRefStatic = null;
482
+ _this.setupStyles();
483
+ _this.addMarkers(optMarkers, true);
484
+ _this.setMap(map); // Note: this causes onAdd to be called
485
+ return _this;
435
486
  }
487
+ Clusterer.prototype.onZoomChanged = function () {
488
+ var _a, _b;
489
+ this.resetViewport(false);
490
+ // Workaround for this Google bug: when map is at level 0 and "-" of
491
+ // zoom slider is clicked, a "zoom_changed" event is fired even though
492
+ // the map doesn't zoom out any further. In this situation, no "idle"
493
+ // event is triggered so the cluster markers that have been removed
494
+ // do not get redrawn. Same goes for a zoom in at maxZoom.
495
+ if (((_a = this.getMap()) === null || _a === void 0 ? void 0 : _a.getZoom()) === (this.get('minZoom') || 0) ||
496
+ ((_b = this.getMap()) === null || _b === void 0 ? void 0 : _b.getZoom()) === this.get('maxZoom')) {
497
+ google.maps.event.trigger(this, 'idle');
498
+ }
499
+ };
500
+ Clusterer.prototype.onIdle = function () {
501
+ this.redraw();
502
+ };
436
503
  Clusterer.prototype.onAdd = function () {
437
- var _this = this;
438
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
439
- // @ts-ignore
440
- this.activeMap = this.getMap();
504
+ var map = this.getMap();
505
+ this.activeMap = map;
441
506
  this.ready = true;
442
507
  this.repaint();
443
- // Add the map event listeners
444
- this.listeners = [
445
- google.maps.event.addListener(
446
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
447
- // @ts-ignore
448
- this.getMap(), 'zoom_changed', function () {
449
- _this.resetViewport(false);
450
- // Workaround for this Google bug: when map is at level 0 and "-" of
451
- // zoom slider is clicked, a "zoom_changed" event is fired even though
452
- // the map doesn't zoom out any further. In this situation, no "idle"
453
- // event is triggered so the cluster markers that have been removed
454
- // do not get redrawn. Same goes for a zoom in at maxZoom.
455
- if (
456
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
457
- // @ts-ignore
458
- _this.getMap().getZoom() === (_this.get('minZoom') || 0) ||
459
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
460
- // @ts-ignore
461
- _this.getMap().getZoom() === _this.get('maxZoom')) {
462
- google.maps.event.trigger(_this, 'idle');
463
- }
464
- }),
465
- google.maps.event.addListener(
466
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
467
- // @ts-ignore
468
- this.getMap(), 'idle', function () {
469
- _this.redraw();
470
- }),
471
- ];
508
+ if (map !== null) {
509
+ // Add the map event listeners
510
+ this.listeners = [
511
+ google.maps.event.addListener(map, 'zoom_changed', this.onZoomChanged),
512
+ google.maps.event.addListener(map, 'idle', this.onIdle),
513
+ ];
514
+ }
472
515
  };
473
516
  Clusterer.prototype.onRemove = function () {
474
517
  // Put all the managed markers back on the map:
@@ -513,9 +556,10 @@
513
556
  bounds.extend(position);
514
557
  }
515
558
  }
516
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
517
- // @ts-ignore
518
- this.getMap().fitBounds(bounds);
559
+ var map = this.getMap();
560
+ if (map !== null && 'fitBounds' in map) {
561
+ map.fitBounds(bounds);
562
+ }
519
563
  };
520
564
  Clusterer.prototype.getGridSize = function () {
521
565
  return this.gridSize;
@@ -705,27 +749,37 @@
705
749
  }, 0);
706
750
  };
707
751
  Clusterer.prototype.getExtendedBounds = function (bounds) {
708
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
709
- // @ts-ignore
710
752
  var projection = this.getProjection();
711
753
  // Convert the points to pixels and the extend out by the grid size.
712
754
  var trPix = projection.fromLatLngToDivPixel(
713
755
  // Turn the bounds into latlng.
714
756
  new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
715
- trPix.x += this.gridSize;
716
- trPix.y -= this.gridSize;
757
+ if (trPix !== null) {
758
+ trPix.x += this.gridSize;
759
+ trPix.y -= this.gridSize;
760
+ }
717
761
  var blPix = projection.fromLatLngToDivPixel(
718
762
  // Turn the bounds into latlng.
719
763
  new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));
720
- blPix.x -= this.gridSize;
721
- blPix.y += this.gridSize;
764
+ if (blPix !== null) {
765
+ blPix.x -= this.gridSize;
766
+ blPix.y += this.gridSize;
767
+ }
722
768
  // Extend the bounds to contain the new bounds.
723
- bounds.extend(
724
- // Convert the pixel points back to LatLng nw
725
- projection.fromDivPixelToLatLng(trPix));
726
- bounds.extend(
727
- // Convert the pixel points back to LatLng sw
728
- projection.fromDivPixelToLatLng(blPix));
769
+ if (trPix !== null) {
770
+ // Convert the pixel points back to LatLng nw
771
+ var point1 = projection.fromDivPixelToLatLng(trPix);
772
+ if (point1 !== null) {
773
+ bounds.extend(point1);
774
+ }
775
+ }
776
+ if (blPix !== null) {
777
+ // Convert the pixel points back to LatLng sw
778
+ var point2 = projection.fromDivPixelToLatLng(blPix);
779
+ if (point2 !== null) {
780
+ bounds.extend(point2);
781
+ }
782
+ }
729
783
  return bounds;
730
784
  };
731
785
  Clusterer.prototype.redraw = function () {
@@ -812,31 +866,21 @@
812
866
  delete this.timerRefStatic;
813
867
  }
814
868
  }
869
+ var map = this.getMap();
870
+ var bounds = map !== null && 'getBounds' in map ? map.getBounds() : null;
871
+ var zoom = (map === null || map === void 0 ? void 0 : map.getZoom()) || 0;
815
872
  // Get our current map view bounds.
816
873
  // Create a new bounds object so we don't affect the map.
817
874
  //
818
875
  // See Comments 9 & 11 on Issue 3651 relating to this workaround for a Google Maps bug:
819
- var mapBounds =
820
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
821
- // @ts-ignore
822
- this.getMap().getZoom() > 3
823
- ? new google.maps.LatLngBounds(
824
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
825
- // @ts-ignore
826
- this.getMap()
827
- .getBounds()
828
- .getSouthWest(),
829
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
830
- // @ts-ignore
831
- this.getMap()
832
- .getBounds()
833
- .getNorthEast())
876
+ var mapBounds = zoom > 3
877
+ ? new google.maps.LatLngBounds(bounds === null || bounds === void 0 ? void 0 : bounds.getSouthWest(), bounds === null || bounds === void 0 ? void 0 : bounds.getNorthEast())
834
878
  : new google.maps.LatLngBounds(new google.maps.LatLng(85.02070771743472, -178.48388434375), new google.maps.LatLng(-85.08136444384544, 178.00048865625));
835
- var bounds = this.getExtendedBounds(mapBounds);
879
+ var extendedMapBounds = this.getExtendedBounds(mapBounds);
836
880
  var iLast = Math.min(iFirst + this.batchSize, this.markers.length);
837
881
  for (var i = iFirst; i < iLast; i++) {
838
882
  var marker = this.markers[i];
839
- if (!marker.isAdded && this.isMarkerInBounds(marker, bounds) && (!this.ignoreHidden || (this.ignoreHidden && marker.getVisible()))) {
883
+ if (!marker.isAdded && this.isMarkerInBounds(marker, extendedMapBounds) && (!this.ignoreHidden || (this.ignoreHidden && marker.getVisible()))) {
840
884
  this.addToClosestCluster(marker);
841
885
  }
842
886
  }
@@ -862,19 +906,14 @@
862
906
  };
863
907
  Clusterer.prototype.extend = function (obj1, obj2) {
864
908
  return function applyExtend(object) {
865
- // eslint-disable-next-line guard-for-in
866
909
  for (var property in object.prototype) {
867
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
868
- // @ts-ignore
869
- this.prototype[property] = object.prototype[property];
910
+ this.prototype.set(property, object.prototype.get(property));
870
911
  }
871
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
872
- // @ts-ignore
873
912
  return this;
874
913
  }.apply(obj1, [obj2]);
875
914
  };
876
915
  return Clusterer;
877
- }());
916
+ }(google.maps.OverlayView));
878
917
 
879
918
  exports.Cluster = Cluster;
880
919
  exports.ClusterIcon = ClusterIcon;