added points from backend to the map

pinsisApp/src/app/_services/marker.service.ts

@@ -2,7 +2,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import * as L from 'leaflet';
 import { PopUpService } from './pop-up.service';
-
+import { HospitalService } from '../hospital.service';
 
 
 @Injectable()
@@ -10,22 +10,25 @@ export class MarkerService {
 
   capitals: string = '/assets/data/usa-capitals.geojson';
 
-  constructor(private http: HttpClient,private popupService: PopUpService) {
+  constructor(private http: HttpClient,
+              private popupService: PopUpService,
+              private hospitalService: HospitalService) {
   }
   makeCapitalMarkers(map: L.map): void {
-    this.http.get(this.capitals).subscribe((res: any) => {
-      for (const c of res.features) {
-        const lat = c.geometry.coordinates[0];
-        const lon = c.geometry.coordinates[1];
-        const marker = L.marker([lon, lat]);
-        marker.bindPopup(this.popupService.makeCapitalPopup(c.properties));
-        marker.addTo(map);
-      }
-
-
-    });
-
+    this.hospitalService.getHospitals()
+      .subscribe(data => {
+        for (let hospital of data) {
+          let marker = L.marker([
+            hospital.geo_lat, 
+            hospital.geo_long
+            ])
+          let properties = {
+            name: hospital.hospital_name,
+            city: hospital.hospital_city
+          }
+          marker.bindPopup(this.popupService.makeCapitalPopup(properties));
+          marker.addTo(map);
+        }
+      })
   }
-
-
 }

pinsisApp/src/app/_services/pop-up.service.ts

@@ -6,7 +6,7 @@ export class PopUpService {
   constructor() { }
   makeCapitalPopup(data: any): string {
     return `` +
-      `<div>Hospital: ${ data.state }</div>` +
-      `<div>Cidade: ${ data.name }</div>` ;
+      `<div>Hospital: ${ data.name }</div>` +
+      `<div>Cidade: ${ data.city }</div>` ;
   }
 }

pinsisApp/src/app/hospital.service.ts

@@ -14,7 +14,6 @@ import { FormBuilder, FormGroup } from '@angular/forms';
 export class HospitalService {
 
   private hospitalURL = environment.webserviceUrl+"/api/data";
-  //get: private hospitalURL = environment.webserviceUrl+"/api/data/listagents";
 
   httpOptions = { headers: new HttpHeaders({ }) };
 
@@ -45,6 +44,13 @@ export class HospitalService {
       );
   }
 
+	getHospitals(): Observable<any> {
+		return this.http.get(this.hospitalURL+"/listagents")
+			.pipe(
+				tap(_ => console.log('fetched hospitals')),
+				catchError(this.handleError<Observable<any>>()));
+	}
+
   private handleError<T> (result?: T) {
     return (error: any): Observable<T> => {
       console.error(error);

pinsisApp/src/assets/data/usa-capitals.geojson

-{
-  "type": "FeatureCollection",
-  "features": [
-
-    {
-      "type": "Feature",
-      "geometry": {
-        "type": "Point",
-        "coordinates": [
-          -49.238800,
-          -25.453400
-        ]
-      },
-      "properties": {
-        "state": "Erasto Gaertner",
-        "name": "Curitiba",
-        "population": 350395
-      }
-    },
-    {
-      "type": "Feature",
-      "geometry": {
-        "type": "Point",
-        "coordinates": [
-          -49.231700,
-          -25.4505
-        ]
-      },
-      "properties": {
-        "state": "C3SL",
-        "name": "Curitiba",
-        "population": 350395
-      }
-    }
-
-  ]
-}