@react-google-maps/marker-clusterer - npm Package Compare versions

Comparing version 1.2.0-alpha.6 to 1.2.0-alpha.8

lib/Cluster.js

@@ -7,3 +7,3 @@ "use strict";
         this.markerClusterer = markerClusterer;
-        this.map = this.markerClusterer.overlayView.getMap();
+        this.map = this.markerClusterer.getMap();
         this.gridSize = this.markerClusterer.getGridSize();
@@ -41,3 +41,3 @@ this.minClusterSize = this.markerClusterer.getMinimumClusterSize();
     Cluster.prototype.remove = function () {
-        this.clusterIcon.overlayView.setMap(null);
+        this.clusterIcon.setMap(null);
         this.markers = [];
@@ -44,0 +44,0 @@ delete this.markers;

lib/Clusterer.d.ts

@@ -27,3 +27,2 @@ /// <reference types="googlemaps" />
     timerRefStatic: number | null;
-    overlayView: google.maps.OverlayView;
     constructor(map: google.maps.Map, optMarkers?: MarkerExtended[], optOptions?: ClustererOptions);
@@ -30,0 +29,0 @@ onAdd(): void;

lib/Clusterer.js

@@ -30,3 +30,3 @@ "use strict";
         if (optOptions === void 0) { optOptions = {}; }
-        this.overlayView = new google.maps.OverlayView();
+        this.extend(Clusterer, google.maps.OverlayView);
         this.markers = [];
@@ -71,18 +71,18 @@ this.clusters = [];
         this.addMarkers(optMarkers, true);
-        this.overlayView.setMap(map);
+        this.setMap(map);
     }
     Clusterer.prototype.onAdd = function () {
         var _this = this;
-        this.activeMap = this.overlayView.getMap();
+        this.activeMap = this.getMap();
         this.ready = true;
         this.repaint();
         this.listeners = [
-            google.maps.event.addListener(this.overlayView.getMap(), "zoom_changed", function () {
+            google.maps.event.addListener(this.getMap(), "zoom_changed", function () {
                 _this.resetViewport(false);
-                if (_this.overlayView.getMap().getZoom() === (_this.overlayView.get("minZoom") || 0) ||
-                    _this.overlayView.getMap().getZoom() === _this.overlayView.get("maxZoom")) {
+                if (_this.getMap().getZoom() === (_this.get("minZoom") || 0) ||
+                    _this.getMap().getZoom() === _this.get("maxZoom")) {
                     google.maps.event.trigger(_this, "idle");
                 }
             }),
-            google.maps.event.addListener(this.overlayView.getMap(), "idle", function () {
+            google.maps.event.addListener(this.getMap(), "idle", function () {
                 _this.redraw();
@@ -128,5 +128,3 @@ })
         }
-        this
-            .overlayView.getMap()
-            .fitBounds(bounds);
+        this.getMap().fitBounds(bounds);
     };
@@ -317,3 +315,3 @@ Clusterer.prototype.getGridSize = function () {
     Clusterer.prototype.getExtendedBounds = function (bounds) {
-        var projection = this.overlayView.getProjection();
+        var projection = this.getProjection();
         var trPix = projection.fromLatLngToDivPixel(new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
@@ -394,10 +392,4 @@ trPix.x += this.gridSize;
         }
-        var mapBounds = this.overlayView.getMap().getZoom() > 3
-            ? new google.maps.LatLngBounds(this.overlayView
-                .getMap()
-                .getBounds()
-                .getSouthWest(), this.overlayView
-                .getMap()
-                .getBounds()
-                .getNorthEast())
+        var mapBounds = this.getMap().getZoom() > 3
+            ? new google.maps.LatLngBounds(this.getMap().getBounds().getSouthWest(), this.getMap().getBounds().getNorthEast())
             : new google.maps.LatLngBounds(new google.maps.LatLng(85.02070771743472, -178.48388434375), new google.maps.LatLng(-85.08136444384544, 178.00048865625));
@@ -404,0 +396,0 @@ var bounds = this.getExtendedBounds(mapBounds);

lib/ClusterIcon.d.ts

@@ -24,3 +24,2 @@ /// <reference types="googlemaps" />
     backgroundPosition: string;
-    overlayView: google.maps.OverlayView;
     boundsChangedListener: google.maps.MapsEventListener | null;
@@ -27,0 +26,0 @@ constructor(cluster: Cluster, styles: ClusterIconStyle[]);

lib/ClusterIcon.js

@@ -5,3 +5,3 @@ "use strict";
     function ClusterIcon(cluster, styles) {
-        this.overlayView = new google.maps.OverlayView();
+        cluster.getClusterer().extend(ClusterIcon, google.maps.OverlayView);
         this.cluster = cluster;
@@ -27,3 +27,3 @@ this.className = this.cluster.getClusterer().getClusterClass();
         this.backgroundPosition = '0 0';
-        this.overlayView.setMap(cluster.getMap());
+        this.setMap(cluster.getMap());
     }
@@ -39,4 +39,4 @@ ClusterIcon.prototype.onAdd = function () {
         }
-        this.overlayView.getPanes().overlayMouseTarget.appendChild(this.div);
-        this.boundsChangedListener = google.maps.event.addListener(this.overlayView.getMap(), "boundschanged", function boundsChabged() {
+        this.getPanes().overlayMouseTarget.appendChild(this.div);
+        this.boundsChangedListener = google.maps.event.addListener(this.getMap(), "boundschanged", function boundsChabged() {
             cDraggingMapByCluster = cMouseDownInCluster;
@@ -57,11 +57,7 @@ });
                     var bounds_1 = _this.cluster.getBounds();
-                    markerClusterer_1.overlayView
-                        .getMap()
-                        .fitBounds(bounds_1);
+                    markerClusterer_1.getMap().fitBounds(bounds_1);
                     setTimeout(function timeout() {
-                        markerClusterer_1.overlayView
-                            .getMap()
-                            .fitBounds(bounds_1);
-                        if (maxZoom_1 !== null && (markerClusterer_1.overlayView.getMap().getZoom() > maxZoom_1)) {
-                            markerClusterer_1.overlayView.getMap().setZoom(maxZoom_1 + 1);
+                        markerClusterer_1.getMap().fitBounds(bounds_1);
+                        if (maxZoom_1 !== null && (markerClusterer_1.getMap().getZoom() > maxZoom_1)) {
+                            markerClusterer_1.getMap().setZoom(maxZoom_1 + 1);
                         }
@@ -173,3 +169,3 @@ }, 100);
     ClusterIcon.prototype.getPosFromLatLng = function (latlng) {
-        var pos = this.overlayView.getProjection().fromLatLngToDivPixel(latlng);
+        var pos = this.getProjection().fromLatLngToDivPixel(latlng);
         pos.x -= this.anchorIcon[1];
@@ -176,0 +172,0 @@ pos.y -= this.anchorIcon[0];

package.json

 {
   "name": "@react-google-maps/marker-clusterer",
-  "version": "1.2.0-alpha.6",
+  "version": "1.2.0-alpha.8",
   "description": "Marker Clusterer for React.js Google Maps API",
@@ -5,0 +5,0 @@ "license": "MIT",

No alert changes

Worsened metrics

Total package byte prevSize

77962

-1.02%

Lines of code

1994

-0.6%

No dependency changes