- add bar component wit d3.js

- new dataset-by-station-selector.component with angular/material/dialog
- zoom.componentn: disable button at lasst zoom level

src/app/views/map-view/map-view.component.ts

@@ -1,10 +1,15 @@
 import { Component, OnInit } from '@angular/core';
 
-import { ParameterFilter, Station } from '@helgoland/core';
+import { ParameterFilter } from '@helgoland/core';
+import { GeomonPlatform } from './../../../shared/models/platform';
 import { LayerOptions } from '@helgoland/map';
 import { Marker, MapOptions, Control, icon, LatLngBoundsExpression } from 'leaflet';
-// optional, to adapt leaflet markers
 
+import { Station } from '../../../shared/models/station';
+import { DatasetByStationSelectorComponent } from './../../components/dataset-by-station-selector/dataset-by-station-selector.component';
+import { MatDialog } from '@angular/material/dialog';
+
+// optional, to adapt leaflet markers
 Marker.prototype.options.icon = icon({
     iconRetinaUrl: 'assets/img/marker-icon-2x.png',
     iconUrl: 'assets/img/marker-icon.png',
@@ -16,6 +21,8 @@ Marker.prototype.options.icon = icon({
     shadowSize: [41, 41]
 });
 
+const DIALOG_MAX_WIDTH = '95%';
+
 @Component({
     selector: 'gba-map-view',
     templateUrl: './map-view.component.html',
@@ -23,7 +30,9 @@ Marker.prototype.options.icon = icon({
 })
 export class MapViewComponent implements OnInit {
 
-    constructor() {
+    constructor(
+        private dialog: MatDialog,
+    ) {
         //
     }
 
@@ -56,7 +65,16 @@ export class MapViewComponent implements OnInit {
     };
 
     public onStationSelected(station: Station) {
-        console.log('Clicked station: ' + station.properties.label);
+        // console.log('Clicked station: ' + station.properties.label);
+        const dialogRef = this.dialog.open(DatasetByStationSelectorComponent, { 
+            height: '400px',
+            width: '600px',
+            maxWidth: DIALOG_MAX_WIDTH ,
+            hasBackdrop: true, //Here line to add
+            // panelClass: 'custom-dialog-container'
+        });
+        dialogRef.componentInstance.station = station;
+        dialogRef.componentInstance.url = this.providerUrl;
     }
 
     public onMapInitialized(newItem: string) {