Operate on topologies instead of features

package.json

@@ -31,13 +31,15 @@
     "@ng-icons/tabler-icons": "^29.5.1",
     "@tanstack/angular-query-experimental": "^5.61.4",
     "@types/geojson": "^7946.0.14",
+    "@types/topojson-client": "^3.1.5",
     "flowbite": "^2.5.2",
     "geojson": "^0.5.0",
     "jose": "^5.9.4",
     "luxon": "^3.5.0",
     "maplibre-gl": "^4.6.0",
     "ngx-logger": "^5.0.12",
     "rxjs": "~7.8.0",
+    "topojson-client": "^3.1.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.14.10"
   },

src/app/components/map-libre/map-libre.component.html

@@ -10,16 +10,16 @@
   <mgl-control mglAttribution position="top-left" [compact]="true" [customAttribution]="'MapLibre | geoportal.gov.pl'"></mgl-control>
   @if (geoFeatureDataSvc.borderInfoExt(); as bi) {
     <!-- <ng-container *ngIf="fcStatic as features"> -->
-    <mgl-geojson-source id="borders" [data]="bi" promoteId="TERYT"> </mgl-geojson-source>
+    <mgl-geojson-source id="borders" [data]="bi" promoteId="ID"> </mgl-geojson-source>
 
     <mgl-layer
       id="borders-unlocked"
       type="fill"
       source="borders"
       [paint]="{
         'fill-antialias': true,
-        'fill-color': ['match', ['get', 'unlockedArea'], 'WOJ', '#4c0519', 'POW', '#9f1239', 'GMI', '#e11d48', '#000000'],
-        'fill-opacity': ['match', ['get', 'unlockedArea'], 'NONE', 0.1, 0.7],
+        'fill-color': ['match', ['get', 'unlockedArea'], 'Y', '#e11d48', '#000000'],
+        'fill-opacity': ['match', ['get', 'unlockedArea'], 'Y', 0.7, 0.1],
       }"
     />
     <mgl-layer

src/app/components/map-libre/map-libre.component.ts

