Also wenn es nur ums tracken geht... das braucht keine App, das geht schon so. Ein paar Kentnisse sind aber auch hier Voraussetzung, versteht sich - beispielsweise sollte kein halbwegs moderner Browser es erlauben, den Standort auszulesen, wenn die Website per http aufgerufen wird. Sprich, ein Zertifikat (kann ruhig ein eigenes sein) fürs https wäre dann notwendig. Wenn Du das hast, @rednag - hf&gl:
Dann müsstest Du nurnoch, anstatt die Daten unten im #info auszugeben, den Kram an den Server schicken und dort in eine Datenbank verfrachten oder ähnliches. Und, naja, halt wieder auslesen und darstellen, aber mit ein bisschen Motivation und Durchhaltevermögen schaffst Du das schon
Der Parameter watch aktiviert dabei https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/watchPosition - dort steht auch nochmal der Aspekt bezüglich https und welche Browser das unterstützen.
HTML:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta charset="utf-8">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.slim.min.js"></script>
<style>
html, body {height: 100%; margin: 0px;}
#map {width: 100%; height: calc(100% - 32px);}
#info {position: fixed; width: 100%; bottom: 0px; height: 32px; font-size: 12px; overflow-y: scroll;}
</style>
</head>
<body>
<div id="map"></div>
<div id="info"></div>
<script type="text/javascript">
var map = new L.Map('map');
var tile_url = 'https://{s}.tile.openstreetmap.de/tiles/osmde/{z}/{x}/{y}.png';
var copyright = 'Map data © <a href="https://openstreetmap.org">OpenStreetMap</a> contributors';
var osm = new L.TileLayer(tile_url, { maxZoom: 16, attribution: copyright });
map.addLayer(osm);
function onLocationFound(e) {
var radius = e.accuracy / 2;
L.marker(e.latlng).addTo(map);
L.circle(e.latlng, radius).addTo(map);
$("#info").html($("#info").html() + e.timestamp + ": " + e.latlng + ", ").scrollTop($("#info").prop("scrollHeight"));
}
map.on('locationfound', onLocationFound);
map.locate({ setView: true, maxZoom: 16, watch: true, enableHighAccuracy: true });
</script>
</body>
</html>
Der Parameter watch aktiviert dabei https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/watchPosition - dort steht auch nochmal der Aspekt bezüglich https und welche Browser das unterstützen.