💄 show all regions at once

src/app/app.component.html

@@ -8,7 +8,7 @@
   </div>
   <div class="pl-2">
     <h3>About System Dynamics Modelling</h3>
-    <p></p>
+    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iusto doloremque recusandae cumque minus qui modi deleniti molestiae harum eius, facere quae quas, inventore est. Ullam voluptate libero porro architecto dolores.</p>
     <p></p>
   </div>
   <div class="pl-2">
@@ -23,12 +23,9 @@
     <all-in-one-graph></all-in-one-graph>
   </div>
   <div class="graph-row-plotly">
-    <select [(ngModel)]="selectedRegion">
       <ng-container *ngFor="let region of sdmDihService.regions">
-        <option [ngValue]="region">{{region}}</option>
+        <region-graph [region]="region"></region-graph>
       </ng-container>
-    </select>
-    <region-graph [region]="selectedRegion"></region-graph>
   </div>
   <div class="map-row">
     <h2>Map-based comparison</h2>

src/app/app.component.ts

@@ -17,7 +17,6 @@ import {SdmDihService} from './graphs/sdm-dih.service';
 export class HslayersAppComponent {
   /* You can name your app as you like or not at all */
   title = 'hslayers-application';
-  selectedRegion: string;
   constructor(
     /* Inject here all modules from HSLayers-NG which you intend to use */
     public hsConfig: HsConfig /* public properties are visible in the template */,
@@ -25,9 +24,6 @@ export class HslayersAppComponent {
     private hsToastService: HsToastService,
     public sdmDihService: SdmDihService
   ) {
-    sdmDihService.dataLoads.subscribe(
-      () => (this.selectedRegion = this.sdmDihService.regions[0])
-    );
     /* Define and update the HsConfig configuration object */
     this.hsConfig.update({
       datasources: [

src/app/graphs/region-graph/region-graph.component.ts

@@ -25,6 +25,7 @@ export class RegionGraphComponent implements OnChanges {
 
   ngOnChanges(changes: SimpleChanges): void {
     this.processData();
+    this.dataLoaded = true;
   }
 
   processData() {
@@ -34,7 +35,7 @@ export class RegionGraphComponent implements OnChanges {
     const colors = [];
     for (const yearData of Object.values<any[]>(this.sdmDihService.sdmData)) {
       for (const regionData of yearData) {
-        console.log(regionData);
+        //console.log(regionData, this.region);
         if (regionData['MODEL'] !== this.region) {
           continue;
         }