Use CPU data filtering

Vizzuality · Jun 13, 2024 · bfa833f · bfa833f
1 parent d6a247a
commit bfa833f
Show file tree

Hide file tree

Showing 2 changed files with 415 additions and 26 deletions.
diff --git a/client/src/containers/map/layer-manager/mask.tsx b/client/src/containers/map/layer-manager/mask.tsx
@@ -1,13 +1,14 @@
 "use client";
 
 import { GeoJsonLayer } from "@deck.gl/layers";
-import { DataFilterExtension, DataFilterExtensionProps } from "@deck.gl/extensions";
 
 import DeckLayer from "@/components/map/layers/deck-layer";
 import { useMemo } from "react";
 import { useSyncRangelandType } from "@/store/map";
 import { useBiomes, useEcoregions } from "@/lib/filters";
 
+import DATA from "@/data/rangeland-ecoregions.json";
+
 interface MaskProps {
   beforeId?: string;
   settings: Record<string, unknown>;
@@ -20,14 +21,9 @@ const Mask = ({ id, beforeId }: MaskProps) => {
   const biomes = useBiomes();
   const ecoregions = useEcoregions();
 
-  const filterCategories = useMemo(() => {
-    if (rangelandType === "rangeland-biomes") return biomes;
-    if (rangelandType === "rangeland-ecoregions") return ecoregions;
-    return [-1];
-  }, [rangelandType, biomes, ecoregions]);
-
-  const c = useMemo(() => {
-    return new GeoJsonLayer<
+  const D = useMemo(() => {
+    const d = DATA as GeoJSON.FeatureCollection<
+      GeoJSON.Geometry,
       {
         objectid: number;
         eco_name: string;
@@ -46,31 +42,52 @@ const Mask = ({ id, beforeId }: MaskProps) => {
         license: string;
         area_km2: number;
         percentage: number;
-      },
-      DataFilterExtensionProps
-    >({
+      }
+    >;
+
+    const features = d.features.filter((f) => {
+      if (rangelandType === "rangeland-biomes") return biomes.includes(f.properties.biome_num);
+      if (rangelandType === "rangeland-ecoregions") return ecoregions.includes(f.properties.eco_id);
+
+      return true;
+    });
+
+    return {
+      ...d,
+      features,
+    };
+  }, [rangelandType, biomes, ecoregions]);
+
+  const c = useMemo(() => {
+    return new GeoJsonLayer<{
+      objectid: number;
+      eco_name: string;
+      biome_num: number;
+      biome_name: string;
+      realm: string;
+      eco_biome_: string;
+      nnh: number;
+      nnh_name: string;
+      eco_id: number;
+      shape_leng: number;
+      shape_area: number;
+      color: string;
+      color_bio: string;
+      color_nnh: string;
+      license: string;
+      area_km2: number;
+      percentage: number;
+    }>({
       id: `${id}-layer-deck`,
-      data: "/data/rangeland-ecoregions.json",
+      data: D,
       // @ts-expect-error - TS doesn't know about the beforeId prop
       beforeId,
       operation: "mask",
       visible: true,
       opacity: 1,
       pickable: false,
-      getFilterCategory: (f) => {
-        if (rangelandType === "rangeland-ecoregions") return f.properties.eco_id;
-        if (rangelandType === "rangeland-biomes") return f.properties.biome_num;
-
-        return -1;
-      },
-      filterCategories,
-      extensions: [new DataFilterExtension({ categorySize: 1 })],
-      updateTriggers: {
-        getFilterCategory: rangelandType,
-        filterCategories: filterCategories,
-      },
     });
-  }, [id, beforeId, rangelandType, filterCategories]);
+  }, [id, D, beforeId]);
 
   return (
     <>