This is in order. Was just wondering whether this means, I will end up with a different app from the mainstream?
Yes 
Ok. Thank you. Will do so.
Hello, I tried the first code on this post and the results are not 2 circles on the map as shown in the diagram. There’s nothing happening.
I want to make a system where I enter coordinates (longitude and latitude) then points are created and joined on the map. How can I go about it?
Can someone explain how can I make a Geolocation based Attendance Employee check-in system?
- As the Employee goes to the Employee check-in its current location should be fetched and when he saves it, it should store the current location.
- The Employee does not have the permission to change the location, no even draw tools provided by geolocation.
I tried to make some changes in geolocation.js file frappe.
I was able to hide all the control options, but it was not storing the current location.
Thanks in advance!
Hope It helps someone!
Hello,
I have added above code my_location, but its not working, Could you please guide me where to add the above code and save in DB
Regards,
Sathish
The code shared as a cross linked post is using Google maps. Continue the conversation on that thread. This thread is for the geolocation field that uses leafletjs. It’ll cause confusion for readers.
2 Likes
Hi @revant_one i got error on geoLocation in my erpnext
can u help me?
it makes entirely docType error
Unable to handle success response {message: Array(0)}
request.js:251 ReferenceError: L is not defined
at _a12.bind_leaflet_map (geolocation.js:71)
at _a12.make_map (geolocation.js:30)
at _a12.make_wrapper (geolocation.js:21)
at _a12.make (base_control.js:16)
at _a12.make (base_input.js:5)
at new BaseControl (base_control.js:4)
at new _a (base_input.js:1)
at new _a2 (data.js:3)
at new _a12 (geolocation.js:3)
at Object.frappe.ui.form.make_control (control.js:46)
currently using erpnext v13.5.2
Hi man, yes I did.
In your web form file you should include the following:
frappe.ready(function() {
frappe.require([//TODO: a veces funciona, a veces no carga
'/assets/frappe/js/frappe/ui/colors.js',
'/assets/frappe/js/lib/leaflet/leaflet.js',
'/assets/frappe/js/lib/leaflet/leaflet.draw.js',
'/assets/frappe/js/lib/leaflet/L.Control.Locate.js',
'/assets/frappe/js/lib/leaflet/easy-button.js',
'/assets/frappe/js/lib/leaflet/leaflet.css',
'/assets/frappe/js/lib/leaflet/leaflet.draw.css',
'/assets/frappe/js/lib/leaflet/L.Control.Locate.css',
'/assets/frappe/js/lib/leaflet/easy-button.css',
], () => {
//your code here...
})
})
This should be done in build time but didn’t succed trying that. It’s ugly but works.
1 Like
Thanks for the code. You mind showing how you added the field. Please 
jQuery(document).ready(function(){
//first add a web form field of any datatype and use it below to place your map div
// in my case this was called "location-field"
$("[data-fieldname=location-field]").parent('form').attr("id","location-form").prepend( "<div id='map' class='input-max-width'></div>" ); //create map field
frappe.require([
'/assets/frappe/js/lib/leaflet/leaflet.js',
'/assets/frappe/js/lib/leaflet/leaflet.draw.js',
'/assets/frappe/js/lib/leaflet/L.Control.Locate.js',
'/assets/frappe/js/lib/leaflet/easy-button.js',
'/assets/frappe/js/lib/leaflet/leaflet.css',
'/assets/frappe/js/lib/leaflet/leaflet.draw.css',
'/assets/frappe/js/lib/leaflet/L.Control.Locate.css',
'/assets/frappe/js/lib/leaflet/easy-button.css',
], () => {
let map = L.map("map").locate({setView: true, enableHighAccuracy: true});
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
var marker = L.marker(0,0).addTo(map);
map.on('move', function () {
marker.setLatLng(map.getCenter());
});
})
});
Finally got the map to show, now I’ve gotta figure out how to receive the value. Will probably use a hidden field to save the latitude and longitude.
If I remember well, I had to add “Geolocation” in the list of Options in the fieldtype within Web Form Field doctype. Doing this you can use it on the webform you are using. For example, if you need a geolocation field in the Address webform, you should go to that web form (/desk#Form/Web Form/addresses in v12) and add the field with the Geolocation fieldtype. Only then you can use the code I post before. The data is stored automatically, like any other fieldtype in a webform.
Sorry, I forgot to mention that.
No way 
I spent over 3 hours hacking this half-baked solution. Hahaha. Thanks, I’ll give it a shot!
@revant_one can u pls help on this one.
at the moment a user has to manually select a pin n drop in the map n then save,
can the pin come by default on the current location so user dont have to manually put it…
i want to make it a “read only” field in attandence check in and so we should know where user checkin from… if usr can manually select then they can sit at home n drop pin at office location n checkin… which is very wrong…
any u show me some light buddy…
Well I solved this by inserting google maps into a geolocation html filed
Hi, right now i have problems using the geolocation field to just show the geolocation of the address I have on my document. I know I will have to convert the address to coordinates but how do I feed these coordinates to the geolocation field to display this location on the document?
Store the geojson in the field
Refer the example.