@@ -36,11 +36,11 @@ export class MapLibreComponent implements OnDestroy {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   bordersSelectedFilter = computed<any>(() => {
     const regionId = this.regionId();
-    if (regionId === '0') {
+    if (regionId === '') {
       return true;
     }
     if (regionId) {
-      const filter2 = ['any', ['==', ['get', 'TERYT'], regionId], ['==', ['get', 'COU_ID'], regionId], ['==', ['get', 'VOI_ID'], regionId]];
+      const filter2 = ['any', ['==', ['index-of', regionId, ['get', 'ID']], 0]];
       this.loggerSvc.info('Borders selected filter', filter2);
       return filter2;
     } else {

src/app/components/map-popup/map-popup.component.ts

@@ -20,7 +20,7 @@ export class MapPopupComponent {
   regionInfo = computed(() => {
     const regionId = this.regionId();
     if (regionId) {
-      return this.admSvc.getAdmInfo(regionId);
+      return this.admSvc.getAdmInfo(regionId.replace('PL', ''));
     }
     return undefined;
   });
@@ -92,15 +92,15 @@ export class MapPopupComponent {
     if (regionId) {
       const length = regionId.length;
       switch (length) {
-        case 2:
-          this.regionId.set('0');
-          break;
         case 4:
-          this.regionId.set(regionId.substring(0, 2));
+          this.regionId.set('PL');
           break;
-        case 7:
+        case 6:
           this.regionId.set(regionId.substring(0, 4));
           break;
+        case 9:
+          this.regionId.set(regionId.substring(0, 6));
+          break;
         default:
           break;
       }

src/app/services/adm.service.ts

@@ -101,8 +101,8 @@ export class AdmService implements OnDestroy {
   private youForgotPoland() {
     this.admInfo.update((admInfo) => {
       if (admInfo) {
-        admInfo.set('0', {
-          TERYT: '0',
+        admInfo.set('', {
+          TERYT: '',
           name: 'Polska',
           area: 312696,
           population: 37636508,

src/app/services/borders.service.ts

@@ -7,6 +7,8 @@ import { FeatureCollection } from 'geojson';
 import { CustomNGXLoggerService } from 'ngx-logger';
 import { LoadingInfo } from '../models/loading_info';
 import { gunzip } from '../utils/gunzip';
+import { feature } from 'topojson-client';
+import { Topology } from 'topojson-specification';
 
 @Injectable({
   providedIn: 'root',
@@ -58,9 +60,12 @@ export class BordersService implements OnDestroy {
     this.downloadSub = request$
       .pipe(
         filter((event) => event.type === HttpEventType.Response),
-        switchMap((event) => (event.body ? gunzip<FeatureCollection>(event.body) : of(undefined))),
+        switchMap((event) => (event.body ? gunzip<Topology>(event.body) : of(undefined))),
       )
-      .subscribe((fc) => {
+      .subscribe((tpl) => {
+        this.loggerSvc.info('Download completed');
+        this.loggerSvc.info(tpl);
+        const fc = tpl ? (feature(tpl, tpl.objects['data']) as FeatureCollection) : undefined;
         if (fc) {
           this._borderInfo.set(fc);
           this._loadProgress.update((lp) => {

src/app/services/geo-feature-data.service.ts

@@ -98,23 +98,17 @@ export class GeoFeatureDataService {
   ]);
 
   borderInfoExt = computed<FeatureCollection<Geometry, GeoJsonProperties> | undefined>(() => {
-    const featuresSimplified = new Set(Array.from(this.unlockedFeatures).map((id) => id.replace('PL', '')));
+    const featuresSimplified = this.unlockedFeatures; //new Set(Array.from(this.unlockedFeatures).map((id) => id.replace('PL', '')));
     const allBorders = this.bordersSvc.borderInfo();
     if (allBorders) {
       const features_ext = allBorders.features.map((f) => {
-        let unlockedArea = 'NONE';
-        if (featuresSimplified.has(f.properties!['VOI_ID'])) {
-          unlockedArea = 'WOJ';
-        } else if (featuresSimplified.has(f.properties!['COU_ID'])) {
-          unlockedArea = 'POW';
-        } else if (featuresSimplified.has(f.properties!['TERYT'])) {
-          unlockedArea = 'GMI';
-        }
+        const unlockedArea = featuresSimplified.has(f.properties!['ID']) ? 'Y' : 'N';
+
         return {
           ...f,
           properties: {
             ...f.properties,
-            unlockedArea: unlockedArea,
+            unlockedArea,
           },
         };
       });

src/environments/environment.development.ts

@@ -3,7 +3,7 @@ import { NgxLoggerLevel } from 'ngx-logger';
 export const environment = {
   baseBorderUrl: 'https://static.rowerowegminy.pl/geojsonfixedlite/',
   admInfoUrl: 'https://static.rowerowegminy.pl/adm/combolc.json.gz',
-  borderInfoUrl: 'https://static.rowerowegminy.pl/gs200.json.gz',
+  borderInfoUrl: 'https://static.rowerowegminy.pl/tpy5e_3.json.gz',
   coaBaseUrl: 'https://static.rowerowegminy.pl/coa/',
   loggerLevel: NgxLoggerLevel.DEBUG,
   clientId: '133568',

src/environments/environment.ts

@@ -3,7 +3,7 @@ import { NgxLoggerLevel } from 'ngx-logger';
 export const environment = {
   baseBorderUrl: 'https://static.rowerowegminy.pl/geojsonfixedlite/',
   admInfoUrl: 'https://static.rowerowegminy.pl/adm/combolc.json.gz',
-  borderInfoUrl: 'https://static.rowerowegminy.pl/gs200.json.gz',
+  borderInfoUrl: 'https://static.rowerowegminy.pl/tpy5e_3.json.gz',
   coaBaseUrl: 'https://static.rowerowegminy.pl/coa/',
   loggerLevel: NgxLoggerLevel.WARN,
   clientId: '133568',