Gps Kilometerzähler
Beim Start der Seite wird die Position gespeichert und zeigt dir dann die zurückgelegte Stecke an
Kommentar abgeben zu diesen Beitrag/Code ?Dann hier klicken
Der hier verwendete Code
<div id="tripmeter">
<p>
Starting Location (lat, lon):<br>
<span id="startLat">???</span>°, <span id="startLon">???</span>°
</p>
<p>
Current Location (lat, lon):<br>
<span id="currentLat">???</span>°, <span id="currentLon">???</span>°
</p>
<p>
Distance from starting location:<br>
<span id="distance">0</span> km
</p>
</div>
<style>
#status {
width: 50vw; min-width: 500px;
margin-top: 20px;
}
#status h2 {margin-top: 0px;}
#status p {padding-left: 20px;}
[data-status="off"] ~ #status {
border: 2px solid red;
}
[data-status="on"] ~ #status {
border: 2px solid green;
}
</style>
<header>
<h1>Wake Lock Demo</h1>
</header>