✨ add current water level WMS

src/app/app.component.ts

@@ -1,16 +1,12 @@
 import {Component} from '@angular/core';
 
 import {GeoJSON} from 'ol/format';
-import {OSM, Vector as VectorSource} from 'ol/source';
+import {OSM, TileWMS, Vector as VectorSource} from 'ol/source';
 import {Tile, Vector as VectorLayer} from 'ol/layer';
 import {View} from 'ol';
 import {transform} from 'ol/proj';
 
-import {
-  HsConfig,
-  HsEventBusService,
-  HsToastService
-} from 'hslayers-ng';
+import {HsConfig, HsEventBusService, HsToastService} from 'hslayers-ng';
 
 @Component({
   selector: 'application-root',
@@ -20,12 +16,27 @@ import {
 export class HslayersAppComponent {
   /* You can name your app as you like or not at all */
   title = 'irrigation-management';
+
   constructor(
     /* Inject here all modules from HSLayers-NG which you intend to use */
     public hsConfig: HsConfig,
     private hsEventBusService: HsEventBusService,
-    private hsToastService: HsToastService,
+    private hsToastService: HsToastService
   ) {
+    const reservoirWmsLayer = new Tile({
+      properties: {
+        title: 'Current water level',
+        base: false,
+        removable: false,
+      },
+      source: new TileWMS({
+        url: 'https://www.gis.atapex.sk/geoserver/agrihub/wms',
+        params: {
+          LAYERS: 'water_surface_latest',
+        },
+      }),
+      visible: true,
+    });
     /* Define the polygon's style using SLD */
     const polygonSld = `<?xml version="1.0" encoding="ISO-8859-1"?>
       <StyledLayerDescriptor version="1.0.0" 
@@ -106,26 +117,7 @@ export class HslayersAppComponent {
           },
         }),
         /* One thematic layer */
-        new VectorLayer({
-          properties: {
-            title: 'Reservoir',
-            synchronize: false,
-            cluster: false,
-            inlineLegend: true,
-            /*popUp: {
-              attributes: ['population'],
-            },*/
-            editor: {
-              editable: false,
-            },
-            sld: polygonSld,
-            //path: 'User generated',
-          },
-          source: new VectorSource({
-            format: new GeoJSON(),
-            url: '../assets/reservoir.geojson',
-          }),
-        }),
+        reservoirWmsLayer,
       ],
       default_view: new View({
         center: transform([18.25, 48.15], 'EPSG:4326', 'EPSG:3857'),
@@ -143,9 +135,10 @@ export class HslayersAppComponent {
         'READY!',
         'Your map is now ready to use.',
         {
-          toastStyleClasses: 'bg-success text-white' /* Use any Bootstrap class here, see https://getbootstrap.com/docs/4.0/utilities/colors/ */
+          toastStyleClasses:
+            'bg-success text-white' /* Use any Bootstrap class here, see https://getbootstrap.com/docs/4.0/utilities/colors/ */,
         }
       );
-    })
+    });
   }
 }