diff --git a/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.html b/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.html
index 034dc8a78eaa6f113a1a9ee6dae6219e4e00cd62..61932767cb64a78e55ae7e0fa313301af6e151a5 100644
--- a/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.html
+++ b/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.html
@@ -309,7 +309,8 @@
[disabled]="!selectedSimulation || runSimulationBtnDisabled"
>
Run simulation</button
- ><nb-icon
+ >
+ <!-- <nb-icon
[icon]="
runSimulation.status == 'running'
? 'loader-outline'
@@ -329,7 +330,7 @@
[ngClass]="{ 'icon-spin': runSimulation.status == 'running' }"
class="icon"
>
- </nb-icon>
+ </nb-icon> -->
</div>
<div class="mb-2 button-envelope">
<button
diff --git a/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.ts b/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.ts
index cb186bdd8bcfb6004ff71e96e89a33d306eb006f..8d609f2c4fc1e88d8dc087f700cffdbe0491f8c6 100644
--- a/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.ts
+++ b/src/app/pages/simulation-wizard/existing-simulations/existing-simulations.component.ts
@@ -425,10 +425,6 @@ export class ExistingSimulationsComponent implements OnInit {
// rudimentary way of concincing our-spider-chart to redownload evaluated json
this.selectedSimulationToEmit.emit(undefined);
setTimeout(() => {
- console.log(
- "🚀☢ ~ this.selectedSimulation.id.toString()",
- this.selectedSimulation
- );
this.selectedSimulationToEmit.emit(this.selectedSimulation);
this.showToast(`Updating spider chart.`, "Info", "info");
}, 0);
diff --git a/src/app/pages/simulation-wizard/ml-module/ml-module.component.scss b/src/app/pages/simulation-wizard/ml-module/ml-module.component.scss
index 119bac56c891fe19015a45efc4905c964bbc0465..0c7af6efce54b09ec0b6bbdab7daa408afed799f 100644
--- a/src/app/pages/simulation-wizard/ml-module/ml-module.component.scss
+++ b/src/app/pages/simulation-wizard/ml-module/ml-module.component.scss
@@ -27,4 +27,7 @@
}
}
}
+ a {
+ text-decoration: none;
+ }
}
diff --git a/src/app/pages/simulation-wizard/our-spider-chart/our-spider-chart.component.ts b/src/app/pages/simulation-wizard/our-spider-chart/our-spider-chart.component.ts
index 3d8db60aa3502d952a15600990695086dc404a10..ca1c8f45fecb3167a39aeec90d20881cfece75a6 100644
--- a/src/app/pages/simulation-wizard/our-spider-chart/our-spider-chart.component.ts
+++ b/src/app/pages/simulation-wizard/our-spider-chart/our-spider-chart.component.ts
@@ -98,7 +98,7 @@ export class OurSpiderChartComponent implements OnChanges {
values_B.push(entry[1] as string);
}
} else {
- console.log("🚀☢ Setting 0");
+ console.log("🚀☢ Setting 0 for ", entry[0]);
if (j == 0) {
values_A.push(0);
} else if (j == 1) {
diff --git a/src/app/pages/simulation-wizard/results-map/results-map.component.html b/src/app/pages/simulation-wizard/results-map/results-map.component.html
index ebe01d13d01e11837e33b2a5767c4f13471fb92b..79d70efe93ef1946bf3a7eaaa3b8491574a814ae 100644
--- a/src/app/pages/simulation-wizard/results-map/results-map.component.html
+++ b/src/app/pages/simulation-wizard/results-map/results-map.component.html
@@ -25,7 +25,36 @@
>
load {{ l }} geojson
</button>
+ <button
+ nbButton
+ (click)="openOverviewOfIndicators(dialog)"
+ nbTooltip="click for overview of indicators"
+ [disabled]="selectedSimulation == undefined"
+ >
+ <nb-icon icon="info-outline"></nb-icon>
+ </button>
</div>
+ <ng-template #dialog let-data let-ref="dialogRef">
+ <nb-card>
+ <nb-card-header
+ >Overview of Indicators for {{ data | titlecase }}
+ </nb-card-header>
+ <nb-card-body>
+ <img
+ src="{{
+ 'assets/images/overviewOfIndicators' +
+ data[0].toUpperCase() +
+ data.slice(1) +
+ '.png'
+ }}"
+ alt=""
+ />
+ </nb-card-body>
+ <nb-card-footer>
+ <button nbButton (click)="ref.close()">Close</button>
+ </nb-card-footer>
+ </nb-card>
+ </ng-template>
</div>
<div id="grayscaleInput">
<input
diff --git a/src/app/pages/simulation-wizard/results-map/results-map.component.ts b/src/app/pages/simulation-wizard/results-map/results-map.component.ts
index a4aac8e1b4753628707844c39b65666bf79a765b..28952550f6071605fcd7129e8b119757ab281b44 100644
--- a/src/app/pages/simulation-wizard/results-map/results-map.component.ts
+++ b/src/app/pages/simulation-wizard/results-map/results-map.component.ts
@@ -1,9 +1,9 @@
-import { Component, Input } from "@angular/core";
+import { Component, Input, TemplateRef } from "@angular/core";
import * as L from "leaflet";
import { SimulationService } from "../utils/services/simulation.service";
import * as MapColors from "./map-colors-local";
-import { legendInverted, ratiosBetweenGrades } from "./results-map-settings"
-import { NbToastrService } from "@nebular/theme";
+import { legendInverted, ratiosBetweenGrades } from "./results-map-settings";
+import { NbToastrService, NbDialogService } from "@nebular/theme";
import { Simulation } from "../utils/data/simulation";
@Component({
@@ -42,34 +42,35 @@ export class ResultsMapComponent {
constructor(
private simulationService: SimulationService,
- private toastrService: NbToastrService
- ) { }
+ private toastrService: NbToastrService,
+ private dialogService: NbDialogService
+ ) {}
onMapReady(map: L.Map) {
this.map = map;
this.grayscaleChange();
setTimeout(() => {
this.map.invalidateSize();
}, 50);
- setTimeout(() => {
- console.log(
- "%cTemporary",
- "background: crimson; font-weight: bold; color: black; font-family: serif; padding: 0 10px;"
- );
- const celkomplet: HTMLElement = document.querySelectorAll(
- ".ng-tns-c441-0.appearance-filled.size-medium.shape-rectangle.status-primary.ng-star-inserted.nb-transition"
- )[6] as HTMLElement;
- celkomplet.click();
- }, 995);
- setTimeout(() => {
- console.log(
- "%cTemporary",
- "background: peru; font-weight: bold; color: black; font-family: serif; padding: 0 10px;"
- );
- const celkomplet: HTMLElement = document.querySelectorAll(
- ".buttons.ng-tns-c441-0"
- )[0] as HTMLElement;
- celkomplet.style.display = "none";
- }, 1000);
+ // setTimeout(() => {
+ // console.log(
+ // "%cTemporary",
+ // "background: crimson; font-weight: bold; color: black; font-family: serif; padding: 0 10px;"
+ // );
+ // const celkomplet: HTMLElement = document.querySelectorAll(
+ // ".ng-tns-c441-0.appearance-filled.size-medium.shape-rectangle.status-primary.ng-star-inserted.nb-transition"
+ // )[6] as HTMLElement;
+ // celkomplet.click();
+ // }, 995);
+ // setTimeout(() => {
+ // console.log(
+ // "%cTemporary",
+ // "background: peru; font-weight: bold; color: black; font-family: serif; padding: 0 10px;"
+ // );
+ // const celkomplet: HTMLElement = document.querySelectorAll(
+ // ".buttons.ng-tns-c441-0"
+ // )[0] as HTMLElement;
+ // celkomplet.style.display = "none";
+ // }, 1000);
}
onLoad(selectedKpi: string) {
@@ -176,7 +177,10 @@ export class ResultsMapComponent {
this.maxKeyValues["maxValue_" + legendType] == undefined ||
this.maxKeyValues["maxValue_" + legendType] == 0
) {
- this.toastrService.info("Geojson not displayed because all values are undefined or zero!", "Geojson not displayed")
+ this.toastrService.info(
+ "Geojson not displayed because all values are undefined or zero!",
+ "Geojson not displayed"
+ );
let div = L.DomUtil.create("div");
div.innerHTML += `<p style='background:white; display: inline; font-size:17px; padding: 0 7px; background: #ff3d71'>Values for ${legendType} kpi are undefined or zero!</p>`;
return div;
@@ -186,24 +190,19 @@ export class ResultsMapComponent {
const grades = [
0,
this.limitMyDigits(
- this.maxKeyValues["maxValue_" + legendType] /
- ratiosBetweenGrades[0]
+ this.maxKeyValues["maxValue_" + legendType] / ratiosBetweenGrades[0]
),
this.limitMyDigits(
- this.maxKeyValues["maxValue_" + legendType] /
- ratiosBetweenGrades[1]
+ this.maxKeyValues["maxValue_" + legendType] / ratiosBetweenGrades[1]
),
this.limitMyDigits(
- this.maxKeyValues["maxValue_" + legendType] /
- ratiosBetweenGrades[2]
+ this.maxKeyValues["maxValue_" + legendType] / ratiosBetweenGrades[2]
),
this.limitMyDigits(
- this.maxKeyValues["maxValue_" + legendType] /
- ratiosBetweenGrades[3]
+ this.maxKeyValues["maxValue_" + legendType] / ratiosBetweenGrades[3]
),
this.limitMyDigits(
- this.maxKeyValues["maxValue_" + legendType] /
- ratiosBetweenGrades[4]
+ this.maxKeyValues["maxValue_" + legendType] / ratiosBetweenGrades[4]
),
];
@@ -364,8 +363,8 @@ export class ResultsMapComponent {
this.maxKeyValues["maxValue_" + keys[f]] == 0
) {
tmp = L.geoJSON(<any>{
- "type": "FeatureCollection",
- "features": []
+ type: "FeatureCollection",
+ features: [],
});
} else {
if (keys[f] == "capacity") {
@@ -377,7 +376,9 @@ export class ResultsMapComponent {
keys[f],
this.maxKeyValues[`maxValue_${keys[f]}`],
ratiosBetweenGrades,
- parseInt(feature["properties"]["capacity"]) == 9999 ? true : false
+ parseInt(feature["properties"]["capacity"]) == 9999
+ ? true
+ : false
),
opacity: this.geoJsonStyleOpacity,
}),
@@ -394,11 +395,13 @@ export class ResultsMapComponent {
color: MapColors.getColorHighToLow(
feature["properties"]["cityWide"]["traffic"]
.dailyInternalBikeTravels ||
- feature["properties"].dailyInternalBikeTravels,
+ feature["properties"].dailyInternalBikeTravels,
keys[f],
this.maxKeyValues[`maxValue_${keys[f]}`],
ratiosBetweenGrades,
- parseInt(feature["properties"]["capacity"]) == 9999 ? true : false
+ parseInt(feature["properties"]["capacity"]) == 9999
+ ? true
+ : false
),
opacity: this.geoJsonStyleOpacity,
}),
@@ -415,11 +418,13 @@ export class ResultsMapComponent {
color: MapColors.getColor(
feature["properties"]["cityWide"]["traffic"]
.pedestrianTravelTime ||
- feature["properties"].pedestrianTravelTime,
+ feature["properties"].pedestrianTravelTime,
keys[f],
this.maxKeyValues[`maxValue_${keys[f]}`],
ratiosBetweenGrades,
- parseInt(feature["properties"]["capacity"]) == 9999 ? true : false
+ parseInt(feature["properties"]["capacity"]) == 9999
+ ? true
+ : false
),
opacity: this.geoJsonStyleOpacity,
}),
@@ -438,7 +443,9 @@ export class ResultsMapComponent {
keys[f],
this.maxKeyValues[`maxValue_${keys[f]}`],
ratiosBetweenGrades,
- parseInt(feature["properties"]["capacity"]) == 9999 ? true : false
+ parseInt(feature["properties"]["capacity"]) == 9999
+ ? true
+ : false
),
opacity: this.geoJsonStyleOpacity,
}),
@@ -473,17 +480,17 @@ export class ResultsMapComponent {
if (this.maxKeyValues[`maxValue_${keys[f]}`] == undefined) {
this.maxKeyValues[`maxValue_${keys[f]}`] =
jsonFile["features"][g]["properties"]["cityWide"]["pollution"][
- keys[f]
+ keys[f]
];
}
if (
jsonFile["features"][g]["properties"]["cityWide"]["pollution"][
- keys[f]
+ keys[f]
] > this.maxKeyValues[`maxValue_${keys[f]}`]
) {
this.maxKeyValues[`maxValue_${keys[f]}`] =
jsonFile["features"][g]["properties"]["cityWide"]["pollution"][
- keys[f]
+ keys[f]
];
}
}
@@ -494,17 +501,17 @@ export class ResultsMapComponent {
if (this.maxKeyValues[`maxValue_${keys[f]}`] == undefined) {
this.maxKeyValues[`maxValue_${keys[f]}`] =
jsonFile["features"][g]["properties"]["cityWide"]["traffic"][
- keys[f]
+ keys[f]
];
}
if (
jsonFile["features"][g]["properties"]["cityWide"]["traffic"][
- keys[f]
+ keys[f]
] > this.maxKeyValues[`maxValue_${keys[f]}`]
) {
this.maxKeyValues[`maxValue_${keys[f]}`] =
jsonFile["features"][g]["properties"]["cityWide"]["traffic"][
- keys[f]
+ keys[f]
];
}
}
@@ -584,4 +591,10 @@ export class ResultsMapComponent {
});
}
}
+
+ openOverviewOfIndicators(dialog: TemplateRef<any>) {
+ this.dialogService.open(dialog, {
+ context: this.selectedSimulation["city"]["cityId"]
+ });
+ }
}
diff --git a/src/assets/images/overviewOfIndicatorsAmsterdam.png b/src/assets/images/overviewOfIndicatorsAmsterdam.png
new file mode 100644
index 0000000000000000000000000000000000000000..06b8ff8eadfc3d28210c222b8bf1f0e182406e3d
Binary files /dev/null and b/src/assets/images/overviewOfIndicatorsAmsterdam.png differ
diff --git a/src/assets/images/overviewOfIndicatorsBilbao.png b/src/assets/images/overviewOfIndicatorsBilbao.png
new file mode 100644
index 0000000000000000000000000000000000000000..f1412b8aa99c3db2cf2de7f32d5325b671984f91
Binary files /dev/null and b/src/assets/images/overviewOfIndicatorsBilbao.png differ
diff --git a/src/assets/images/overviewOfIndicatorsHelsinki.png b/src/assets/images/overviewOfIndicatorsHelsinki.png
new file mode 100644
index 0000000000000000000000000000000000000000..97521a8252ce50e181a6f27038f572721380d81b
Binary files /dev/null and b/src/assets/images/overviewOfIndicatorsHelsinki.png differ
diff --git a/src/assets/images/overviewOfIndicatorsMessina.png b/src/assets/images/overviewOfIndicatorsMessina.png
new file mode 100644
index 0000000000000000000000000000000000000000..12900cd5021e9868289266dc067dda3a3da74b66
Binary files /dev/null and b/src/assets/images/overviewOfIndicatorsMessina.png differ