geo attribute / show map: center map to polygon centroid

webapp/components/Map/useMap.js

@@ -3,9 +3,27 @@ import { useCallback, useEffect, useState } from 'react'
 import { PointFactory, Points } from '@openforis/arena-core'
 
 import { useSurveySrsIndex } from '@webapp/store/survey'
+import { GeoJsonUtils } from '@webapp/utils/geoJsonUtils'
+
+const calculateActualCenterPoint = ({ centerPoint, geoJson, markerPoint, srsIndex }) => {
+  if (markerPoint && Points.isValid(markerPoint, srsIndex)) {
+    return markerPoint
+  }
+  if (geoJson) {
+    const centroidFeaturePoint = GeoJsonUtils.centroid(geoJson.geometry)
+    const centroidPoint = GeoJsonUtils.pointFeatureToPoint(centroidFeaturePoint)
+    if (centroidPoint) {
+      return centroidPoint
+    }
+  }
+  if (centerPoint && Points.isValid(centerPoint, srsIndex)) {
+    return centerPoint
+  }
+  return PointFactory.createInstance({ x: 0, y: 0 })
+}
 
 export const useMap = (props) => {
-  const { centerPoint, markerPoint, onMarkerPointChange } = props
+  const { centerPoint, geoJson, markerPoint, onMarkerPointChange } = props
 
   const srsIndex = useSurveySrsIndex()
 
@@ -30,18 +48,13 @@ export const useMap = (props) => {
 
   // on markerPoint update or after SRSs has been initialized, transform point to lat long
   useEffect(() => {
-    const actualCenterPoint =
-      markerPoint && Points.isValid(markerPoint, srsIndex)
-        ? markerPoint
-        : centerPoint && Points.isValid(centerPoint, srsIndex)
-        ? centerPoint
-        : PointFactory.createInstance({ x: 0, y: 0 })
+    const actualCenterPoint = calculateActualCenterPoint({ centerPoint, geoJson, markerPoint, srsIndex })
 
     setState((statePrev) => ({
       ...statePrev,
       centerPositionLatLon: actualCenterPoint ? fromPointToLatLon(actualCenterPoint) : null,
     }))
-  }, [centerPoint, fromPointToLatLon, markerPoint, srsIndex])
+  }, [centerPoint, fromPointToLatLon, geoJson, markerPoint, srsIndex])
 
   const onMarkerPointUpdated = useCallback((markerPointUpdated) => {
     setState((statePrev) => ({ ...statePrev, markerPointUpdated }))

webapp/utils/geoJsonUtils.js

@@ -2,6 +2,8 @@ import area from '@turf/area'
 import centroid from '@turf/centroid'
 import length from '@turf/length'
 
+import { PointFactory } from '@openforis/arena-core'
+
 const countVertices = (geoJson) => {
   const polygon = geoJson.type === 'Feature' ? geoJson.geometry : geoJson
   return polygon?.coordinates?.[0]?.length ?? 0
@@ -20,7 +22,7 @@ const parse = (geoJsonText) => {
 const pointFeatureToPoint = (pointFeature) => {
   if (!pointFeature) return null
   const [x, y] = pointFeature.geometry?.coordinates ?? []
-  return { x, y }
+  return PointFactory.createInstance({ x, y })
 }
 
 const validateFeature = (geoJson) => geoJson?.type === 'Feature' && !!geoJson.geometry

webapp/views/App/views/Data/MapView/GeoAttributeDataLayer/convertDataToGeoJsonPoints.js

@@ -41,7 +41,6 @@ const pointExtractorByNodeDefType = {
   },
   [NodeDef.nodeDefType.geo]: ({ attributeValue }) => {
     const geoJson = JSON.parse(attributeValue)
-
     const centroidFeaturePoint = GeoJsonUtils.centroid(geoJson.geometry)
     const point = GeoJsonUtils.pointFeatureToPoint(centroidFeaturePoint)
     return { point, properties: { data: geoJson } }