diff --git a/dist/js/field.js b/dist/js/field.js
index 448fdfa..0e7985e 100644
--- a/dist/js/field.js
+++ b/dist/js/field.js
@@ -779,16 +779,10 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 
     computed: {
         geojson: function geojson() {
-            if (this.type == "LatLon") {
+            if (this.type == "LatLon" || this.type == "LatLonField") {
                 return {
                     type: 'Point',
-                    coordinates: [this.value[this.longitude_field], this.value[this.latitude_field]]
-                };
-            } else if (this.type == "LatLonField") {
-                var coords = this.value.split(/[ ,]+/).filter(Boolean);
-                return {
-                    type: 'Point',
-                    coordinates: [coords[1], coords[0]]
+                    coordinates: [this.value.lon, this.value.lat]
                 };
             } else if (this.type == "GeoJSON") {
                 return JSON.parse(this.value);
diff --git a/resources/js/components/MapDetail.vue b/resources/js/components/MapDetail.vue
index c5ae3da..ec2a336 100644
--- a/resources/js/components/MapDetail.vue
+++ b/resources/js/components/MapDetail.vue
@@ -89,21 +89,12 @@ export default {
     },
     computed: {
         geojson(){
-            if(this.type == "LatLon"){
+            if(this.type == "LatLon" || this.type == "LatLonField"){
                 return {
                     type: 'Point',
                     coordinates: [
-                        this.value[this.longitude_field],
-                        this.value[this.latitude_field],
-                    ]
-                }
-            }else if(this.type == "LatLonField"){
-                let coords = this.value.split(/[ ,]+/).filter(Boolean);
-                return {
-                    type: 'Point',
-                    coordinates: [
-                        coords[1],
-                        coords[0]
+                        this.value.lon,
+                        this.value.lat,
                     ]
                 }
             }else if(this.type == "GeoJSON"){
diff --git a/src/Map.php b/src/Map.php
index 2d86f39..7836fdc 100644
--- a/src/Map.php
+++ b/src/Map.php
@@ -27,7 +27,6 @@ public function spatialType($type){
     }
 
     public function latitude($latitude_field){
-
         $this->attribute = null;
 
         return $this->withMeta([
@@ -37,7 +36,7 @@ public function latitude($latitude_field){
 
     public function longitude($longitude_field){
         $this->attribute = null;
-
+        
         return $this->withMeta([
             'longitude_field' => $longitude_field
         ]);
@@ -51,6 +50,33 @@ public function geojson($geojson_field){
         ]);
     }
 
+    public function resolveAttribute($resource, $attribute = null){
+        switch($this->meta['spatialType']){
+            case 'LatLon':
+                return [
+                    'lat' => $resource->{$this->meta['latitude_field']},
+                    'lon' => $resource->{$this->meta['longitude_field']},
+                ];
+            break;
+            case 'LatLonField':
+                $parts = collect(explode(',',$resource->{$attribute}))->map(function($item){
+                    return trim($item);
+                });
+
+                return [
+                    'lat' => $parts[0],
+                    'lon' => $parts[1],
+                ];
+            break;
+            case 'GeoJSON':
+                return $resource->{$attribute};
+            break;
+            default:
+                return $resource->{$attribute};
+            break;
+        }
+    }
+
     // protected function fillAttributeFromRequest(NovaRequest $request,
     //                                             $requestAttribute,
     //                                             $model,