[{"lat":37.7749,"lng":-122.4194},{"lat":51.5074,"lng":-0.1278},{"lat":13.0827,"lng":80.2707},{"lat":-33.8688,"lng":151.2093},{"lat":40.7128,"lng":-74.006}] // Initialize the map const map = L.map('map').setView([20, 0], 2); // Default view (centered globally) // Add OpenStreetMap tiles L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 19, }).addTo(map); // Function to load visitor data function loadVisitorData() { fetch('/api/get-visitors.php') // Fetch visitor data from the PHP API .then(response => response.json()) .then(data => { data.forEach(visitor => { L.marker([visitor.lat, visitor.lng]).addTo(map) .bindPopup(`Visitor at Lat: ${visitor.lat}, Lng: ${visitor.lng}`) .openPopup(); }); }) .catch(error => console.error('Error fetching visitor data:', error)); } // Initial load loadVisitorData(); // Refresh every 30 seconds for real-time updates setInterval(loadVisitorData, 30000);