0% found this document useful (0 votes)
9 views1 page

Geolocation Tracking with JavaScript

The document contains JavaScript code that tracks the user's geolocation when a button is clicked. It retrieves the latitude and longitude, displays it on the webpage, and sends the data to a backend server. Additionally, there is a function to fetch and display past locations associated with a user ID.

Uploaded by

himansinishad770
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views1 page

Geolocation Tracking with JavaScript

The document contains JavaScript code that tracks the user's geolocation when a button is clicked. It retrieves the latitude and longitude, displays it on the webpage, and sends the data to a backend server. Additionally, there is a function to fetch and display past locations associated with a user ID.

Uploaded by

himansinishad770
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd

const trackBtn = document.

getElementById('trackBtn');
const statusDiv = [Link]('status');

[Link]('click', () => {
if ([Link]) {
// Request permission and get location
[Link](
(position) => {
const { latitude, longitude } = [Link];
[Link] = `Location: ${latitude}, ${longitude}`;

// Send to backend (replace with actual user ID from auth)


fetch('[Link] {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: [Link]({ userId: 'exampleUser', latitude, longitude })
}).then(() => [Link]('Location saved'));
},
(error) => {
[Link] = `Error: ${[Link]}`;
},
{ enableHighAccuracy: true, timeout: 10000 }
);
} else {
[Link] = 'Geolocation not supported.';
}
});

// Optional: Fetch and display past locations


function loadLocations(userId) {
fetch(`[Link]
.then(res => [Link]())
.then(data => {
// Render on a map or list (e.g., using [Link] for free maps)
[Link](data);
});
}

You might also like