This is a combination of 4 commits. Updates on geojson buttons, spider chart...

This is a combination of 4 commits. Updates on geojson buttons, spider chart max increased from 4 to 5, css fixes.

WIP

WIP 2

WIP 3

WIP 4

src/app/pages/simulation-wizard/results-map/results-map.component.html

@@ -22,10 +22,12 @@
           [status]="selectedGeojson == l.buttonLabel ? 'control' : 'primary'"
           *ngFor="let l of loadGeojsons"
         >
-          load {{ l.buttonLabel }} geojson
+          {{ l.buttonLabel }} geojson
         </button>
+        <span class="flex-grow-1"></span>
         <button
           nbButton
+          size="small"
           (click)="openOverviewOfIndicators(dialog)"
           nbTooltip="click for overview of indicators"
           [disabled]="selectedSimulation == undefined"

src/app/pages/simulation-wizard/results-map/results-map.component.scss

@@ -35,7 +35,7 @@
     width: calc(100% - 114px);
     border-radius: 0.25rem;
     display: flex;
-    justify-content: space-around;
+    justify-content: flex-start;
     flex-wrap: wrap;
     button {
       margin: 2px;

src/app/pages/simulation-wizard/results-map/results-map.component.ts

@@ -25,24 +25,7 @@ export class ResultsMapComponent implements OnChanges {
   };
   mapLegend = new L.Control({ position: "bottomright" });
   radioButtonLayersControl: any;
-  loadGeojsons: Object[] = [
-    {
-      response: undefined,
-      buttonLabel: "bikeability",
-    },
-    {
-      response: undefined,
-      buttonLabel: "bikeIntensity",
-    },
-    {
-      response: undefined,
-      buttonLabel: "bikeSafety",
-    },
-    {
-      response: undefined,
-      buttonLabel: "pollution",
-    },
-  ];
+  loadGeojsons: Object[] = [];
   checkedRadioButton: string = "";
   geoJsonStyleWeight: number = 5;
   geoJsonStyleOpacity: number = 0.8;
@@ -88,7 +71,7 @@ export class ResultsMapComponent implements OnChanges {
   onLoadClick(selectedKpi: string) {
     this.selectedGeojson = selectedKpi;
     this.resetLayersAndButton();
-    this.setMapZoom();
+    this.setMapZoomAndLoadGeojsons();
 
     if (this.radioButtonLayersControl)
       this.radioButtonLayersControl.remove(this.map);
@@ -624,13 +607,53 @@ export class ResultsMapComponent implements OnChanges {
     el.style.filter = "grayscale(" + (100 - this.grayscale) + "%)";
   }
 
-  setMapZoom() {
+  setMapZoomAndLoadGeojsons() {
+    if (this.selectedSimulation != undefined) {
       if (this.selectedSimulation["city"]["cityId"] == "amsterdam") {
         this.map.setView(new L.LatLng(52.4, 4.9), 9);
+        this.loadGeojsons = [
+          {
+            response: undefined,
+            buttonLabel: "bikeability",
+          },
+          {
+            response: undefined,
+            buttonLabel: "bikeIntensity",
+          },
+          {
+            response: undefined,
+            buttonLabel: "bikeSafety",
+          },
+          {
+            response: undefined,
+            buttonLabel: "pollution",
+          },
+        ];
       } else if (this.selectedSimulation["city"]["cityId"] == "bilbao") {
         this.map.setView(new L.LatLng(43.3, -2.9), 9);
       } else if (this.selectedSimulation["city"]["cityId"] == "helsinki") {
-      this.map.setView(new L.LatLng(60.2, 24.9), 9);
+        this.map.setView(
+          new L.LatLng(60.16005488265436, 24.920971999284017),
+          13
+        );
+        this.loadGeojsons = [
+          {
+            response: undefined,
+            buttonLabel: "congestionsAndBottlenecks",
+          },
+          {
+            response: undefined,
+            buttonLabel: "harbourAreaTrafficFlow",
+          },
+          {
+            response: undefined,
+            buttonLabel: "accousticPollution",
+          },
+          {
+            response: undefined,
+            buttonLabel: "pollution",
+          },
+        ];
       } else if (this.selectedSimulation["city"]["cityId"] == "messina") {
         this.map.setView(new L.LatLng(38.2, 15.6), 9);
       } else {
@@ -639,6 +662,7 @@ export class ResultsMapComponent implements OnChanges {
         });
       }
     }
+  }
 
   openOverviewOfIndicators(dialog: TemplateRef<any>) {
     this.dialogService.open(dialog, {
@@ -671,5 +695,7 @@ export class ResultsMapComponent implements OnChanges {
     Object.entries(this.loadGeojsons).forEach((entry) => {
       entry[1]["response"] = undefined;
     });
+
+    this.setMapZoomAndLoadGeojsons();
   }
 }