Fix images demo.

lapig-ufg · Oct 12, 2024 · be0e3b7 · be0e3b7
1 parent 856df02
commit be0e3b7
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 9 deletions.
diff --git a/tiles-client/src/app/grid-map/map-grid-landsat/map-grid-landsat.component.ts b/tiles-client/src/app/grid-map/map-grid-landsat/map-grid-landsat.component.ts
@@ -50,8 +50,8 @@ export class MapGridLandsatComponent implements OnInit {
     public lat: number | null = null;
     public lon: number | null = null;
 
-    public landsatYears: number[] = [];
-    public selectedLandsatYear: number = currentYear;
+    public landsatYears: any[] = [];
+    public selectedLandsatYear: number | string = currentYear;
 
     public sentinelPeriods = ["WET", "DRY", "MONTH"];
     public landsatPeriods = ["WET", "DRY", "MONTH"];
@@ -80,6 +80,7 @@ export class MapGridLandsatComponent implements OnInit {
         if (landsatCapabilities) {
             this.landsatYears = landsatCapabilities.year;
         }
+        this.landsatYears.unshift('Todos')
     }
     private addMarker(lat: number, lon: number, map: Map): void {
         const iconFeature = new Feature({
@@ -119,7 +120,7 @@ export class MapGridLandsatComponent implements OnInit {
 
         if (capabilities) {
             for (let year of capabilities.year) {
-                if (year !== this.selectedLandsatYear) {
+                if (this.selectedLandsatYear != 'Todos' && year !== this.selectedLandsatYear) {
                     continue;
                 }
                 if (selectedPeriod === 'MONTH') {
@@ -138,7 +139,11 @@ export class MapGridLandsatComponent implements OnInit {
         }
     }
 
-    private addMap(type: 'sentinel' | 'landsat', mapId: string, periodOrMonth: string, year: number, visparam: string, month?: string): void {
+    private addMap(type: 'sentinel' | 'landsat', mapId: string, periodOrMonth: string,  _year: number | string, visparam: string, month?: string): void {
+          if (_year == 'Todos') {
+            return;
+        }
+        const year = Number(_year);
         if (type === 'sentinel') {
             if (periodOrMonth === 'MONTH') {
                 this.sentinelMaps.push({ month: month as string, year, id: mapId });

diff --git a/tiles-client/src/app/grid-map/map-grid.component.ts b/tiles-client/src/app/grid-map/map-grid.component.ts
@@ -50,8 +50,8 @@ export class MapGridComponent implements OnInit {
     private mapsInstances: { id: string, map: Map }[] = [];
     public lat: number | null = null;
     public lon: number | null = null;
-    public sentinelYears: number[] = [];
-    public selectedSentinelYear: number = currentYear;
+    public sentinelYears: any[] = [];
+    public selectedSentinelYear: number | string = currentYear;
 
     public sentinelPeriods = ["WET", "DRY", "MONTH"];
     public landsatPeriods = ["WET", "DRY", "MONTH"];
@@ -81,6 +81,7 @@ export class MapGridComponent implements OnInit {
         if (sentinelCapabilities) {
             this.sentinelYears = sentinelCapabilities.year;
         }
+        this.sentinelYears.unshift('Todos')
     }
 
     private addMarker(lat: number, lon: number, map: Map): void {
@@ -120,7 +121,7 @@ export class MapGridComponent implements OnInit {
         const capabilities = CAPABILITIES.collections.find(c => c.name === (type === 'sentinel' ? 's2_harmonized' : 'landsat'));
         if (capabilities) {
             for (let year of capabilities.year) {
-                if (year !== this.selectedSentinelYear) {
+                if (this.selectedSentinelYear != 'Todos' && year !== this.selectedSentinelYear) {
                     continue;
                 }
                 if (selectedPeriod === 'MONTH') {
@@ -139,7 +140,11 @@ export class MapGridComponent implements OnInit {
         }
     }
 
-    private addMap(type: 'sentinel' | 'landsat', mapId: string, periodOrMonth: string, year: number, visparam: string, month?: string): void {
+    private addMap(type: 'sentinel' | 'landsat', mapId: string, periodOrMonth: string, _year: number | string, visparam: string, month?: string): void {
+        if (_year == 'Todos') {
+            return;
+        }
+        const year = Number(_year);
         if (type === 'sentinel') {
             if (periodOrMonth === 'MONTH') {
                 this.sentinelMaps.push({month: month as string, year, id: mapId});
@@ -159,6 +164,7 @@ export class MapGridComponent implements OnInit {
     private createMap(mapId: string, periodOrMonth: string, year: number, type: string, visparam: string, month?: string): void {
         setTimeout(() => {
             const url = `https://tm{1-5}.lapig.iesa.ufg.br/api/layers/${type === 'sentinel' ? 's2_harmonized' : 'landsat'}/{x}/{y}/{z}?period=${periodOrMonth}&year=${year}&visparam=${visparam}${periodOrMonth === 'MONTH' ? `&month=${month}` : ''}`;
+            // const url = `http://127.0.0.1:8000/api/layers/${type === 'sentinel' ? 's2_harmonized' : 'landsat'}/{x}/{y}/{z}?period=${periodOrMonth}&year=${year}&visparam=${visparam}${periodOrMonth === 'MONTH' ? `&month=${month}` : ''}`;
             const map = new Map({
                 target: mapId,
                 layers: [

diff --git a/tiles-client/src/index.html b/tiles-client/src/index.html
@@ -3,14 +3,15 @@
     <head>
       <meta charset="utf-8">
       <title>Map Grid</title>
+<!--      <base href="/">-->
       <base href="/tiles/">
       <meta name="viewport" content="width=device-width, initial-scale=1">
       <link rel="icon" type="image/x-icon" href="assets/layout/images/logo.png">
 
       <meta charset="UTF-8">
       <meta name="description" content="The Map Grid Component displays multiple map instances for different periods and years using OpenLayers. Users can interact with the maps to update center coordinates dynamically.">
       <meta name="keywords" content="Map Grid, OpenLayers, Angular, Interactive Maps, Dynamic Maps, TileLayer, XYZ, Geographic Information System, GIS">
-      <meta name="author" content="Jairo Mattos | Tharles de Sousa Andrade | LAPIG">
+      <meta name="author" content="Jairo Matos da Rocha | Tharles de Sousa Andrade | LAPIG">
       <meta name="robots" content="index, follow">
 
       <!-- Open Graph Meta Tags -->