🚨 lint files

src/app/app.component.spec.ts

@@ -5,14 +5,12 @@ class HsConfigMock {
   constructor() {}
 }
 describe('AppComponent', () => {
-  beforeEach(
-    waitForAsync(() => {
-      TestBed.configureTestingModule({
-        declarations: [HslayersAppComponent],
-        providers: [{provide: HsConfig, useValue: new HsConfigMock()}],
-      }).compileComponents();
-    })
-  );
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      declarations: [HslayersAppComponent],
+      providers: [{provide: HsConfig, useValue: new HsConfigMock()}],
+    }).compileComponents();
+  }));
 
   it('should create the app', () => {
     const fixture = TestBed.createComponent(HslayersAppComponent);

src/app/app.component.ts

@@ -4,11 +4,7 @@ import {GeoJSON} from 'ol/format';
 import {OSM, Vector as VectorSource} from 'ol/source';
 import {Tile, Vector as VectorLayer} from 'ol/layer';
 
-import {
-  HsConfig,
-  HsEventBusService,
-  HsToastService
-} from 'hslayers-ng';
+import {HsConfig, HsEventBusService, HsToastService} from 'hslayers-ng';
 
 @Component({
   selector: 'application-root',
@@ -20,9 +16,9 @@ export class HslayersAppComponent {
   title = 'hslayers-application';
   constructor(
     /* Inject here all modules from HSLayers-NG which you intend to use */
-    public hsConfig: HsConfig, /* public properties are visible in the template */
-    private hsEventBusService: HsEventBusService, /* private properties are only visible from within this component class */
-    private hsToastService: HsToastService,
+    public hsConfig: HsConfig /* public properties are visible in the template */,
+    private hsEventBusService: HsEventBusService /* private properties are only visible from within this component class */,
+    private hsToastService: HsToastService
   ) {
     /* Define a geometry of one square polygon */
     const geojsonObject = {
@@ -163,9 +159,10 @@ export class HslayersAppComponent {
         'READY!',
         'Your map is now ready to use.',
         {
-          toastStyleClasses: 'bg-success text-white' /* Use any Bootstrap class here, see https://getbootstrap.com/docs/4.0/utilities/colors/ */
+          toastStyleClasses:
+            'bg-success text-white' /* Use any Bootstrap class here, see https://getbootstrap.com/docs/4.0/utilities/colors/ */,
         }
       );
-    })
+    });
   }
 }

src/app/app.module.ts

@@ -4,8 +4,8 @@ import {NgModule} from '@angular/core';
 import {HslayersAppComponent} from './app.component';
 import {HslayersModule} from 'hslayers-ng';
 
-import {YearGraphModule} from './graphs/year-graph/year-graph.module';
 import {AllInOneModule} from './graphs/all-in-one-graph/all-in-one-graph.module';
+import {YearGraphModule} from './graphs/year-graph/year-graph.module';
 
 @NgModule({
   declarations: [HslayersAppComponent],

src/app/graphs/all-in-one-graph/all-in-one-graph.component.ts

@@ -1,11 +1,9 @@
-import { Component, OnInit } from '@angular/core';
+import {Component} from '@angular/core';
 
 @Component({
   selector: 'all-in-one-graph',
-  templateUrl: 'all-in-one-graph.component.html'
+  templateUrl: 'all-in-one-graph.component.html',
 })
-export class AllInOneGraphComponent implements OnInit {
-  constructor() { }
-
-  ngOnInit() { }
+export class AllInOneGraphComponent {
+  constructor() {}
 }

src/app/graphs/all-in-one-graph/all-in-one-graph.module.ts

@@ -1,6 +1,6 @@
-import { NgModule } from '@angular/core';
+import {NgModule} from '@angular/core';
 
-import { AllInOneGraphComponent } from './all-in-one-graph.component';
+import {AllInOneGraphComponent} from './all-in-one-graph.component';
 
 @NgModule({
   imports: [],
@@ -8,4 +8,4 @@ import { AllInOneGraphComponent } from './all-in-one-graph.component';
   declarations: [AllInOneGraphComponent],
   providers: [],
 })
-export class AllInOneModule { }
+export class AllInOneModule {}

src/app/graphs/sdm-dih.service.ts

@@ -1,5 +1,5 @@
-import { Injectable } from '@angular/core';
-import { HttpClient } from '@angular/common/http';
+import {HttpClient} from '@angular/common/http';
+import {Injectable} from '@angular/core';
 import {Subject} from 'rxjs';
 import {csv} from 'd3';
 
@@ -11,13 +11,10 @@ export class SdmDihService {
   dataLoads: Subject<void> = new Subject();
 
   constructor(private httpClient: HttpClient) {
-    this.loadData().then(
-      () => this.calculateAggregation()
-    );
+    this.loadData().then(() => this.calculateAggregation());
   }
-  
+
   calculateAttractiveness(data) {
-    
     return data;
   }
 
@@ -29,7 +26,7 @@ export class SdmDihService {
       if (!this.aggregatedData[year]) {
         this.aggregatedData[year] = yearAggregated;
       } else {
-        this.aggregatedData[year].push(yearAggregated)
+        this.aggregatedData[year].push(yearAggregated);
       }
     }
     this.dataLoads.next();

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

@@ -1,13 +1,13 @@
-import { Component, OnInit } from "@angular/core";
-import { select } from "d3";
+import {Component} from '@angular/core';
+import {select} from 'd3';
 
-import { SdmDihService } from "../sdm-dih.service";
+import {SdmDihService} from '../sdm-dih.service';
 
 @Component({
-  selector: "year-graph",
-  templateUrl: "year-graph.component.html",
+  selector: 'year-graph',
+  templateUrl: 'year-graph.component.html',
 })
-export class YearGraphComponent implements OnInit {
+export class YearGraphComponent {
   firstYear: string;
   lastYear: string;
   regions = [];
@@ -21,56 +21,63 @@ export class YearGraphComponent implements OnInit {
       this.yearsLoaded = true;
       console.log(this.years);
       this.firstYear = this.years[0];
-      this.lastYear = this.years[this.years.length-1];
-      this.regions = [...new Set(this.sdmDihService.sdmData[this.firstYear].map((yearData) => yearData['MODEL']))];
+      this.lastYear = this.years[this.years.length - 1];
+      this.regions = [
+        ...new Set(
+          this.sdmDihService.sdmData[this.firstYear].map(
+            (yearData) => yearData['MODEL']
+          )
+        ),
+      ];
       console.log(this.regions);
     });
   }
 
-  ngOnInit() {}
-
   drawGraph(region: string) {
-    const regionData = this.sdmDihService.aggregatedData[this.selectedYear].find((row) => row['MODEL'] === region);
+    const regionData = this.sdmDihService.aggregatedData[
+      this.selectedYear
+    ].find((row) => row['MODEL'] === region);
     const width = 200;
     const height = 200;
     //select("#year-graph-place").select("svg")?.remove();
     // append the svg object to the div called 'year-graph-place'
-    const svg = select("#year-graph-place")
-      .append("svg")
-      .attr("width", width)
-      .attr("height", height)
-      .append("g")
+    const svg = select('#year-graph-place')
+      .append('svg')
+      .attr('width', width)
+      .attr('height', height)
+      .append('g')
       .data([regionData])
-      .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
+      .attr('transform', 'translate(' + width / 2 + ',' + height / 2 + ')');
     //const yearData = this.sdmDihService.aggregatedData[this.selectedYear];
     //const color = `rgba(100, 200, 100, ${yearData[0]['Natural_Capital']})`;
     svg
-      .append("circle")
-      .attr("cx", 0)
-      .attr("cy", 0)
-      .attr("r", 50)
-      .attr("stroke", "black")
-      .attr("fill", (d) => {
+      .append('circle')
+      .attr('cx', 0)
+      .attr('cy', 0)
+      .attr('r', 50)
+      .attr('stroke', 'black')
+      .attr('fill', (d) => {
         console.log(d);
         return this.getColor(d['Natural_Capital']);
       });
-    svg.append("text")
-      .attr("x", 50)
-      .attr("y", 50)
-      .attr("dy", ".35em")
+    svg
+      .append('text')
+      .attr('x', 50)
+      .attr('y', 50)
+      .attr('dy', '.35em')
       .text((d) => d['MODEL']);
   }
 
   redrawGraphs() {
     const width = 200;
     const height = 200;
-    select("#year-graph-place").selectAll("svg")?.remove();
+    select('#year-graph-place').selectAll('svg')?.remove();
     for (const region of this.regions) {
       this.drawGraph(region);
     }
   }
 
   getColor(value) {
-    return `rgba(100, 200, 100, ${value})`
+    return `rgba(100, 200, 100, ${value})`;
   }
 }

src/app/graphs/year-graph/year-graph.module.ts

@@ -1,13 +1,13 @@
-import { NgModule } from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {FormsModule} from '@angular/forms';
+import {NgModule} from '@angular/core';
 
-import { YearGraphComponent } from './year-graph.component';
+import {YearGraphComponent} from './year-graph.component';
 
 @NgModule({
-  imports: [CommonModule, FormsModule,],
+  imports: [CommonModule, FormsModule],
   exports: [YearGraphComponent],
   declarations: [YearGraphComponent],
   providers: [],
 })
-export class YearGraphModule { }
+export class YearGraphModule {}