This is a combination of 3 commits.

turned legend around where it has to be inverted

added a comment. We got at least one mistake with capacity

added a comment

src/app/pages/simulation-wizard/results-map/map-colors-local.ts

@@ -141,4 +141,18 @@ export function getColorForLegend(id: number): string {
     : color_5;
 }
 
+export function getColorForLegendHighToLow(id: number): string {
+  return id == 5
+    ? color_5
+    : id == 4
+    ? color_4
+    : id == 3
+    ? color_3
+    : id == 2
+    ? color_2
+    : id == 1
+    ? color_1
+    : color_0;
+}
+
 export const colorsAll = [color_0, color_1, color_2, color_3, color_4, color_5];

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

@@ -308,21 +308,21 @@ export class ResultsMapComponent implements OnChanges {
           this.newBrinkValues.get(`legend_${i - 1}`).setValue(`${grades[i]}`);
         }
       } else {
-        for (let i = 5; i > 0; i--) {
         div.innerHTML +=
           "<p style='background:white; display: inline; font-size:17px'> <span style='color:" +
-            MapColors.getColorForLegend(5 - i) +
+          MapColors.getColorForLegendHighToLow(0) +
+          "'>&#9632</span> <" +
+          grades[1] +
+          "</p>";
+        for (let i = 1; i < 6; i++) {
+          div.innerHTML +=
+            "<p style='background:white; display: inline; font-size:17px'> <span style='color:" +
+            MapColors.getColorForLegendHighToLow(i) +
             "'>&#9632</span> " +
             grades[i] +
             (grades[i + 1] ? "&ndash;" + grades[i + 1] + "</p>" : "+</p>");
           this.newBrinkValues.get(`legend_${i - 1}`).setValue(`${grades[i]}`);
         }
-        div.innerHTML +=
-          "<p style='background:white; display: inline; font-size:17px'> <span style='color:" +
-          MapColors.getColorForLegend(5) +
-          "'>&#9632</span> <" +
-          grades[1] +
-          "</p>";
       }
 
       return div;
@@ -517,6 +517,28 @@ export class ResultsMapComponent implements OnChanges {
                   mouseout: (e) => this.resetFeature(e, feature.properties),
                 }),
             });
+          } else if (legendInverted.indexOf(keys[f]) > -1) {
+            console.log(" inverted and after new values");
+            tmp = L.geoJSON(<any>jsonFile, {
+              style: (feature) => ({
+                weight: this.geoJsonStyleWeight,
+                color: MapColors.getNewColor(
+                  this.newBrinkValues,
+                  feature["properties"],
+                  keys[f],
+                  parseInt(feature["properties"]["capacity"]) == 9999
+                    ? true
+                    : false
+                ),
+                opacity: this.geoJsonStyleOpacity,
+              }),
+              onEachFeature: (feature, layer) =>
+                layer.on({
+                  mouseover: (e) =>
+                    this.highlightFeature(e, feature.properties),
+                  mouseout: (e) => this.resetFeature(e, feature.properties),
+                }),
+            });
           } else {
             tmp = L.geoJSON(<any>jsonFile, {
               style: (feature) => ({
@@ -651,6 +673,9 @@ export class ResultsMapComponent implements OnChanges {
   }
 
   public populateMaxKeyValues(jsonFile: Object, keys: Object[]) {
+    console.log(
+      " if two or more geojsons have 'capacity', then the it will not work correctly"
+    );
     for (let g = 0; g < jsonFile["features"].length; g++) {
       for (let f = 0; f < keys.length; f++) {
         if (