diff --git a/point.js b/point.js new file mode 100644 index 0000000..3b1cad0 --- /dev/null +++ b/point.js @@ -0,0 +1,82 @@ +document.addEventListener("DOMContentLoaded", () => { + + var mymap = L.map("locationmap").setView([38.891, 139.824], 16); + L.tileLayer('https://{s}.tile.osm.org/{z}/{x}/{y}.png', { + attribution: '© OpenStreetMap contributors' + }).addTo(mymap); + + var locmarker = L.marker(mymap.getCenter()).addTo(mymap); + locmarker.bindPopup("STARTを押してね").openPopup(); + + let watchId = null; + let polyline = L.polyline([], { color: 'blue' }).addTo(mymap); + let totalDistance = 0; + let lastLatLng = null; + + function startLogging() { + if (watchId !== null) return; + + watchId = navigator.geolocation.watchPosition( + (position) => { + const { latitude, longitude } = position.coords; + const latLng = L.latLng(latitude, longitude); + + polyline.addLatLng(latLng); + mymap.setView(latLng, 13); + + if (lastLatLng) { + const distance = lastLatLng.distanceTo(latLng); + totalDistance += distance; + document.getElementById("distance").textContent = totalDistance.toFixed(2); + } + + lastLatLng = latLng; + }, + (error) => { + console.error("Geolocation error:", error); + }, + { + enableHighAccuracy: true, + maximumAge: 0, + timeout: 5000 + } + ); + } + + function stopLogging() { + if (watchId !== null) { + navigator.geolocation.clearWatch(watchId); + watchId = null; + } + } + + function calculateDistance(latLng1, latLng2) { + const R = 6371000; // 地球の半径(m) + const rad = Math.PI / 180; + const dLat = (latLng2.lat - latLng1.lat) * rad; + const dLng = (latLng2.lng - latLng1.lng) * rad; + + const a = Math.sin(dLat / 2) ** 2 + + Math.cos(latLng1.lat * rad) * Math.cos(latLng2.lat * rad) * + Math.sin(dLng / 2) ** 2; + + const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a)); + + return R * c; // 距離(m) + } + + + mymap.on("click", (e) => { + const latLng = e.latlng; + const distance = lastLatLng ? lastLatLng.distanceTo(latLng).toFixed(2) : "計測しています"; + L.marker(latLng) + .addTo(mymap) + .bindPopup(`距離: ${distance} m`) + .openPopup(); + }); + + + document.getElementById("start").addEventListener("click", startLogging); + + document.getElementById("stop").addEventListener("click", stopLogging); +});