feat(AgmDataLayer): add loadGeoJson method

Closes #1003
sebholstein · Jun 18, 2017 · 128c8f3 · 128c8f3
1 parent 9b6b878
commit 128c8f3
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 10 deletions.
diff --git a/src/core/directives/data-layer.ts b/src/core/directives/data-layer.ts
@@ -214,7 +214,7 @@ export class AgmDataLayer implements OnInit, OnDestroy, OnChanges {
   /**
    * The geoJson to be displayed
    */
-  @Input() geoJson: Object | null = null;
+  @Input() geoJson: Object | string | null = null;
 
   /**
    * The layer's style function.

diff --git a/src/core/services/google-maps-api-wrapper.ts b/src/core/services/google-maps-api-wrapper.ts
@@ -77,6 +77,17 @@ export class GoogleMapsAPIWrapper {
     });
   }
 
+  /**
+   * Creates a new google.map.Data layer for the current map
+   */
+  createDataLayer(options?: mapTypes.DataOptions): Promise<mapTypes.Data> {
+    return this._map.then(m => {
+      let data = new google.maps.Data(options);
+      data.setMap(m);
+      return data;
+    });
+  }
+
   /**
    * Determines if given coordinates are insite a Polygon path.
    */

diff --git a/src/core/services/google-maps-types.ts b/src/core/services/google-maps-types.ts
@@ -389,6 +389,7 @@ export interface Data extends MVCObject {
   */
   setStyle(style: () => void): void;
   forEach(callback: (feature: Feature) => void): void;
+  loadGeoJson(url: string, options?: GeoJsonOptions, callback?: (feats: Feature[]) => void): void;
   /* tslint:enable */
 }
 

diff --git a/src/core/services/managers/data-layer-manager.ts b/src/core/services/managers/data-layer-manager.ts
@@ -22,15 +22,14 @@ export class DataLayerManager {
    * Adds a new Data Layer to the map.
    */
   addDataLayer(layer: AgmDataLayer) {
-    const newLayer = this._wrapper.getNativeMap().then(m => {
-      var dataLayer = new google.maps.Data(<DataOptions>{
-        map: m,
-        style: layer.style
-      });
+    const newLayer = this._wrapper.createDataLayer(<DataOptions>{
+      style: layer.style
+    })
+    .then(d => {
       if (layer.geoJson) {
-        dataLayer.features = dataLayer.addGeoJson(layer.geoJson);
+        this.getDataFeatures(d, layer.geoJson).then(features => d.features = features);
       }
-      return dataLayer;
+      return d;
     });
     this._layers.set(layer, newLayer);
   }
@@ -42,7 +41,7 @@ export class DataLayerManager {
     });
   }
 
-  updateGeoJson(layer: AgmDataLayer, geoJson: Object) {
+  updateGeoJson(layer: AgmDataLayer, geoJson: Object | string) {
     this._layers.get(layer).then(l => {
       l.forEach(function (feature: Feature) {
         l.remove(feature);
@@ -52,7 +51,7 @@ export class DataLayerManager {
           l.features.splice(index, 1);
         }
       });
-      l.features = l.addGeoJson(geoJson);
+      this.getDataFeatures(l, geoJson).then(features => l.features = features);
     });
   }
 
@@ -76,4 +75,26 @@ export class DataLayerManager {
       });
     });
   }
+
+  /**
+   * Extract features from a geoJson using google.maps Data Class
+   * @param d : google.maps.Data class instance
+   * @param geoJson : url or geojson object
+   */
+  getDataFeatures(d: Data, geoJson: Object | string): Promise<Feature[]> {
+    return new Promise<Feature[]>((resolve, reject) => {
+        if (typeof geoJson === 'object') {
+          try {
+            const features = d.addGeoJson(geoJson);
+            resolve(features);
+          } catch (e) {
+            reject(e);
+          }
+        } else if (typeof geoJson === 'string') {
+          d.loadGeoJson(geoJson, null, resolve);
+        } else {
+          reject(`Impossible to extract features from geoJson: wrong argument type`);
+        }
+      });
+  }
 }