@performant-software/geospatial 3.1.18-beta.0 → 3.1.18-beta.10

package/types/components/CertaintyLayer.js.flow

@@ -1,6 +1,6 @@
 // @flow
 
-import React from 'react';
+import React, { useMemo } from 'react';
 import { Layer, Source } from 'react-map-gl/maplibre';
 import MapStyles from '../utils/MapStyles';
 import MapUtils from '../utils/Map';
@@ -14,18 +14,24 @@ type Props = {
  * Renders circles with the given certainty_radius circumference around all points in a new layer.
  */
 const CertaintyLayer = (props: Props) => {
-  const circles = MapUtils.getCertaintyCircles([props.geometry], () => props.certaintyRadius);
+  const data = useMemo(() => {
+    if (props.geometry) {
+      return MapUtils.toCertaintyCircle(props.geometry, props.certaintyRadius);
+    } else {
+      return {};
+    }
+  }, [props.geometry, props.certaintyRadius]);
 
   return (
     <Source
-      data={circles}
+      data={data}
       type='geojson'
     >
       <Layer
         {...MapStyles.fill}
         id='certainty-layer'
         paint={{
-          ...MapStyles.fill.paint,
+          ...MapStyles.fill.paint
         }}
       />
     </Source>

package/types/utils/Map.js.flow

@@ -26,36 +26,45 @@ const buildCircle = (point, radius) => (
   circle(point.coordinates, radius, { units: 'kilometers', steps: 32 })
 );
 
-/**
- * Returns a GeoJSON feature collection containing circles for each item in the given array.
- */
-const getCertaintyCircles = (
-  items,
-  getCertaintyRadius: (item: any) => number | undefined
-) => {
-  const features = [];
-
-  for (const item of items) {
-    if (getCertaintyRadius(item)) {
-      if (item.geometry?.type === 'FeatureCollection') {
-        for (const childFeature of item.geometry.features) {
-          if (childFeature.geometry?.type === 'Point') {
-            features.push(buildCircle(childFeature.geometry, getCertaintyRadius(item)));
-          }
-        }
-      } else if (item.geometry.type === 'GeometryCollection') {
-        for (const geometry of item.geometry.geometries) {
-          if (geometry.type === 'Point') {
-            features.push(buildCircle(geometry, getCertaintyRadius(item)));
-          }
-        }
-      } else if (item.geometry?.type === 'Point') {
-        features.push(buildCircle(item.geometry, getCertaintyRadius(item)));
+const toCertaintyCircle = (item, radius: number) => {
+  if (item.geometry?.type === 'FeatureCollection') {
+    let children = [];
+
+    for (const childFeature of item.geometry.features) {
+      if (childFeature.geometry?.type === 'Point') {
+        const { geometry, type } = buildCircle(childFeature.geometry, radius);
+        children.push({
+          ...childFeature,
+          geometry,
+          type
+        });
       }
     }
+
+    return {
+      ...item,
+      geometry: {
+        type: 'GeometryCollection',
+        geometries: children
+      }
+    };
+  } else if (item?.type === 'GeometryCollection') {
+    return {
+      ...item,
+      geometries: item.geometries.map((geometry) => geometry.type === 'Point'
+        ? buildCircle(geometry, radius)
+        : geometry)
+    };
+  } else if (item.geometry?.type === 'Point') {
+    const { geometry, type } = buildCircle(item.geometry, radius);
+    return {
+      ...item,
+      geometry,
+      type
+    };
   }
 
-  return featureCollection(features);
+  return item;
 };
 
 /**
@@ -204,7 +213,7 @@ const validateCoordinates = (coordinates) => {
 
 export default {
   addGeoreferenceLayer,
-  getCertaintyCircles,
+  toCertaintyCircle,
   getBoundingBox,
   removeLayer,
   toFeature,