Fix feature properties

lib/layer/featureFormats.mjs

@@ -80,22 +80,24 @@ export function wkt(layer, features) {
 
     const properties = {}
 
+    // Append params.fields to an array of id, and wkt_geometry which are the first and second entries in a wkt feature record.
+    const wkt_fields = Array.from(new Set(['id', 'wkt_geometry', ...layer.params.fields]));
+
     // Populate featureFields values array with feature property values.
-    layer.params.fields?.forEach((field, i) => {
+    wkt_fields?.forEach((field, i) => {
 
-      layer.featureFields[field].values.push(feature[i + 2]);
+      layer.featureFields[field]?.values?.push(feature[i]);
 
-      properties[field] = feature[i + 2]
+      properties[field] = feature[i]
     })
 
     // Return feature from geometry with properties.
     return new ol.Feature({
-      id: feature.shift(),
-      geometry: formatWKT.readGeometry(feature.shift(), {
+      geometry: formatWKT.readGeometry(properties.wkt_geometry, {
         dataProjection: 'EPSG:' + layer.srid,
         featureProjection: 'EPSG:' + layer.mapview.srid,
       }),
-      ...properties
+      ...properties,
     })
 
   })

lib/layer/format/vector.mjs

@@ -150,10 +150,10 @@ export default function vector(layer) {
 
       } else {
 
-        let fP = features[0].getProperties()
+        const featureProperties = features[0].getProperties()
 
         // Set feature properties for for single location cluster.
-        Object.entries(fP.properties || {}).forEach(entry => {
+        Object.entries(featureProperties).forEach(entry => {
           F.set(entry[0], entry[1], true)
         })
 

lib/layer/themes/graduated.mjs

@@ -23,7 +23,7 @@ export default function (theme, feature) {
   let catValue = Array.isArray(feature.properties.features) ?
 
     // Reduce array of features to sum catValue
-    feature.properties.features.reduce((total, F) => total + Number(F.getProperties().properties[theme.field]), 0) :
+    feature.properties.features.reduce((total, F) => total + Number(F.getProperties()[theme.field]), 0) :
 
     // Get catValue from cat or field property.
     parseFloat(feature.properties[theme.field]);

lib/location/nnearest.mjs

@@ -27,7 +27,7 @@ Clicking on a list element allows to get the location associated with the query
 */
 export default async function nnearest(params) {
 
-  const properties = params.feature.getProperties();
+  const featureProperties = params.feature.getProperties();
 
   const fGeom = params.feature.getGeometry();
   const fCoord = fGeom.getCoordinates();
@@ -45,7 +45,7 @@ export default async function nnearest(params) {
       label: params.layer.cluster?.label || params.layer.qID,
       table: params.table,
       filter: params.layer.filter?.current,
-      n: properties.count > (params.max || 99) ? (params.max || 99) : properties.count,
+      n: featureProperties.count > (params.max || 99) ? (params.max || 99) : featureProperties.count,
       x: coords[0],
       y: coords[1],
       coords: coords,
@@ -55,17 +55,17 @@ export default async function nnearest(params) {
   const list = response.map(
     li => mapp.utils.html.node`<li 
     onclick=${e => {
-    params.mapview.popup(null)
-    mapp.location.get({
-      layer: params.layer,
-      table: params.table,
-      id: li.id,
-      marker: ol.proj.transform(
-        li.coords,
-        'EPSG:' + params.layer.srid,
-        'EPSG:' + params.mapview.srid),
-      })
-    }}>${li.label || '"' + params.layer.cluster?.label + '"'}`)
+        params.mapview.popup(null)
+        mapp.location.get({
+          layer: params.layer,
+          table: params.table,
+          id: li.id,
+          marker: ol.proj.transform(
+            li.coords,
+            'EPSG:' + params.layer.srid,
+            'EPSG:' + params.mapview.srid),
+        })
+      }}>${li.label || '"' + params.layer.cluster?.label + '"'}`)
 
   const content = mapp.utils.html.node`<ul class="list">${list}`;
 

lib/mapview/interactions/highlight.mjs

@@ -213,7 +213,7 @@ export default function highlight(params) {
       // Compose candidate key from layerKey and featureID.
       const key = `${layerKey}!${featureID}`
 
-      candidates[key] = {key, F, L}
+      candidates[key] = { key, F, L }
     }
 
     const options = {
@@ -235,7 +235,7 @@ export default function highlight(params) {
 
       // The highlight hasn't changed.
       return;
-    }   
+    }
 
     // Find feature from key which is not in candidates set.
     const feature = candidates[Object.keys(candidates).find(key => !mapview.interaction.candidateKeys.has(key))]
@@ -340,7 +340,7 @@ export default function highlight(params) {
 
     // Remove any existing popup. e.g. Cluster select dialogue.
     mapview.popup(null)
-    
+
     if (!mapview.interaction.current && typeof mapview.interaction.noLocationClick === 'function') {
 
       // Execute the noLocationClick method
@@ -402,35 +402,36 @@ export default function highlight(params) {
   function getFeature(feature) {
 
     // Get the properties of the current highlight feature.
-    const properties = feature.F.getProperties();
+    const featureProperties = feature.F.getProperties();
 
     // The feature is a cluster feature.
-    if (properties.count > 1) {
+    if (featureProperties.count > 1) {
 
       const features = feature.F.get('features')
 
       // Features are clustered in source.
       if (Array.isArray(features)) {
 
         // Get list of cluster feature label and id.
-        let featuresList = features.map(f => {
-          let F = f.getProperties()
+        const featuresList = features.map(F => {
+          const featureProperties = F.getProperties()
           return {
-            id: F.id,
-            label: F.properties[feature.layer.cluster?.label]
+            id: featureProperties.id,
+            label: featureProperties[feature.layer.cluster?.label]
           }
         })
 
         // Create list for cluster features.
         const list = featuresList.map(
           li => mapp.utils.html.node`<li
           onpointerup=${e => {
-          mapview.popup(null)
-          mapp.location.get({
-            layer: feature.layer,
-            table: feature.layer.table || feature.layer.tableCurrent(),
-            id: li.id
-          })}}>${li.label || li.id}`)
+              mapview.popup(null)
+              mapp.location.get({
+                layer: feature.layer,
+                table: feature.layer.table || feature.layer.tableCurrent(),
+                id: li.id
+              })
+            }}>${li.label || li.id}`)
 
         const content = mapp.utils.html.node`<ul class="list">${list}`;
 

lib/plugins/feature_info.mjs

@@ -37,23 +37,23 @@ export function feature_info(plugin, mapview) {
       mapview.interactions.highlight({
         getFeature: feature => {
 
-          const properties = feature.F.getProperties()
+          const featureProperties = feature.F.getProperties()
 
           // The OL Styles array is meaningless for the feature_info popup.
-          delete properties.Styles
+          delete featureProperties.Styles
 
           if (!plugin.geometry) {
 
-            delete properties.geometry
+            delete featureProperties.geometry
           }
 
           // Check for cluster feature.
-          if (Array.isArray(properties.features)) {
+          if (Array.isArray(featureProperties.features)) {
 
             // Reduce features to length or properties dependent on the flag.
-            properties.features = plugin.features
-              ? properties.features.map(F => F.getProperties().properties[feature.layer.cluster.label])
-              : properties.features.length
+            featureProperties.features = plugin.features
+              ? featureProperties.features.map(F => F.getProperties()[feature.layer.cluster.label])
+              : featureProperties.features.length
           }
 
           if (plugin.log) {
@@ -64,7 +64,7 @@ export function feature_info(plugin, mapview) {
           const feature_info = {
             id: feature.id,
             layer: feature.layer.key,
-            properties,
+            properties: featureProperties,
           }
 
           const content = mapp.utils.html.node`<pre

lib/utils/olStyle.mjs

@@ -55,7 +55,7 @@ export default function olStyle(style, feature) {
       } else {
 
         iconStyle(style, style.icon)
-      }      
+      }
 
       function iconStyle(style, icon) {
 
@@ -84,8 +84,8 @@ export default function olStyle(style, feature) {
           zIndex: style.zIndex
         }))
       }
-    } 
-    
+    }
+
     if (style.fillColor || style.strokeColor) {
 
       // Create OL fill.
@@ -129,6 +129,6 @@ export default function olStyle(style, feature) {
 
   // Set Styles object to cache style.
   feature?.set?.('Styles', Styles, true)
-  
+
   return Styles
 }

tests/lib/ui/locations/entries/pin.test.mjs

@@ -12,7 +12,7 @@ export async function pinTest(mapview) {
         await codi.it('Needs to be able to create a pin element with a scale of 4', async () => {
 
             //Set the one pin style to have a scale of 4
-            mapview.layers['location_get_test'].infoj.find(entry => entry.type === 'pin').style ??= { scale: 4 };
+            mapview.layers['location_get_test'].infoj.find(entry => entry.type === 'pin').style ??= { icon: { scale: 4 } };
 
             //Mock the location
             const location = await mockLocation(mapview);