supercluster-googlemaps-adapter - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

lib/builder.d.ts

@@ -20,2 +20,4 @@ /// <reference types="googlemaps" />
     private pOverlapMarkerSpiderfier;
+    private pUseServerSideClusterer;
+    private pGetClustersServerSide;
     constructor(map: google.maps.Map);
@@ -35,2 +37,3 @@ withRadius(radius: number): Builder;
     withOverlapMarkerSpiderfier(oms: OverlappingMarkerSpiderfier): Builder;
+    withGetClustersServerSide(getClusters: (bbox: GeoJSON.BBox, zoom: number) => Promise<any[]>): Builder;
     build(): SuperClusterAdapter;
@@ -51,2 +54,4 @@ get map(): google.maps.Map;
     get overlapMarkerSpiderfier(): OverlappingMarkerSpiderfier | null;
+    get useServerSideClusterer(): boolean;
+    get getClustersServerSide(): (bbox: GeoJSON.BBox, zoom: number) => Promise<any[]>;
 }

lib/clusterer.d.ts

@@ -17,3 +17,2 @@ /// <reference types="googlemaps" />
     private pMarkers;
-    private pZoomChangedListener;
     private pIdleListener;
@@ -29,2 +28,4 @@ private pIndex;
     private pOverlapMarkerSpiderfier;
+    private pUseServerSideClusterer;
+    private pGetClustersServerSide;
     constructor(build: Builder);
@@ -43,2 +44,3 @@ get map(): google.maps.Map;
     get features(): Supercluster.PointFeature<Supercluster.AnyProps>[];
+    get useServerSideClusterer(): boolean;
     setVisible(v: boolean): void;
@@ -45,0 +47,0 @@ setVisibleMarkersAndClusters(v: boolean): void;

lib/helper.d.ts

 /// <reference types="googlemaps" />
 import { SuperClusterAdapter } from './clusterer';
 export declare class ClustererHelper {
+    private static newId;
     static featureCenter(feature: google.maps.Data.Feature): google.maps.LatLng;
@@ -9,2 +10,6 @@ static featureBounds(feature: google.maps.Data.Feature): google.maps.LatLngBounds;
     static setClusterer(map: google.maps.Map, clusterer: SuperClusterAdapter): void;
+    static getClusterBounds(map: google.maps.Map, marker: google.maps.Marker, radius: number): google.maps.LatLngBounds;
+    static getNewId(): number;
+    private static fromLatLngToPixel;
+    private static fromPixelToLatLng;
 }

lib/index.d.ts

@@ -1,4 +0,3 @@
-import { ISuperClusterAdapterStatic } from './interfaces';
 export declare class SuperClusterAdapterLoader {
-    static getClusterer(): Promise<ISuperClusterAdapterStatic | undefined>;
+    static getClusterer(): Promise<any>;
 }

lib/interfaces.d.ts

 /// <reference types="googlemaps" />
 import * as GeoJSON from 'geojson';
-import { Builder } from './builder';
 export interface ISuperClusterAdapter {
@@ -24,5 +23,2 @@ map: google.maps.Map;
 }
-export interface ISuperClusterAdapterStatic {
-    Builder: typeof Builder;
-}
 export interface IStyle {
@@ -29,0 +25,0 @@ url: string;

package.json

 {
   "name": "supercluster-googlemaps-adapter",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Supercluster Adapter for Google Maps JavaScript API v3",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -251,2 +251,36 @@ # Supercluster Adapter for Google Maps JavaScript API v3
 
+#### withGetClustersServerSide(getClusters: (bbox: GeoJSON.BBox, zoom: number) => Promise<any[]>)
+
+In certain situations you are probably prefer to hand off cluster calculation to server side code. For example, you can implement server side calculation with [JavaSuperCluster](https://github.com/utahemre/JavaSuperCluster) or some similar library.
+
+In this case you can define an asynchronous callback function that will retrieve clusters from the backend and return an array of clusters and markers. Internally it will use a transformation function that you defined in the `withServerSideFeatureToSuperCluster()` method to convert your items into GeoJSON [feature][feature] of the supercluster library.
+
+The callback function will receive two parameters. The first one is the bounding box where we want calculate clusters as a GeoJSON [bounding box][bbox] array. The second parameter is a zoom level of the map.
+
+E.g.
+
+    const clusterer = new Clusterer.Builder(map)
+        .withServerSideFeatureToSuperCluster(itemToSuperclusterFeature)
+        .withGetClustersServerSide(async (bbox, zoom) => {
+            let features;
+            const query = `{"bounds":{"west":${bbox[0]},"south":${bbox[1]},"east":${bbox[2]},"north":${bbox[3]}}, "zoom":${zoom}}`;
+            try {
+              const response = await fetch(url + encodeURIComponent(query));
+              if (response.ok) {
+                const featureCollection = await response.json();
+                features = featureCollection.features;
+              } else {
+                console.log(`Cannot fetch server side clusters data for this example ${response.statusText}`);
+                features = [];
+              }
+            } catch (err) {
+              console.log(`Cannot fetch server side clusters data for this example ${err}`);
+              features = [];
+            }
+            return features;
+        })
+        .build();
+
+Please note that if you defined the callback function using `withGetClustersServerSide()` there is no need to call `drawServerSideCalculatedClusters(features: any[])` anymore. It will be called automatically.
+
 #### withOverlapMarkerSpiderfier(oms: OverlappingMarkerSpiderfier)
@@ -309,2 +343,8 @@
 
+Do not use this method if you defined the `withGetClustersServerSide()` callback. The typical scenario when you might need the `drawServerSideCalculatedClusters()` is the following:
+
+- You retrieve clusters from you backend on initial map load and draw clusters with this method
+- You simultaneously retrieve a complete GeoJSON [collection][feature-collection] of all items and call `load()` method
+- Once all features are loaded into supercluster adapter the further processing is completely client side and you don't need any server side call anymore.
+
 ### Other public methods available on clusterer object
@@ -352,2 +392,3 @@
 [point]: https://tools.ietf.org/html/rfc7946#section-3.1.2
+[bbox]: https://tools.ietf.org/html/rfc7946#section-5
 [marker]: https://developers.google.com/maps/documentation/javascript/reference/marker#Marker
@@ -354,0 +395,0 @@ [mouseevent]: https://developers.google.com/maps/documentation/javascript/reference/map#MouseEvent

No alert changes

Improved metrics

Total package byte prevSize

332581

increased by36.85%

Lines of code

391

increased by8.61%

Number of lines in readme file

396

increased by11.55%

No dependency changes