Adding a feature filter function

src/lib/ClusterableVectorTileSource.ts

@@ -6,8 +6,10 @@ import VectorTileSource from 'ol/source/VectorTile.js';
 
 class ClusterableVectorTileSource extends VectorTileSource {
   extent: Extent | null = null;
+  resolution: number | undefined;
   extentProjected: Extent | null = null;
   featuresSent: boolean = false;
+  featureFilter = (feature: Feature, resolution: number | undefined) => feature;
 
   changeHandler = () => {
     this.featuresSent = false;
@@ -20,7 +22,11 @@ class ClusterableVectorTileSource extends VectorTileSource {
 
   constructor(properties: any) {
     properties.format = new MVT({ featureClass: Feature });
-    super(properties);
+    const { featureFilter, ...otherProperties } = properties;
+    super(otherProperties);
+    if (featureFilter) {
+      this.featureFilter = featureFilter;
+    }
     this.addEventListener('change', this.changeHandler);
     console.log({
       caller: 'ClusterableVectorTileSource',
@@ -42,6 +48,7 @@ class ClusterableVectorTileSource extends VectorTileSource {
       projection,
       this: this,
     });
+    this.resolution = resolution;
     if (this.extent === null || !equals(this.extent, extent)) {
       this.extent = extent;
       if (this.projection != null) {
@@ -58,10 +65,11 @@ class ClusterableVectorTileSource extends VectorTileSource {
   };
 
   getFeatures = () => {
-    const result =
+    const result = (
       this.extentProjected !== null
         ? super.getFeaturesInExtent(this.extentProjected)
-        : [];
+        : []
+    ).filter((feature) => this.featureFilter(feature, this.resolution));
     console.log({
       caller: 'ClusterableVectorTileSource',
       method: 'getFeatures',
@@ -74,7 +82,9 @@ class ClusterableVectorTileSource extends VectorTileSource {
   };
 
   getFeaturesInExtent = (extent: Extent) => {
-    const features = super.getFeaturesInExtent(extent);
+    const features = super
+      .getFeaturesInExtent(extent)
+      .filter((feature) => this.featureFilter(feature, this.resolution));
     console.log({
       caller: 'ClusterableVectorTileSource',
       method: 'getFeaturesInExtent',